Wordpress Full Width Footer Not Working
Solution 1:
First of all you should place wp_footer(); just before body closing tag. Remove your footer div from any shared wrapper or container and insert it in an indipendent one. To this new wrapper add the width:100% rule.
EDIT
Do you see what you need?
EDIT 2
Your DOM tree looks like this:
<html lang="de-DE"xmlns:fb="http://ogp.me/ns/fb#"class="listic_slider_fouc">
<head></head><bodyclass="home page page-id-146 page-template-default"style=""><divclass="inner"><divclass="container"><divclass="wrapper"><headerclass="logo">...</header><divclass="clear"></div><nav>...</nav><divclass="banner">...</div><center>...</center><divid="search3">...</div><divid="content"class="test">...</div><!--content--><divclass="footer_background"></div><divclass="footer">...</div></div><!--wrapper--><divclass="clear"></div></div><!--container--></body></html>But it should looks like:
<html lang="de-DE"xmlns:fb="http://ogp.me/ns/fb#"class="listic_slider_fouc">
<head></head><bodyclass="home page page-id-146 page-template-default"style=""><divclass="inner"><divclass="container"><divclass="wrapper"><headerclass="logo">...</header><divclass="clear"></div><nav>...</nav><divclass="banner">...</div><center>...</center><divid="search3">...</div><divid="content"class="test">...</div><!--content--></div><!--wrapper--><divclass="clear"></div></div><!--container--><!-- RIGHT PLACE --><divclass="footer_background"><divclass="footer">...</div></div><!-- RIGHT PLACE --></body></html>There's a WordPress Include Tags, called get_footer();. This function must be called in every page template ( except header.php and footer.php ). In your case it should be called outside from your .wrapper and .container div.
Remember to move wp_footer(); action from now position to just before </body> closing tag in order to avoid script block in wrong place etc, etc.
The CSS rule:
.footer_background {
width: 100%;
background-color: #6e6e6f;
}
.footer {
width: 902px;
height: auto;
font-family: arial;
padding: 0px030px0px;
margin: 0 auto;
}
Hope it helps, let me know if you get stuck!
EDIT 3
Example:
header.php
<html><head><!-- Header TAGS --></head><?php wp_head(); ?><body><divclass="container"><divclass="wrapper">index.php
<?php get_header(); ?><divclass="content"><?phpif( have_posts() ) : while( have_posts() ) : the_post(); ?><divclass="post"><h2><?php the_title(); ?></h2><p><?php the_excerpt(); ?></p></div><!-- .post --></div><!-- .content --></div><!-- .wrapper --></div><!-- .container --><?php get_footer(); ?>footer.php
<divclass="footer_background"><divclass="footer"><!-- Your footer blocks --></div></div><?php wp_footer(); ?></body></html>
Post a Comment for "Wordpress Full Width Footer Not Working"