Mason Dahl
asked 8 years ago

How can I make the footer extend to the full width of the page?

1 Answers
answered 8 years ago

If you want to make the footer full width. you can follow some solution below:
Solution1: Just full width footer
You can open the page.php file then add a </div> tag above the following code: <?php get_footer(); ?>

Solution2: If you want to make full width for each page, you can use the page template. To do this, follow steps below:
Create new a page-footer.php file, then add the following code to your file:

* Template Name: Sidebar Left
* @package DW Simplex
* @since DW Simplex 1.0.3
get_header(); ?>
<header class="page-header">
<h1 class="page-title"><?php the_title(); ?></h1>
</header><!-- .entry-header -->
<div class="container-fluid">
<div class="row-fluid">
<div id="primary" class="span9" style="">
<div id="content" role="main">
<?php while ( have_posts() ) : the_post(); ?>
<article id="page-<?php the_ID(); ?>" <?php post_class(); ?>>
<div class="entry-content">
<?php the_content(); ?>
<?php wp_link_pages( array( 'before' => '<div class="page-link"><span>' . __( 'Pages:', 'dw-simplex' ) . '</span>', 'after' => '</div>' ) ); ?>
</div><!-- .entry-content -->
</article><!-- #post-0 -->
<?php endwhile; ?>
</div><!-- #content -->
</div><!-- #primary -->

<?php get_footer(); ?>

Log in to Dashboard > Pages > Add new, then select the full width footer template in the Page Attributes section in the right hand side.
See the screenshot:

Solution3: you can add the following code to the style.css file to full width all page:
#page { width: 100%;}

Hope this helps !

Powered by DW Question & Answer Pro