Wordpress Themes - WP Forum at BFA
Click here to register or to donate.
Auto self-registration is not available here - far too many spammers. This forum has many, many backlinks and because of that there is an intense desire among spammers to drop their links here.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Sidebars & Widgets »

Full width footer widget


  #1  
Old Nov 14, 2013, 01:12 PM
gr870sfunk's Avatar
gr870sfunk
 
110 posts · Mar 2011
Montgomery, AL
I have a full width footer already, but I would like to put a custom widget above the actual footer because the content should only show up on the home page.

My problem is that I would like the widget to have a full width solid color background and i'm not sure how to do a full width background on a widget. Any ideas would be much appreciated!

Thanks!

ps: if it's possible to do a full width div on the bottom of the home page instead of doing a footer widget, I am open to that as well.
  #2  
Old Nov 14, 2013, 02:07 PM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
Currently there is no way to get the full width footer and have widgets in it without modifying the code.

However, would you be willing to partially fund a new option to allow the footer to be full width and allow widgets to be used in it?
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #3  
Old Nov 14, 2013, 02:11 PM
gr870sfunk's Avatar
gr870sfunk
 
110 posts · Mar 2011
Montgomery, AL
Donation made to you Juggledad!

Would it be possible to not do it as a widget, but instead code a div to sit on top of the center column allowing it to have a full width?

Last edited by gr870sfunk; Nov 15, 2013 at 11:40 AM.
  #4  
Old Nov 17, 2013, 05:30 AM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
Quote:
Would it be possible to not do it as a widget, but instead code a div to sit on top of the center column allowing it to have a full width?
The page is layed out in a table with three rows:
Code:
header
center
footer
and the center row has 1-5 columns:
Code:
left sidebar, left inner, center, right inner, right sidebar
The problem is that you can't extend a table row wider than the table width itself

You can put a widget area at the top or bottom of the center area (new option in 3.7.12) but it does not span the sidebars, just the center area.
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #5  
Old Jan 13, 2014, 03:48 PM
gr870sfunk's Avatar
gr870sfunk
 
110 posts · Mar 2011
Montgomery, AL
I have gotten the footer to go full-width using the
HTML Code:
</td></tr></table></div></div>
hack, but now i have a different problem.

The widget on the left called "subfooter_1" won't move. It should slide to the left with the other things on the page when the browser window is resized, but it just stays there like there is a left margin being applied (which there is not).

The site is currently in development, so I will have to give you the login info for you to look at it.

I will pm it to you shortly. Thanks!

EDIT: I have removed the hack and am using the included full-width footer, but I am still getting the problem.
__________________
"I don't talk things, sir...I talk the meaning of things. I sit here and know I'm alive." - Prof. Faber from Fahrenheit 451

Last edited by gr870sfunk; Jan 13, 2014 at 03:54 PM.
  #6  
Old Jan 13, 2014, 06:29 PM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
CSS Inserts: why do you have padding?
subfooter {
background-color: #D5DAC6;
font-family: Gentium Basic,serif !important;
padding: 20px 0 20px 160px;
}
the 160px is the left side….
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #7  
Old Jan 14, 2014, 07:26 AM
gr870sfunk's Avatar
gr870sfunk
 
110 posts · Mar 2011
Montgomery, AL
If I don't have the padding, #subfooter_1 is crammed up against the lefthand side. I am currently working on a possible solution, but I wanted you to see it without the padding as well.

__________________
"I don't talk things, sir...I talk the meaning of things. I sit here and know I'm alive." - Prof. Faber from Fahrenheit 451

Last edited by gr870sfunk; Jan 14, 2014 at 07:35 AM.
  #8  
Old Jan 14, 2014, 09:13 AM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
but the 160px is for the left padding. Use Firebug and play with it.
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #9  
Old Jan 14, 2014, 01:11 PM
gr870sfunk's Avatar
gr870sfunk
 
