How to move or remove the sidebar

last update: May 5, 2021 in:

The instructions below do not apply to the Feijoa theme, as no sidebar can be added due to the styling of the single post pages.

01 How to move the sidebar (left or right)?

  1. Go to Theme > click on the arrow next to "Customize" > select Edit HTML
  2. Click anywhere on the code once (this is important)
  3. Press CTRL+F (or CMD+F on Mac) to pull up a search box
  4. Use it to find this: .content {
  5. Change float for .content and .sidebar to left/right or right/left
    • Example: if .content has float: right;, then .sidebar should have float: left;
  6. Save the changes

02 How to remove the sidebar?

There are two options: a) remove the sidebar everywhere; b) remove the sidebar from specific page types.

01 Remove the sidebar everywhere
  1. Go to Theme > click on the arrow next to "Customize" > select Edit HTML
  2. Click anywhere on the code once (this is important)
  3. Press CTRL+F (or CMD+F on Mac) to pull up a search box
  4. Use it to find this: <body
  5. Add no-sidebar as a class, like this: <body class="no-sidebar">
    • Important: some themes have the class combine-menus - don't remove it
  6. Save the changes
02 Remove the sidebar from specific page types
  1. Go to Theme > click on the arrow next to "Customize" > select Edit HTML
  2. Click anywhere on the code once (this is important)
  3. Press CTRL+F (or CMD+F on Mac) to pull up a search box
  4. Use it to find this: <body
  5. Directly below the opening body tag, you will see this (the Rosamund theme has been used as an example, so the code below may differ depending on your theme): 
    <b:class cond='data:view.isHomepage' name='no-sidebar home-view'/>
<b:class cond='data:view.isMultipleItems and !data:view.isArchive and !data:view.isLabelSearch and !data:view.search.query' name='blog-view'/>
<b:class cond='data:view.isSingleItem' name='item-view'/>
<b:class cond='data:view.isArchive' name='no-sidebar archive-view grid-view'/>
<b:class cond='data:view.search.label' name='no-sidebar label-view grid-view'/>
<b:class cond='data:view.search.query' name='no-sidebar search-view grid-view'/>
  6. Add no-sidebar to the page types you want to remove the sidebar from (examples are below)
  7. Save the changes

03 Examples

Home page

<b:class cond='data:view.isHomepage' name='no-sidebar home-view'/>

Blog page

<b:class cond='data:view.isMultipleItems and !data:view.isHomepage and !data:view.isArchive and !data:view.isLabelSearch and !data:view.search.query' name='blog-view'/>

Post + static pages

<b:class cond='data:view.isSingleItem' name='item-view'/>

Only post pages; not added, but you can add it if you want a class to target only post pages

<b:class cond='data:view.isPost' name='post-view'/>

Only static pages; not added, but you can add it if you want a class to target only static pages

<b:class cond='data:view.isPage' name='page-view'/>

Archive pages

<b:class cond='data:view.isArchive' name='no-sidebar archive-view grid-view'/>

Label pages

<b:class cond='data:view.search.label' name='no-sidebar label-view grid-view'/>

Search results pages

<b:class cond='data:view.search.query' name='no-sidebar search-view grid-view'/>