How To Move Or Remove The Sidebar

17.10.19

Some templates made by Berenica Designs have the sidebar on the left and some have it on the right. If you don't like the initial position of the sidebar in the template you bought, you can easily change it by yourself.

In this tutorial I'm going to show you how to move the sidebar to the left or right, or how to remove it completely.


move the sidebar to the left

  1. Open your Blogger Dashboard and from the left menu select "Theme".
  2. Click on "Edit HTML" under the preview of the template.
  3. Click inside the code and press CTRL + F (or CMD + F on Mac). A small search box in the top right corner will appear.
  4. Type into the search box — .main-wrap and press ENTER.
  5. Underneath this code change float: left into float: right.
  6. Type into the search box — .sidebar-wrap and press ENTER (this should be a few lines below).
  7. Underneath change float: right into float: left.
  8. Save by clicking on "Save the theme".


move the sidebar to the right

  1. Open your Blogger Dashboard and from the left menu select "Theme".
  2. Click on "Edit HTML" under the preview of the template.
  3. Click inside the code and press CTRL + F (or CMD + F on Mac). A small search box in the top right corner will appear.
  4. Type into the search box — .main-wrap and press ENTER.
  5. Underneath this code change float: right into float: left.
  6. Type into the search box — .sidebar-wrap and press ENTER (this should be a few lines below).
  7. Underneath change float: left into float: right.
  8. Save by clicking on "Save the theme".


remove the sidebar

  1. Open your Blogger Dashboard and from the left menu select "Layout".
  2. Move or remove all gadgets from the "Sidebar" section — it must be empty.
  3. Save by clicking on "Save the arrangement".
  4. From the left menu in your Blogger Dashboard select "Theme".
  5. Click on "Edit HTML" under the preview of the template.
  6. Click inside the code and press CTRL + F (or CMD + F on Mac). A small search box in the top right corner will appear.
  7. Type into the search box — .main-wrap and press ENTER.
  8. Underneath thic code change margin: 0 into margin: 0 auto and delete the line float: left/right;.
    • Tip: If you want to increase the size of the post, you can change the number in width into whatever you want; just make sure it's not higher than the number in the .outer-wrap section (it's two sections above this one).
  9. Type into the search box — .sidebar-wrap and press ENTER (this should be a few lines below).
  10. Underneath change width: (number) into width: 0 and delete the line float: left/right.
  11. Save by clicking on "Save the theme".


Tip: Make sure you don't delete any semicolons (;) — every line you're changing in this tutorial has to end with the semicolon (;); otherwise the code will not work properly.

If you have any problems while following this tutorial, you can contact me here.

Post a comment

Contact Form

Name

Email *

Message *

BERENICA DESIGNS.