WordPress.org

Ready to get started?Download WordPress

Forums

Add sidebar to Twentyeleven child theme (9 posts)

  1. MrsCassandra
    Member
    Posted 2 years ago #

    Hi,

    I wanted to add a fourth footer sidebar and I've added the following to the functions.php file

    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>',
    	) );

    I've also added the following code inside the function twentyeleven_footer_sidebar_class()

    if ( is_active_sidebar( 'sidebar-6' ) )
    		$count++;
    and
    case '4':
    			$class = 'four';
    			break;

    I can see the fourth footer area in the widgets area and I would say that the system is recognising it as it changes the style of the footer's widgets ("four"). But the fourth footer sidebar is not showing.

    Any suggestion?

  2. alchymyth
    The Sweeper & Moderator
    Posted 2 years ago #

    obvious question, as I can't see it in your question:

    have you added corresponding code into sidebar-footer.php as well?

    and made neccessary changes to style.css ?

  3. MrsCassandra
    Member
    Posted 2 years ago #

    Hi,

    thank you for the reply.

    Yes I've added the css style for it and the class "four" is showing in the HTML code of the page.

    The footer of the child theme shows the three footer sidebars just with get_sidebar( 'footer' ); so what I was hoping to achieve is just to add a fourth sidebar to this function through the functions.php file so that I do not have to call every single sidebar in the footer using other functions.

    Is this possible?

  4. alchymyth
    The Sweeper & Moderator
    Posted 2 years ago #

    I don't understand what you are trying -

    why don't you add the code for the fourth sidebar into sidebar-footer.php?

    the class "four" is showing in the HTML code of the page.

    where?

    can you post a link to your site to illustrate the problem?

  5. MrsCassandra
    Member
    Posted 2 years ago #

    LOL!!! I should sleep more at night!!!

    I'm very sorry for having bothered you!!! It was so obvious that I just did not think about it!!

    Thank you so much!!!

    I really just had to add the code in sidebar-footer.php

    Don't ask me why I did not...

    Sorry again!! and many many thanks for your help!!! :)

  6. MariaMSM
    Contributor Day Volunteer
    Posted 2 years ago #

    Hi,

    This works great! Thanks guys!

    One question though:
    I tested this on a test site and want to move the changes to my site. I used the one click child theme plugin to create a child theme, but it only includes the style.css. After reading some docs on wordpess.org it makes sense that only the style.css is available, but I need to edit the sidebar-footer.php and functions.php for the above to work. I think all I have to do for functions.php is go into VirtualMin and add a functions.php to the child theme, but do I need to put anything at the top of the file so WP reads it correctly? What about sidebar-footer.php?

    Thanks in advance!!!

  7. ckheaton
    Member
    Posted 2 years ago #

    Like to get this working in a child theme.... fourth footer is coming up but the "four" class is not. I am using the same code, but am unsure as how to ADD code "inside the function twentyeleven_footer_sidebar_class()" in a child theme functions file? Do you add a filter? Somehow, I am missing something seemingly simple.

    function update_footer_sidebar_class() {
    	$count = 0;
    
    	if ( is_active_sidebar( 'sidebar-3' ) )
    		$count++;
    
    	if ( is_active_sidebar( 'sidebar-4' ) )
    		$count++;
    
    	if ( is_active_sidebar( 'sidebar-5' ) )
    		$count++;
    
        if ( is_active_sidebar( 'sidebar-6' ) )
    		$count++;
    
    	$class = '';
    
    	switch ( $count ) {
    		case '1':
    			$class = 'one';
    			break;
    		case '2':
    			$class = 'two';
    			break;
    		case '3':
    			$class = 'three';
          		break;
    		case '4':
    			$class = 'four';
    			break;
    	}
    
    	if ( $class )
    		echo 'class="' . $class . '"';
    }
  8. ustyne
    Member
    Posted 2 years ago #

    In your Child theme you will need to add the CSS that will call up the "Fourth Widget Area" In the Twentyeleven Theme style.css Copy from line from line 2198 - 2255 to your child theme and and the CSS for t the fourth Widget area `/* Four Footer Widget Areas */
    #supplementary.four .widget-area {
    float: left;
    width: 15.85%;
    margin-right: 3.7%;
    }
    #supplementary.three .widget-area + .widget-area + .widget-area + .widget-area {
    margin-right: 0;

    }
    `
    You will need to adjust the width: percentage on all widget area to fit it to your test otherwise it will overlap. Or add some "style="" on the sidebar-footer.php <div id="supplementary" <?php twentyeleven_footer_sidebar_class(); ?> <strong>style="width: 30%;</strong>">
    I hope this solves you problem.

  9. ustyne
    Member
    Posted 2 years ago #

    Please exclude the <strong><strong>style="width: 30%;</strong>"> in the <div>

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.