# Hiding (some) Frontmatter

**URL:** <https://community.silverbullet.md/t/hiding-some-frontmatter/3682>\
**Category:** Troubleshooting\
**Created:** [December 29, 2025, 9:54pm UTC](https://community.silverbullet.md/t/hiding-some-frontmatter/3682 "2025-12-29T21:54:24Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![urnlahzer](https://community.silverbullet.md/letter_avatar_proxy/v4/letter/u/ecc23a/32.png) [@urnlahzer](https://community.silverbullet.md/u/urnlahzer)\
**Post date:** [December 29, 2025, 9:54pm UTC](https://community.silverbullet.md/t/hiding-some-frontmatter/3682/1 "2025-12-29T21:54:24Z")

</div>

I added language to hide frontmatter on many pages because I find the frontmatter distracting and unsightly at the top of my pages.  
But I have also been using attributes on tasks, specifically appending [DueDate: xxxx-xx-xx] and similarly StartDate to tasks.  
I just noticed my task attributes aren’t showing up on the pages where I’ve hidden frontmatter. This makes for a cleaner ui but I need those attributes.

Is there any way to hide the box at the top but not attributes on tasks?

---

<div class="post-metadata">

**Author:** ![Mr.Red](https://community.silverbullet.md/user_avatar/community.silverbullet.md/mr.red/32/821_2.png) [@Mr.Red](https://community.silverbullet.md/u/Mr.Red)\
**Post date:** [December 30, 2025, 1:21pm UTC](https://community.silverbullet.md/t/hiding-some-frontmatter/3682/2 "2025-12-30T13:21:51Z")

</div>

yes it’s technically possible. but what did you used to hide the frontmatter? depending on that space-lua or space-style you need to further specify the css selector.

With frontmatter visible:

 ![image](https://community.silverbullet.md/uploads/default/original/2X/6/60ab920fffc0e12a54889c25d364d03e8347540b.png)

With frontmatter hidden:

 ![image](https://community.silverbullet.md/uploads/default/original/2X/2/22659e13dbb8ce706325c5d7a26df53465b5c0b4.png)

---

<div class="post-metadata">

**Author:** ![bau](https://community.silverbullet.md/user_avatar/community.silverbullet.md/bau/32/2597_2.png) [@bau](https://community.silverbullet.md/u/bau)\
**Post date:** [December 30, 2025, 1:45pm UTC](https://community.silverbullet.md/t/hiding-some-frontmatter/3682/3 "2025-12-30T13:45:17Z")

</div>

@urnlahzer’s question echoes his comment on [Persistent folding: how to use space-style to hide a particular attribute? - #16 by urnlahzer](https://community.silverbullet.md/t/persistent-folding-how-to-use-space-style-to-hide-a-particular-attribute/3663/16).

He wants to hide the frontmatter without the attributes (on a page, a task or an item) being impacted. Indeed, these attributes all have an sb-frontmatter class like the frontmatter itself. So the hide-frontmatter-css class via the [space-lua](https://community.silverbullet.md/t/hiding-frontmatter/830/13) from @Inos Github hides the whole thing.

This do the job:

```auto
.sb-frontmatter.cm-line {
  display: none;
}

```

@Mr.Red : is that what you are using?

---

<div class="post-metadata">

**Author:** ![Mr.Red](https://community.silverbullet.md/user_avatar/community.silverbullet.md/mr.red/32/821_2.png) [@Mr.Red](https://community.silverbullet.md/u/Mr.Red)\
**Post date:** [December 30, 2025, 2:20pm UTC](https://community.silverbullet.md/t/hiding-some-frontmatter/3682/4 "2025-12-30T14:20:18Z")

</div>

no need to modify the css of the page, you have everything to “talk” only to the “real” frontmatter selector.

i’m using the code from @inos-github with a tiny modification ✨😉

instead of hiding all the `.sb-frontmatter` selector, i hide the combination of `.sb-frontmatter.cm-line`

replace these two:

 ![image](https://community.silverbullet.md/uploads/default/original/2X/c/c3a672accc7d53980515146481d7374a8ce7c218.png)  
with:  
`sb-frontmatter.cm-line`

as visible in the Browser Web-Tools the two different elements have also different combo of selectors:

 ![image](https://community.silverbullet.md/uploads/default/original/2X/3/3ab085e10f09647c20b63768961b92bd7d52f4a5.png)

and here is the same code from @inos-github , sprinkled with a little css-magic-dust ✨ to hide only the “real frontmatter”:

```lua
-- Toggle frontmatter visibility with auto-hide support
-- Auto-hides if page has hide-frontmatter: true in frontmatter

local styleId = 'hide-frontmatter-css'
local style = '.sb-frontmatter.cm-line, .sb-line-frontmatter-outside, .sb-frontmatter-marker { display: none !important; }'

local function scrollToFrontmatter()
  local fm = js.window.document.querySelector('.sb-frontmatter.cm-line, .sb-line-frontmatter-outside')
  if fm then
    fm.scrollIntoView({ behavior = 'smooth', block = 'start' })
  end
end

local function setVisibility(hidden)
  local el = js.window.document.getElementById(styleId)
  if hidden and not el then
    js.window.document.head.insertAdjacentHTML('beforeend', '<style id="' .. styleId .. '">' .. style .. '</style>')
  elseif not hidden and el then
    el.remove()
    js.window.setTimeout(scrollToFrontmatter, 50)
  end
end

local function pageHasHideFrontmatter()
  local pageName = editor.getCurrentPage()
  if not pageName then return false end
  
  local success, pageText = pcall(function() return space.readPage(pageName) end)
  if not success or not pageText then return false end
  
  -- Find frontmatter block boundaries
  local startPos = string.find(pageText, "^%-%-%-")
  if not startPos then return false end
  
  -- Find the end of frontmatter (second ---)
  local endPos = string.find(pageText, "[\r\n]+%-%-%-", startPos + 3)
  if not endPos then return false end
  
  -- Extract frontmatter content (between first --- and second ---)
  local fm = string.sub(pageText, startPos + 3, endPos - 1)
  fm = string.gsub(fm, "^%s*[\r\n]+", "") -- Remove leading whitespace/newlines
  fm = string.gsub(fm, "[\r\n]+%s*$", "") -- Remove trailing whitespace/newlines
  
  -- Check for hide-frontmatter: true (case-insensitive)
  return string.match(string.lower(fm), "hide%-frontmatter%s*:%s*true") ~= nil
end

function toggleFrontmatterVisibility()
  local isHidden = js.window.document.getElementById(styleId) ~= nil
  setVisibility(not isHidden)
  js.window.localStorage.setItem('frontmatterHidden', tostring(not isHidden))
end

local function updateVisibility()
  local shouldHide = pageHasHideFrontmatter() or 
                     js.window.localStorage.getItem('frontmatterHidden') == 'true'
  setVisibility(shouldHide)
end

command.define {
  name = "Toggle Frontmatter Visibility",
  key = "Ctrl-Alt-.",
  mac = "Cmd-Alt-.",
  run = toggleFrontmatterVisibility
}

local function delayedUpdate(delay)
  js.window.setTimeout(updateVisibility, delay or 100)
end

event.listen { name = 'editor:pageLoaded', run = function() delayedUpdate(100) end }
event.listen { name = 'editor:pageSaved', run = function() delayedUpdate(100) end }
event.listen { name = 'system:ready', run = function() delayedUpdate(200) end }

```

---

<div class="post-metadata">

**Author:** ![urnlahzer](https://community.silverbullet.md/letter_avatar_proxy/v4/letter/u/ecc23a/32.png) [@urnlahzer](https://community.silverbullet.md/u/urnlahzer)\
**Post date:** [December 30, 2025, 2:33pm UTC](https://community.silverbullet.md/t/hiding-some-frontmatter/3682/5 "2025-12-30T14:33:13Z")

</div>

Thanks for your code! To answer your question, I’m hiding on pages using:

pageDecoration:  
cssClasses:  
- no-frontmatter