WordPress.org

Forums

[resolved] Adding a fourth footer area using twentyeleven child theme (3 posts)

  1. gkstr
    Member
    Posted 2 years ago #

    I'm using a child theme of twentyeleven. I've read and tried several ideas/tutorials from these forums and elsewhere but I can't add a fourth footer area, and I can't figure out where I'm going wrong.

    I'll apologise in advance as I don't have a link to the site, as I'm developing everything locally at this stage.

    First, I copied twentyeleven_widgets_init() to my theme's functions.php, renamed it to mytheme_widgets_init() and made some modifications. So in mytheme/functions.php:

    <?php
    add_action( 'after_setup_theme', 'my_child_theme_setup' );
    
    function my_child_theme_setup() {
    
      remove_action( 'widgets_init', 'twentyeleven_widgets_init' );
    
      function mytheme_widgets_init() {
    
        // twentyeleven_widgets_init stuff
    
        register_sidebar( array(
          'name' => __( 'Footer Area Four', 'twentyeleven' ),
          'id' => 'sidebar-6',
          'description' => __( 'An optional widget area for your site footer', 'twentyeleven' ),
          'before_widget' => '<aside id="%1$s" class="widget %2$s">',
          'after_widget' => "</aside>",
          'before_title' => '<h3 class="widget-title">',
          'after_title' => '</h3>',
        ) );
      }
    
      add_action( 'widgets_init', 'mytheme_widgets_init' );
    }
    ?>

    Second, I copied twentyeleven_footer_sidebar_class() to my theme's functions.php, renamed it to mytheme_footer_sidebar_class() and made some modifications. So now in mytheme/functions.php:

    <?php
    add_action( 'after_setup_theme', 'my_child_theme_setup' );
    
    function my_child_theme_setup() {
    
      remove_action( 'widgets_init', 'twentyeleven_widgets_init' );
    
      function mytheme_widgets_init() {
    
        // original twentyeleven_widgets_init stuff
    
        register_sidebar( array(
          'name' => __( 'Footer Area Four', 'twentyeleven' ),
          'id' => 'sidebar-6',
          'description' => __( 'An optional widget area for your site footer', 'twentyeleven' ),
          'before_widget' => '<aside id="%1$s" class="widget %2$s">',
          'after_widget' => "</aside>",
          'before_title' => '<h3 class="widget-title">',
          'after_title' => '</h3>',
      ) );
    
      add_action( 'widgets_init', 'mytheme_widgets_init' );
    
      function mytheme_footer_sidebar_class() {
    
        // original twentyeleven_footer_sidebar_class stuff
    
        if ( is_active_sidebar( 'sidebar-6' ) )
    	$count++;
    
        $class = '';
    
        switch ( $count ) {
          // original twentyeleven_footer_sidebar_class stuff
          case '4':
            $class = 'four';
    	  break;
        }
    
        if ( $class )
          echo 'class="' . $class . '"';
      }
    }
    ?>

    Third, I copied twentyeleven's sidebar-footer.php to my theme's folder and made some modifications. So in mytheme/sidebar-footer.php:

    <?php
      if (   ! is_active_sidebar( 'sidebar-3' )
          && ! is_active_sidebar( 'sidebar-4' )
          && ! is_active_sidebar( 'sidebar-5' )
          && ! is_active_sidebar( 'sidebar-6' )
      )
      return;
    ?>
    
    <div id="supplementary" <?php mytheme_footer_sidebar_class(); ?>>
    
      // original twentyeleven/sidebar-footer.php stuff
    
      <?php if ( is_active_sidebar( 'sidebar-6' ) ) : ?>
      <div id="fourth" class="widget-area" role="complementary">
      <?php dynamic_sidebar( 'sidebar-6' ); ?>
      </div><!-- #fourth .widget-area -->
      <?php endif; ?>
    
    </div><!-- #supplementary -->

    Fourth, I added some styling for the widget areas. So in mytheme/styles.css:

    #supplementary.four .widget-area {
      width: 24%;
      float: left;
      border: 1px solid red;
    }

    This lets me add a fourth footer area in Appearance/Widgets, but it doesn't show up on the page. Checking with Firebug shows:

    <div class="three" id="supplementary">
      <div role="complementary" class="widget-area" id="first">
        // stuff
      </div>
      <div role="complementary" class="widget-area" id="second">
        // stuff
      </div>
      <div role="complementary" class="widget-area" id="third">
        // stuff
      </div>
    </div>

    As a sanity check I tried making the above modifications to twentyeleven/functions.php and twentyeleven/sidebar-footer.php, and then the fourth widget area appeared as expected. But I really don't want to resort to modifying the parent theme.

    Any ideas or help would be greatly appreciated. This is my first attempt at child-theming and my first forum post, so please be gentle ;)

  2. WPyogi
    Forum Moderator
    Posted 2 years ago #

    This exact question was answered at length just a few hours ago! See this thread -- second to last post may answer it for you:

    http://wordpress.org/support/topic/how-to-add-a-fourth-footer-widget-area-to-twenty-eleven?replies=10

  3. gkstr
    Member
    Posted 2 years ago #

    Yes I've seen and tried that solution, but it didn't work for me. My changes to functions.php and sidebar-footer.php are pretty much identical to that answer.

Topic Closed

This topic has been closed to new replies.

About this Topic