Add a 3 column dynamic widget footer in WordPress theme

My wordpress theme does not have a widgetised footer area. All there is is just a

footer text

Read More

in the footer.

I want to be able to add widgets in my footer from the widgets area in dashboard, such as blogroll, site pages, recent posts etc. I want the footer to be 3 columns.

How can I do this? cheers

Related posts

Leave a Reply

2 comments

  1. You’d first of all register your widget areas in functions.php;

    /* REGISTER WIDGETS ------------------------------------------------------------*/
    
    if (function_exists('register_sidebar')) {
        register_sidebar(array(
            'name' => 'Footer Left',
            'id'   => 'footer-left-widget',
            'description'   => 'Left Footer widget position.',
            'before_widget' => '<div id="%1$s">',
            'after_widget'  => '</div>',
            'before_title'  => '<h2>',
            'after_title'   => '</h2>'
        ));
    
        register_sidebar(array(
            'name' => 'Footer Center',
            'id'   => 'footer-center-widget',
            'description'   => 'Centre Footer widget position.',
            'before_widget' => '<div id="%1$s">',
            'after_widget'  => '</div>',
            'before_title'  => '<h2>',
            'after_title'   => '</h2>'
        ));
    
        register_sidebar(array(
            'name' => 'Footer Right',
            'id'   => 'footer-right-widget',
            'description'   => 'Right Footer widget position.',
            'before_widget' => '<div id="%1$s">',
            'after_widget'  => '</div>',
            'before_title'  => '<h2>',
            'after_title'   => '</h2>'
        ));
    
    
    }
    

    Then in your footer.php file you’d have something like this;

        <!-- footer -->
        <div id="mainfooter">
    
            <!-- 1/3 -->
            <div class="four columns">
                <?php if ( !function_exists( 'dynamic_sidebar' ) || !dynamic_sidebar('footer-left-widget') ) ?>
            </div>
            <!-- /End 1/3 -->
            <!-- 2/3 -->
            <div class="four columns">
                <?php if ( !function_exists( 'dynamic_sidebar' ) || !dynamic_sidebar('footer-center-widget') ) ?>
            </div>
            <!-- /End 2/3 -->
            <!-- 3/3 -->
            <div class="four columns">
                <?php if ( !function_exists( 'dynamic_sidebar' ) || !dynamic_sidebar('footer-right-widget') ) ?>
            </div>
            <!-- /End 3/3 -->
    
        </div>
        <!-- /End Footer -->
    
  2. First put this line of codes in function.php

    if ( function_exists('register_sidebar') ) {
        register_sidebar(); 
    
        register_sidebars(3, array('name'=>'Footer %d'));
    } 
    

    Add this to your footer.php file

    <div id="footerwidgets">
     <div id="footer-left"> 
    
     <ul> <?php if ( !function_exists('dynamic_sidebar') ||
        !dynamic_sidebar('footer 1') ) : ?> <li> <?php endif; ?> </ul>
    
     </div> 
    <div id="footer-middle"> 
    
     <ul> <?php if ( !function_exists('dynamic_sidebar') ||
        !dynamic_sidebar('footer 2') ) : ?> <li> <?php endif; ?> </ul>
    
    </div> 
    <div id="footer-right"> 
    
     <ul> <?php if ( !function_exists('dynamic_sidebar') ||
     !dynamic_sidebar('footer 3') ) : ?> <li> <?php endif; ?> </ul>
    
     </div> 
    </div> 
    <br>
     <br clear="all" />