Hide Posts Sidebar
Thesis theme comes with posts sidebar. It is placed on all posts and pages, and to hide it there is support for internal tag and for custom CSS.
Option 1: Internal tag
If you prefer to hide posts sidebar only in certain posts/pages, you can use the internal tag system in Ghost:
- Log in to Ghost admin
- Go to Posts, and open the post
- Open the Post settings sidebar
- Specify the
#hide-posts-sidebar
to Tags - Click Publish
The sidebar will now appear only in posts with the #hide-posts-sidebar
internal tag.
⚠️
Remember that internal tags starting with #
are not visible to readers and are used only for theme features and integrations.
Option 2: Custom CSS
Code Injection is required to add custom CSS.
You can hide the sidebar on all pages with the following CSS:
<style>
.main {
grid-template-columns: var(--sidebar--width) minmax(0, 1fr);
}
.content > .header > .button,
.sidebar-posts {
display: none;
}
@media (max-width: 950px) {
.content > .header > .button {
display: block;
}
.header > .breadcrumbs {
justify-content: center;
}
}
</style>
Use the body class to show/hide sidebar on different pages. For example, show the sidebar only in posts:
<style>
body:not(.post-template) .main {
grid-template-columns: var(--sidebar--width) minmax(0, 1fr);
}
body:not(.post-template) .content > .header > .button,
body:not(.post-template) .sidebar-posts {
display: none;
}
@media (max-width: 950px) {
body:not(.post-template) .content > .header > .button {
display: block;
}
body:not(.post-template) .header > .breadcrumbs {
justify-content: center;
}
}
</style>