Add sidebar to front page twentytwelve template?

like a right sidebar?

just go to edit page
>page attributes
>template

and then choose right sidebar on the dropdown menu

Thanks. But I actually want both — the right-hand sidebar AND the two widget positions on the bottom. The template options I show allow one or the other, but not both.

Do not edit the Twenty Twelve theme. It is the default WordPress theme and having access to an unedited version of the theme is vital when dealing with a range of site issues. First create a child theme for your changes.

Thanks — good advice, which I am following.

Did you find a solution to this jgold723?
I’m looking to do the same thing

In the child theme.

1. Create a new sidebar by creating file named ‘sidebar-front2.php’ or something similar inside your child theme.
2. Paste the following into ‘sidebar-front2.php’

   <?php
   /**
    * The sidebar containing the second set of front page widget areas.
    *
    * If no active widgets in either sidebar, they will be hidden completely.
    *
    */
   /*
    * The widget area is triggered if any of the areas
    * have widgets. So let's check that first.
    *
    * If none of the sidebars have widgets, then let's bail early.
    */
   if ( ! is_active_sidebar( 'sidebar-4' ) && ! is_active_sidebar( 'sidebar-5' ) )
   	return;
   
   // If we get this far, we have widgets. Let do this.
   ?>
   <div id="tertiary" class="widget-area" role="complementary">
   	<?php if ( is_active_sidebar( 'sidebar-4' ) ) : ?>
   	<div class="third front-widgets">
   		<?php dynamic_sidebar( 'sidebar-4' ); ?>
   	</div><!-- .fourth -->
   	<?php endif; ?>
   
   	<?php if ( is_active_sidebar( 'sidebar-5' ) ) : ?>
   	<div class="fifth front-widgets">
   		<?php dynamic_sidebar( 'sidebar-5' ); ?>
   	</div><!-- .fifth -->
   	<?php endif; ?>
   </div><!-- #tertiary -->

