Hiding YAML in Edit Mode

Feature archive
,
1

Use case or problem

YAML appears to have won the battle for the preferred metadata section format. Obsidian is also supporting it more directly with support for aliases. This frontmatter is only going to grow in size - and is potentially in every file.

Unfortunately, the requirement to place the metadata at the top of the text file goes against many design rules by getting in between the meat of note and the interface. As yaml headers expand, the true content of the note will get pushed further and further down and the visual clutter will increase.

Ideally, it would be nice to have the YAML metadata be visible only when you need to access it, and not take front stage for every note at the top of the page.

Similar discussions from other forums:

Proposed solution

A couple of options:

  1. Provide a global hotkey that turns on and off the display of YAML headers that is persistent. That way you can turn it off and forget about it.
  2. Provide a separate YAML editor panel that will move the YAML text out of the primary view (See the discussion here)
  3. Support having the YAML code at the end of the document - this would at least get it out of the way

Current workaround (optional)

Currently I’ve moved all YAML text to the bottom just to get it out of the way. Dataview still supports this, but Obsidian known keys like aliases: will not support it.

Also, you can hide the metadata by switching to the preview mode. Even if you use this as compromise, a WYSIWYG editor will reopen this problem.

Related feature requests (optional)

Thanks for considering this!

37 Likes
2

I like the idea of a hotkey to collapse/expand YAML in the editor.

11 Likes
3

I just fold the YAML whenever I need to hide it. As long as Fold indent is enabled in settings, you can fold/unfold a YAML and even set a hotkey

5 Likes
4

That works great! But I don’t want to fold my indents. So a dedicated “Fold YAML” toggle would be appreciated.

9 Likes
5

Great feedback @DEV_Scribbles but it is admittedly one more step away from a clean interface - and collapsing also still leaves behind a trigger.

And as to the fact that it is supported on preview mode and why isn’t that sufficient? I would argue (again design aesthetics and usability) that it is in Edit mode that the need for clean space is the most important. It is why iaWriter was successful with its super-clean writer focus mode.

There is something beautiful about starting a new card with it being completely a blank page, ready for filling. Having to see a computer-ese YAML header with metadata fields for every card is a quick mind sucker for creativity.

Of course, just my thoughts on the matter and putting it out there. :slight_smile: Welcome the discussion!

5 Likes
6

This would be my preference because I don’t want a separate YAML editor panel as that gets confusing and tight on smaller screens and hot keys to turn on and off the display isn’t how I think. I like having the indexing, tags aliases and all the metadata stuff at the end. I can get to it easily if I need to see or edit it but it is toof the way for my normal note use.

4 Likes
7

I second the global hotkey solution. Putting the YAML frontmatter at the end of the document breaks too much compatibility with other software. Especially when you’re interested to work with stuffs that make it popular. Like static site generators.

2 Likes
8

Use case or problem

Using Obsidian only in Live Preview (thanks for that, loving it!), YAML still looks like the old world.

Proposed solution

The most beloved solution would be an extra YAML-Pane. Short-Term easy solution would be a possibility to hide the YAML-Bloc like in Preview-Mode.

14 Likes
9

I would love this FR, and there are a few other similar FRs on the forum too

One possibility could be a snippet with the “.is-live-preview” class that hides the YAML section, and then using the Snippet Commands plugin hotkey to activate/disactivate the YAML display as needed.

I would love to learn how to do it, but I wouldn’t wait for me!

1 Like
10

I did get this working with this snippet…


/* ====== Hide YAML ======== */
.is-live-preview .cm-hmd-frontmatter {
    display: none;
}

And using the Snippets Commands plugin and Hotkey Helper to hide/reveal YAML using a hotkey.

13 Likes
11

I also agree with a hotkey solution being preferable. This should be persistent across notes until turned on. To me this is the main hurdle for making obsidian easy to use for taking notes on a phone.

2 Likes
12

