In WordPress I want my sidebar to change based on the page

1 Views

Ok I just developed my first custom WordPress theme using a guide – I’m still a noob. I’m not using widgets to fill the sidebar, I want to fill it myself with my own code and images.

So lets say I want the first sidebar I made to show up only on the homepage, and then the 2nd sidebar I made to show up on every other page. Can I use an if statement?

<?php

if(is_home()){

echo

"<div class="row">
            <div class="span3">
                <div id="search-box"><img id="search_text" src="http://localhost/Dorsa/wp-content/themes/Bootstrap/img/text_findyourhome.png">
                </div>
            </div>
        </div>


        <div class="row">
            <div class="span3">
                <img class="box_shadow" src="http://localhost/Dorsa/wp-content/themes/Bootstrap/img/box-shadow.png" style="padding-left:0;">
            </div>
        </div>

        <div class="row">
            <div class="span3"><div id="news" style="margin-top:275px;margin-bottom:200px">News</div></div>
         </div>"
         }

         else
         {
         echo
         "sidebar 2 code - didn't write it yet"
         }       
?>
Post Views: 1

Related posts

Leave a Reply

2 comments

  1. You can use if statement as said by @ChrisHerbert if you just want to display one sidebar in homepage and other in rest of your pages. New solution would be by creating a new template and sidebar.

    1. First find your sidebar.php file and make a copy of it.
    2. Name the sidebar using wordpress naming convention eg: sidebar-secondary.php.
    3. Make changes in sidebar-secondary.php as per your need.
    4. Make a new template and use your sidebar as <?php get_sidebar(‘secondary’); ?>

    EDIT

    Assuming that you want one sidebar for homepage and separate for all others you can do the following.

    1. Create sidebar-secondary.php as mentioned above.
    2. The main template is usually index.php. This will usually contain the sidebar for your homepage. You will find some code like <?php get_sidebar() ?>.
    3. If you want secondary sidebar on say page, open your page template page.php. Find the line get_sidebar() and replace it with get_sidebar('secondary'). Now all of your page will use secondary sidebar. You need to do the same if any of your page is using different template.
    4. To display secondary sidebar in you single post page (the page displayed after user clicks readmore in blog section), open single.php and again find and replace get_sidebar() with get_sidebar('secondary').

    You can now style and use your sidebar differently for homepage and other pages.

    Note that if you only want different sidebar in homepage and same for rest of the page you can also use conditional in your main template file index.php.

    if( is_home() ){
 get_sidebar(); //your main sidebar for homepage
} else {
 get_sidebar('secondary'); //your sidebar for other pages
}

  2. Templates are definitely the way to go, but your solution should work assuming that your “home” page is your blog page. If you’ve set the home page to be a static page (in the “Reading” section of the dashboard), you should use the is_front_page() function instead of is_home().

    I’d also suggest using alternative syntax and closing the PHP tag before your markup, like this:

    <?php if ( is_home() ) : ?>

    <div class="row">
        <div class="span3">
            <div id="search-box"><img id="search_text" src="http://localhost/Dorsa/wp-content/themes/Bootstrap/img/text_findyourhome.png">
            </div>
        </div>
    </div>

    <div class="row">
        <div class="span3">
            <img class="box_shadow" src="http://localhost/Dorsa/wp-content/themes/Bootstrap/img/box-shadow.png" style="padding-left:0;">
        </div>
    </div>

    <div class="row">
        <div class="span3"><div id="news" style="margin-top:275px;margin-bottom:200px">News</div></div>
    </div>

<?php else: ?>

    <!-- sidebar 2 code - didn't write it yet" -->

<?php endif; ?>