twentysixteen full width template/no sidebar

in your child theme, create a file with the name full-width-page.php, and add this code:

<?php
/**
 * Template Name: Full Width Page
 *
 * @subpackage Twenty_Sixteen child theme
 */

get_header(); ?>

<div id="primary" class="content-area">
	<main id="main" class="site-main" role="main">
		<?php
		// Start the loop.
		while ( have_posts() ) : the_post();

			// Include the page content template.
			get_template_part( 'template-parts/content', 'page' );

			// If comments are open or we have at least one comment, load up the comment template.
			if ( comments_open() || get_comments_number() ) {
				comments_template();
			}

			// End of the loop.
		endwhile;
		?>

	</main><!-- .site-main -->

	<?php //get_sidebar( 'content-bottom' ); ?>

</div><!-- .content-area -->

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

in the above example, both sidebar calls are commented;
you can keep this line in its original:

<?php //get_sidebar( 'content-bottom' ); ?>

and add the CSS for that into style.css of the child theme:

@media screen and (min-width: 56.875em) {
	.page-template-full-width-page .content-area
	{
	  float: left;
	  margin-right: -100%;
	  width: 100%;
	}
}

This works great. Thanks for posting it!

Worked perfectly. Thanks a bunch.

Tried this solution > confirmed. Works seamless!

Okay… I did as explained above… where is the option to select this template? I don’t see it anywhere in the dashboard when editing the post. I see no difference so I assume I have to select the template somehow.

when editing the post

the template is only for pages

Thank you… sadly it looks like you answered me instantly while I was off figuring that out on my own. I almost never use posts so I had completely forgotten they’re different. I am actually doing a blog for once instead of a 10-page website like usual.

@nate22
if you want all single posts to be full width without sidebar, edit single.php in the child theme, and comment the sidebar call:

<?php //get_sidebar(); ?>

then add this to style.css of the child theme:

@media screen and (min-width: 56.875em) {
	.single-post .content-area
	{
	  float: left;
	  margin-right: -100%;
	  width: 100%;
	}
}

alternatively,
just use CSS, i.e. also remove the sidebar via CSS
(in this case, you can work with a ‘custom CSS’ plugin instead of a child theme):

.single-post #secondary { display: none; }
@media screen and (min-width: 56.875em) {
	.single-post .content-area
	{
	  float: left;
	  margin-right: -100%;
	  width: 100%;
	}
}

Thanks! The way I had done it previously was not as good as this. I will redo now as you suggest. Very much appreciated! ??

Hi there! I have followed these instructions (copied and pasted) and it did get rid of the sidebar, but my content is not covering the full width of the page. I will admit to now learning wordpress and php, so I am not sure what of the pasted code that I need to change, to make this truly full width.

https://www.dionescastro.com/aboutme/

full-width-page-mine code:

<?php
/**
 * Template Name: Full Width Page
 *
 * @subpackage Twenty_Sixteen child theme
 */

get_header(); ?>

<div id="primary" class="content-area">
	<main id="main" class="site-main" role="main">
		<?php
		// Start the loop.
		while ( have_posts() ) : the_post();

			// Include the page content template.
			get_template_part( 'template-parts/content', 'page' );

			// If comments are open or we have at least one comment, load up the comment template.
			if ( comments_open() || get_comments_number() ) {
				comments_template();
			}

			// End of the loop.
		endwhile;
		?>

	</main><!-- .site-main -->

	<?php //get_sidebar( 'content-bottom' ); ?>

</div><!-- .content-area -->

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

Style sheet code:

@media screen and (min-width: 56.875em) {
	.page-template-full-width-page .content-area
	{
	  float: left;
	  margin-right: -100%;
	  width: 100%;
	}
}

as you are using a different template file name, you will need to adjust the CSS.

the CSS is referring to the template file name in this CSS class:
.page-template-full-width-page
you will need to use:
.page-template-full-width-page-mine

Awesome! Thank you so much, Michael!

I’m a little late to the ballgame here, but I had this same issue even after making Michael’s suggested changes, and it turned out that earlier I had disabled the sidebar widgets in an effort to have them not take up horizontal space. Once any sidebar widgets are re-added, Michael’s suggested changes work great.

Hi Michael, It is me again. So, I had lost my php and css from 3 weeks ago. And now, trying to create it. But, I notice that I have a large white space on the left. Could you help me to figure out why my page isn’t flushing to the left?

css

/*
 Theme Name:   Twentysixteen-child
 Theme URI:    twentysixteen
 Description:  Twenty Sixteen Child Theme
 Author:       Dione Castro
 Author URI:   nothing
 Template:     twentysixteen
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  https://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  Twentysixteen-child
*/

h1 {
	font-family: Verdana;
	font-size: 50px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	text-transform: none;
	color: #cc0000;
}

h2 {
	font-family: Verdana;
	font-size: 50px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	text-transform: none;

}

@media screen and (min-width: 56.875em) {
	.full-width-page .content-area
	{
	  float: left;
	  margin-right: -100%;
	  width: 100%;
	}
}
td {
	font-family: Arial;
	font-size: 12px;
	border-width: 0 0px 0px 0;
}

table {
	border-collapse: separate;
	border-spacing: 0;
	border-width: 0px 0 0 0px;
}

php

<?php
/**
 * Template Name: Full Width Page
 *
 * @subpackage Twenty_Sixteen child theme
 */

get_header(); ?>

<div id="primary" class="content-area">
	<main id="main" class="site-main" role="main">
		<?php
		// Start the loop.
		while ( have_posts() ) : the_post();

			// Include the page content template.
			get_template_part( 'template-parts/content', 'page' );

			// If comments are open or we have at least one comment, load up the comment template.
			if ( comments_open() || get_comments_number() ) {
				comments_template();
			}

			// End of the loop.
		endwhile;
		?>

	</main><!-- .site-main -->

	<?php //get_sidebar( 'content-bottom' ); ?>

</div><!-- .content-area -->

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