Canvas remove inline title?

[KevF]

Whilst I’m really enjoying playing with Canvas, one annoyance is that I have inline titles turned on which makes the title appear above the card and inside the card. Is there a way to disable this?

Things I have tried

• No option apparent in the canvas add on
• No description of this issue in the helpfile

What I’m trying to do

• Have inline title turned on for standard page rendering
• Have inline title turned off for rendering within canvas

Thanks in advance

[Olondre]

You can use this snippet for that:

    .canvas .inline-title {
        display: none;
    }

You can also remove the title above the card if you want to. Here’s the snippet for that:

    .canvas-node-label {
        display: none;
    }

I prefer to be able to see the title above the card if I’m hovering it:

    .canvas-node-label {
        opacity: 0;
    }
    .canvas-node-label:hover {
        opacity: 1;
    }

[KevF]

@Olondre

    .canvas .inline-title {
        display: none;
    }

Thanks, I can get the second bit of code working, but not the first?

[Olondre]

They are all working for me. I don’t know what the problem could be on your end. Maybe a theme or plugin?

EDIT: You could try and use this as an alternative:

.canvas-node-container .inline-title {
    display: none;
}

[nynthes]

sorry but where do i write this code :3

[ariehen]

You create a .css file (it can be named anything), paste in that “CSS snippet” code above, save the file, and then enable it in Settings > Appearance. More details here:

CSS snippets - Obsidian Help

[Carlos2024]

How to make the .css file take effect to a specific canvas?

[ariehen]

@Carlos2024

How to make the .css file take effect to a specific canvas?

To target a specific canvas file, you need the GitHub - Mara-Li/obsidian-canvas-css-class: A plugin that will add a css class to your canvas & adding to each canvas the path to help personnalization community plugin. Once that is installed and enabled, restart or reload Obsidian.

You can then use CSS to target specific Canvases. e.g.

/* be sure to use the exact path and name of your canvas */
[data-canvas-path="assets/canvas/test canvas.canvas"] .canvas-node-container .inline-title {
    display: none;
}