110 posts · Mar 2011
Montgomery, AL
I'm not sure what you're meaning when you say the 160px is for left padding because that's what I wanted it to do, in order to get it off the lefthand side.

I have looked at this most of the day and the only thing I can think of that it has something to do with the inline styles in the below code, but I'm sure it probably something else that I haven't thought of. I'm completely stumped.

HTML Code:
<table id="sub-footer" class="bfa_widget_area" style="table-layout:fixed;width:100%;" cellpadding="0" cellspacing="0" border="0">
My ultimate goal is to have the sub-footer lined up underneath the my fixed width content above but with a full width background color which I thought I was doing by confining the sub-footer content to a widget area and not just coding it as an additional part of the footer with divs.

Additionally, if it's any help, I have a site that I am working on that has the same type of subfooter, but with only one widget area and it works correctly.
__________________
"I don't talk things, sir...I talk the meaning of things. I sit here and know I'm alive." - Prof. Faber from Fahrenheit 451

Last edited by gr870sfunk; Jan 14, 2014 at 02:05 PM.
  #10  
Old Jan 14, 2014, 05:13 PM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
so what color are you trying to have full width. If you add the 160px back in I see a full width color for the area. I guess I'm not quite clear on what you want to do
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #11  
Old Jan 15, 2014, 07:33 AM
gr870sfunk's Avatar
gr870sfunk
 
110 posts · Mar 2011
Montgomery, AL
I need the subfooter to look like the attached with the background color for both the subfooter and footer running full width while the content of the aforementioned subfooter and footer stays lined up directly underneath the rest of the page.

__________________
"I don't talk things, sir...I talk the meaning of things. I sit here and know I'm alive." - Prof. Faber from Fahrenheit 451
  #12  
Old Jan 15, 2014, 08:36 AM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
Is the page to be fixed width or variable?
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #13  
Old Jan 15, 2014, 12:47 PM
gr870sfunk's Avatar
gr870sfunk
 
110 posts · Mar 2011
Montgomery, AL
It is fixed at 1000px.

I have tried giving a fixed width to #sub-footer, but it doesn't do any good. It's 1000px wide, but it is still crammed up against the lefthand side. I don't understand why #sub-footer won't center, which is essentially what I need it to do. Center the content on the full width background. Once that is done, I can text-align:left; all the copy.
__________________
"I don't talk things, sir...I talk the meaning of things. I sit here and know I'm alive." - Prof. Faber from Fahrenheit 451

Last edited by gr870sfunk; Jan 15, 2014 at 12:51 PM.
  #14  
Old Jan 15, 2014, 01:40 PM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
try
HTML Code:
#advanced-recent-posts-2 {
    padding-left: 224px;
}
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #15  
Old Jan 16, 2014, 02:30 PM
gr870sfunk's Avatar
gr870sfunk
 
110 posts · Mar 2011
Montgomery, AL
That works to move it off the lefthand side, but I still have the original problem of it not moving when the window is resized.
__________________
"I don't talk things, sir...I talk the meaning of things. I sit here and know I'm alive." - Prof. Faber from Fahrenheit 451
  #16  
Old Jan 23, 2014, 02:57 PM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
ok, I think I have a solution for you
change the widget area to a one cell widget area. This will put it in a DIV instead of a table
set the div to width: 1000px; margin-left:auto; margin-right: auto;
put the widgets into the one widget area.
looking at the source, find the ID of the two widget areas and add the following CSS
#widget-id1 {float: left;}
#widget-id2 {float: right;}

see if that works
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support

Bookmarks

Tags
background, custom widget area, footer, full width

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] Footer widgets and full-width footer background image problem Viktoria Sidebars & Widgets 4 Dec 2, 2012 02:06 PM
How to create a full width footer juggledad Footer 0 Apr 20, 2012 03:43 PM


All times are GMT -6. The time now is 09:32 PM.


Powered by vBulletin® Copyright ©2000 - 2018, Jelsoft Enterprises Ltd.