3. Create a functions.php inside your child theme and paste the following code.

   /**
    * Register additional widget areas for front page.
    */
   function mytheme_widgets_init() {
   	register_sidebar( array(
   		'name' => __( 'Third Front Page Widget Area', 'twentytwelve' ),
   		'id' => 'sidebar-4',
   		'description' => __( 'Appears when using the optional Front Page template with a page set as Static Front Page', 'twentytwelve' ),
   		'before_widget' => '<aside id="%1$s" class="widget %2$s">',
   		'after_widget' => '</aside>',
   		'before_title' => '<h3 class="widget-title">',
   		'after_title' => '</h3>',
   	) );
   
   	register_sidebar( array(
   		'name' => __( 'Fourth Front Page Widget Area', 'twentytwelve' ),
   		'id' => 'sidebar-5',
   		'description' => __( 'Appears when using the optional Front Page template with a page set as Static Front Page', 'twentytwelve' ),
   		'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' );

4. Inside front-page.php (or whichever template you’re wanting to add the widgets to add <?php get_sidebar( 'front2' ); ?> after the line <?php get_sidebar( 'front' ); ?> but before `<?php get_footer(); ?>. The end of the file should look like this (or similar)

   <?php get_sidebar( 'front' ); ?>
   <?php get_sidebar( 'front2' ); ?>
   <?php get_footer(); ?>

5. Add styling. I gave the new widget area an id of “tertiary”. Which I’m not sure if it is being used but you could change this id or just style using the classes. Or they can be changed, it’s up to you.

So basically what we did: create new widget area in the page template and register 2 new widgets in functions.php to be used in the new widget area.

Also, the new widget areas should be visible in the admin area now and you can drag and drop widgets into those areas.

I didn’t test any of this but the principles should be about correct and should be enough to figure out what needs to be done.

Ok so OP was looking for a front page template which adds the Main Sidebar and both front page widget areas to the page

My last post was explaining how to create a new widget area for the front page which is a little off topic. I’ll leave the post for anyone looking to create a new widget area.

To answer the post, inside your child theme create a frontpage.php to override the twentytwelve frontpage.php template (or create a new template if your heart desires).

Paste the following code into the new template you created in the child theme. Go to the page you have set as your front page ( Pages -> Home ) and select the template from the template dropdown. The code below will create a “Front Page Template” so select that from the dropdown and things should work. I think OP may have been forgetting to select the template in the dropdown bc his code/logic appears correct.

<?php
/**
 * Template Name: Front Page Template
 *
 * Description: A page template that provides a key component of WordPress as a CMS
 * by meeting the need for a carefully crafted introductory page. The front page template
 * in Twenty Twelve consists of a page content area for adding text, images, video --
 * anything you'd like -- followed by front-page-only widgets in one or two columns.
 *
 * @package WordPress
 * @subpackage Twenty_Twelve
 * @since Twenty Twelve 1.0
 */

get_header(); ?>

	<div id="primary" class="site-content">
		<div id="content" role="main">

			<?php while ( have_posts() ) : the_post(); ?>
				<?php if ( has_post_thumbnail() ) : ?>
					<div class="entry-page-image">
						<?php the_post_thumbnail(); ?>
					</div><!-- .entry-page-image -->
				<?php endif; ?>

				<?php get_template_part( 'content', 'page' ); ?>

			<?php endwhile; // end of the loop. ?>

		</div><!-- #content -->
	</div><!-- #primary -->

<?php get_sidebar(); ?>
<?php get_sidebar( 'front' ); ?>
<?php get_footer(); ?>

How can i change the 2 columns in this new sidebar, into 3 equal columns?

joshi, this set of instructions should help you out:

Add another widget area to Twenty Twelve front page template in a child theme
https://pinkishhue.com/add-another-widget-area-to-twenty-twelve-front-page-template-in-a-child-theme

Thanks, Theory21.

I used your code and tweaked it a bit to create this option with two widget areas underneath a Slider plugin (Meteor Slides) and the same sidebar as the rest of the site.

I put the front page widgets call in a div container (for the CSS). I also removed the editable page content, so the only content shown is from the slider and the widgets.

<?php
/**
 * Template Name: Custom Front Page
 */

get_header(); ?>

	<div id="primary" class="site-content">
		<div id="content" role="main">

        <?php if ( function_exists( 'meteor_slideshow' ) ) { meteor_slideshow(); } ?>

			<div id="home-widgets" class="template-front-page two-sidebars">
				<?php get_sidebar( 'front' ); ?>
			</div>

		</div><!-- #content -->
	</div><!-- #primary -->

<?php get_sidebar(); ?>
<?php get_footer(); ?>

I add a new sidebar with 3 columns, but i don′t know, what i have to write in the “style.css” in my child theme. Under this new sidebar, i use also the old sidebar with 2 columns.

functions.php

<?php
/**
 * Register additional widget areas for front page.
 */
function mytheme_widgets_init() {
	register_sidebar( array(
		'name' => __( 'Third Front Page Widget Area', 'twentytwelve' ),
		'id' => 'sidebar-4',
		'description' => __( 'Appears when using the optional Front Page template with a page set as Static Front Page', 'twentytwelve' ),
		'before_widget' => '<aside id="%1$s" class="widget %2$s">',
		'after_widget' => '</aside>',
		'before_title' => '<h3 class="widget-title">',
		'after_title' => '</h3>',
	) );

	register_sidebar( array(
		'name' => __( 'Fourth Front Page Widget Area', 'twentytwelve' ),
		'id' => 'sidebar-5',
		'description' => __( 'Appears when using the optional Front Page template with a page set as Static Front Page', 'twentytwelve' ),
		'before_widget' => '<aside id="%1$s" class="widget %2$s">',
		'after_widget' => '</aside>',
		'before_title' => '<h3 class="widget-title">',
		'after_title' => '</h3>',
	) );

	register_sidebar( array(
		'name' => __( 'Fifth Front Page Widget Area', 'twentytwelve' ),
		'id' => 'sidebar-6',
		'description' => __( 'Appears when using the optional Front Page template with a page set as Static Front Page', 'twentytwelve' ),
		'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' );
?>

sidebar-front2.php

<?php
/**
 * The sidebar containing the second set of front page widget areas.
 *
 * If no active widgets in either sidebar, they will be hidden completely.
 *
 */
/*
 * The widget area is triggered if any of the areas
 * have widgets. So let's check that first.
 *
 * If none of the sidebars have widgets, then let's bail early.
 */
if ( ! is_active_sidebar( 'sidebar-4' ) && ! is_active_sidebar( 'sidebar-5' ) && ! is_active_sidebar( 'sidebar-6' ))
	return;

// If we get this far, we have widgets. Let do this.
?>
<div id="tertiary" class="widget-area" role="complementary">
	<?php if ( is_active_sidebar( 'sidebar-4' ) ) : ?>
	<div class="third front-widgets">
		<?php dynamic_sidebar( 'sidebar-4' ); ?>
	</div><!-- .fourth -->
	<?php endif; ?>

	<?php if ( is_active_sidebar( 'sidebar-5' ) ) : ?>
	<div class="fourth front-widgets">
		<?php dynamic_sidebar( 'sidebar-5' ); ?>
	</div><!-- .fifth -->
	<?php endif; ?>

	<?php if ( is_active_sidebar( 'sidebar-6' ) ) : ?>
	<div class="fifth front-widgets">
		<?php dynamic_sidebar( 'sidebar-6' ); ?>
	</div><!-- .sixth -->
	<?php endif; ?>
</div><!-- #tertiary -->

front-page.php

<?php
/**
 * Template Name: Front Page Template
 *
 * Description: A page template that provides a key component of WordPress as a CMS
 * by meeting the need for a carefully crafted introductory page. The front page template
 * in Twenty Twelve consists of a page content area for adding text, images, video --
 * anything you'd like -- followed by front-page-only widgets in one or two columns.
 *
 * @package WordPress
 * @subpackage Twenty_Twelve
 * @since Twenty Twelve 1.0
 */

get_header(); ?>

	<div id="primary" class="site-content">
		<div id="content" role="main">

			<?php while ( have_posts() ) : the_post(); ?>
				<?php if ( has_post_thumbnail() ) : ?>
					<div class="entry-page-image">
						<?php the_post_thumbnail(); ?>
					</div><!-- .entry-page-image -->
				<?php endif; ?>

				<?php get_template_part( 'content', 'page' ); ?>

			<?php endwhile; // end of the loop. ?>

		</div><!-- #content -->
	</div><!-- #primary -->

<?php get_sidebar( 'front2' ); ?>
<?php get_sidebar( 'front' ); ?>
<?php get_footer(); ?>

I have a question sort of related to this thread, so I’ll post here. I’d like a right sidebar on the front page template of my twenty twelve child theme, but I don’t need the right sidebar IN ADDITION TO the two widgets down below the main content area. I’d like to relocate one of the two widget areas so that one of them is a sidebar.

I sort of did this by adding the following CSS to my child theme:
#primary {
width:60%;
}

#secondary {
float:right;
clear:none;
width: 38%
}

.template-front-page .site-content article {
width:auto;
}

and it works. However, I’m using the jetpack twitter widget and the widget is stubbornly remaining the wrong size, no matter what I do to resize it. Any idea of how to fix this?

Please post that on your own thread.

I am trying the same, but whilst adding the code like this below in the child theme page-templates/front-page.php does not make a right hand side bar. The bar appears underneath.

<?php get_sidebar( ); ?>
<?php get_sidebar( 'front' ); ?>

I am guessing that it is a stylesheet issue, but have not been able to work out what minor change I need to make.

I tried copying the whole standard page template but it still made the post full width and the “sidebar” go underneath. So it *knows* it is the front page. I can’t find a style difference ??

So, I found the right css I think but any changes affected all the widget boxes and it got really messy.