I would love to be able to do this. Currently, with varying lengths of my front matters, it is bearable to work with but the inconsistency of the location of the starting line interrupts my workflow

3 Likes
13

THANK YOU SO SO MUCH! I was just getting started with YAML and my main hesitancy is that I hate how it looks and how it pushes everything down. I now have a hotkey to hide and show it. Thanks! :smiley:

1 Like
14

No worries,

How are you using YAML I’m still experimenting with it. But also wondering if I’ll change in the future to collapsed callouts instead.

Here is my current general note template

<%"---"%>
aliases: 
date created: <% tp.file.creation_date("YYYY-MM-DD") %>
publish: false
source: 
tags: my/reflections 
<%"---"%>
[[<%tp.date.now("YYYY-MM-DD")%>|<%tp.date.now("dddd MMMM Do YYYY")%>]]
# <% tp.file.title %>

I use the following plugins

  • core plugin - unique id note
  • header file name sync
  • auto note mover
15

Right now I am just using it for aliases tbh. Like I mentioned, I only started frontmatter last week and the need that drove it was the need for aliases. I am sure there is more that I will do with it as time goes on. But right now that’s the reason I am using it.

What is <% used for in your template? I’m not familiar with that syntax.

16

It’s a special sign for the Templater plugin to take notice of an instruction. For some reason when inserting a template with front matter, I encountered a problem. I found a tip that wrapping the front matter like that solved the problem.

1 Like
17

This works really great, thanks for the idea.
I saw you posted on Github that you also modified the banner spacer, to have the editable text appear higher up. This doesn’t work for me - did somthing change in 0.16 and did you by chance modify the css?
Thank you!

18

this is my current banners snippet. And I bind the snippet on/off to a hotkey using Snippets Commands plugin.

.obsidian-banner-spacer {
    height: calc(var(--banner-height) - 10rem);
}
19

Here you all go - a way to hide / unhide YAML frontmatter from a hotkey :slight_smile:

You can fold/unfold the YAML section using a hotkey. I use Ctrl + Y which is unassigned by default.

Steps to set up

  1. Install Templater, and paste this into a new template note:
<%*
// Get the current cursor location
const cursor = app.workspace.activeLeaf.view.editor.getCursor()
// Move the cursor to the start of the document
app.workspace.activeLeaf.view.editor.setCursor({line: 0, ch: 0})
// Fold/unfold the YAML
app.commands.executeCommandById('editor:toggle-fold')
// Move the cursor back to the original location
app.workspace.activeLeaf.view.editor.setCursor(cursor)
%>

  1. Open the Templater config page and set a hotkey for the new template.

  2. That’s it, you’re done!

Automatically hiding YAML in newly created notes

You can also make this part of another template, so for example, once you insert your new note template the YAML will be automatically hidden.

If you’re doing that, you will need to put the script in its own Templater “User scripts” file per the User Scripts documentation.

  1. Create a hideYaml.js file (not a Markdown .md note file). Place this in the “Script files folder location” which is configured in Templater config.

  2. Paste this into your hideYaml.js file:

function main() {
  setTimeout(() => {
    const cursor = app.workspace.activeLeaf.view.editor.getCursor()
    app.workspace.activeLeaf.view.editor.setCursor({line: 0, ch: 0})
    app.commands.executeCommandById('editor:toggle-fold')
    app.workspace.activeLeaf.view.editor.setCursor(cursor)
    return ''
  }, 100)
}
module.exports = main
  1. Call the script file from any other template file like this:
<%* tp.user.hideYaml() %>

That way it’s just a single one-liner which you can put in any other template. The reason for the setTimeout delay is so the new note can be created, and only after that will the YAML be hidden.

12 Likes
20

Hi @Alan, I pasted your script into my templater scripts folder in a file named hideYaml.js. But it causes a general templater error when using any template. Templater Error: Template parsing error, aborting. Unexpected token '<'. If I move the script out of the scripts folder, templater works again without triggering any errors.