How to: Move sidebar to the left

[zeaksKeymaster]

Usually moving the sidebar in a theme requires changes to the CSS but since Bootville Lite uses Bootstrap framework we need to edit the template files and reverse the layout.

1. Start off by creating a child theme
2. Next you’ll need to copy several files from Bootville Lite to your child theme as follows.
index.php
single.php
sidebar.php
page.php
archive.php
3. I won’t go into details on how the Bootstrap grid system works you can read up on it here In each of those files we copied there is a line that controls the layout (sidebar.php will have a different line)

<div id="primary" class="col-md-8 col-lg-8">

Find that line in all files except sidebar.phpand change it to this then save and close each file.

<div id="primary" class="col-lg-8 col-md-8 col-md-push-8">

4. Open sidebar.php and find

<div id="secondary" class="widget-area col-md-4 col-lg-4" role="complementary">

Change it to this

<div id="secondary" class="widget-area col-md-4 col-lg-4 col-md-pull-8" role="complementary">

Save and close sidebar.php.
5. What we did was reverse the layout pulling the sidebar to the left and push the content to the right. Upload your theme and activate it and your sidebar should now be on the left.

[Author]

Posts