I really like the Twenty Fifteen theme, but I need an extra sidebar, preferably on the right side of the screen. I already made a child theme, and tried the following:

Added the following to functions.php

function twentyfifteen_widgets_init2() {
register_sidebar( array(
'name'          => __( 'Widget Area Right', 'twentyfifteen' ),
'id'            => 'sidebar-2',
'description'   => __( 'Add widgets here to appear in your sidebar.', 'twentyfifteen'     ),
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
'after_widget'  => '</aside>',
'before_title'  => '<h2 class="widget-title">',
'after_title'   => '</h2>',
) );
add_action( 'widgets_init', 'twentyfifteen_widgets_init2' );'

After that I copied sidebar.php from the parent theme, and added the following to it:

<div id="rightsidebar" class="sidebar">
    <?php if ( is_active_sidebar( 'sidebar-2' ) ) : ?>
    <div id="widget-area" class="widget-area" role="complementary">
        <?php dynamic_sidebar( 'sidebar-2' ); ?>
    </div><!-- .widget-area -->
<?php endif; ?>

Now there is an extra sibar visible, but it isn't aligned right. I tried to get it to the right side of the page, but even when I use an absolute position, it still won't go all the way to the right.

Anyone know how to position this second sidebar on the right, without breaking the entire layout for the rest of the site?

  • I haven't yet looked into the twenty fifteen theme, but having written themes from the twenty twelve and - fourteen themes, removing or adding sidebars is quite an intensive job. You will either need to extend your site width or decrease content width to make space for the new sidebar. With the latter, you will need to adjust your full width thumbnail size and your content width in functions.php (childtheme). Use a browser like google chrome where you can inspect html elements and then adjust the appropriate ones accordingly – Pieter Goosen Jan 29 '15 at 9:05
  • I think it's a matter of CSS.. the thing is, I am quite puzzled about how the theme is displayed through CSS. A lot of the width's are in ::before's which makes it hard to find – Peter Buring Jan 29 '15 at 10:10
  • It depends which way you are going :-). I really don't have much time till about Monday to look into this unfortunately. If you still did not solve this by Monday, it is really worthwhile for me to start playing around with this. – Pieter Goosen Jan 29 '15 at 10:21
  • The 2015 theme assumes you will only have a single sidebar to the left, so you'll have to override some of the styles to get this to work just right. You're on the right path. You just need to get your styles right: reduce the content width to accommodate for the sidebar and set the sidebar to float right. Unfortunately, the rest of your question revolves around basic css and javascript. I'm afraid that's not the purpose of this site. – MikeNGarrett Feb 15 '16 at 23:40

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.