To create a real full width page – with no sidebars whatsoever – in your WordPress site while using a child theme of the default theme Twenty Fourteen, program this page template file with the file name real-full-width.php (important as this is referenced in the CSS) and save it in a sub-folder /page-templates in the child theme:
<?php /** * Template Name: Real Full Width Page * * @package WordPress * @subpackage Twenty_Fourteen * @since Twenty Fourteen 1.0 */ get_header(); ?> <div id="main-content" class="main-content"> <?php if ( is_front_page() && twentyfourteen_has_featured_posts() ) { // Include the featured content template. get_template_part( 'featured-content' ); } ?> <div id="primary" class="content-area"> <div id="content" class="site-content" role="main"> <?php // Start the Loop. while ( have_posts() ) : the_post(); // Include the page content template. get_template_part( '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(); } endwhile; ?> </div><!-- #content --> </div><!-- #primary --> </div><!-- #main-content --> <?php get_footer();
Add this section to style.css of the child theme:
.page-template-page-templatesreal-full-width-php .site { width: 100%; } .page-template-page-templatesreal-full-width-php .hentry { margin: 0 auto 48px; max-width: 90%; } .page-template-page-templatesreal-full-width-php .site-content .entry-header, .page-template-page-templatesreal-full-width-php .site-content .entry-content, .page-template-page-templatesreal-full-width-php .site-content .entry-summary, .page-template-page-templatesreal-full-width-php .site-content .entry-meta, .page-template-page-templatesreal-full-width-php .page-content { margin: 0 auto; max-width: 90%; } .page-template-page-templatesreal-full-width-php .main-content, .page-template-page-templatesreal-full-width-php .content-area { float: left; width: 100%; } .page-template-page-templatesreal-full-width-php .site-content, .page-template-page-templatesreal-full-width-php .site-main .widecolumn { margin-left: 0; } .page-template-page-templatesreal-full-width-php .site:before { width: 0; } .page-template-page-templatesreal-full-width-php .site-content { margin-left: 0; margin-right: 0; }
(not optimized)
Activate the template in the ‘Edit Page’ dashboard page, under ‘Page Attributes’ by ticking ‘Real Full Width Page’.