Wordpress Themes - WP Forum at BFA
Click Here To DONATE! Support the theme development, get more attention and additional benefits based on your donation level. Your forum name will be highlighted.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Header configuration & styling »

Trying to stretch logo area background color across the entire screen


Build custom WP THEMES, without
coding.
Click here for THEMEFRAME

From the author of Atahualpa, the #1 most
downloaded (700,000+) theme @ wordpress.org
  #1  
Old Oct 17, 2010, 10:55 PM
ssoszka
 
75 posts · Apr 2009
Oregon, USA
Send a message via Skype™ to ssoszka
Hello all,

I'm trying to expand the logo area background color across the entire screen while keeping the current width of the page itself.

Also trying to do the same for the page menu image and also with the footer color.
__________________
Dr. Shawn Soszka
http://www.DrSoszka.com

Last edited by ssoszka; Oct 17, 2010 at 11:25 PM.
  #2  
Old Oct 18, 2010, 04:54 AM
juggledad's Avatar
juggledad
 
22,186 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
The logo and menus are part of the container on the page. You could experiment with making the body the full width of the page, and use the left, left inner, right inner and right sidebars and don't put any widget in the left and right sidebars, just use the inner ones.

This way the left and right sidebars would be empty giving you an indent look on both sides
__________________
Give a person a solution, you fix one issue, teach a person how to solve their problem you enable them forever.
Juggledad | Forum Moderator/Support
  #3  
Old Oct 18, 2010, 12:23 PM
ssoszka
 
75 posts · Apr 2009
Oregon, USA
Send a message via Skype™ to ssoszka
Interesting I'll play with this, my concern is that the page menu will expand the width of the screen. Is there a way to keep it inline with the center column?

Also how do I get get the logo flush with top of the screen?

Thanks, JD!

UPDATE: I've played with this but I can't seem to get the page to span the the screen width. Which command is it?
__________________
Dr. Shawn Soszka
http://www.DrSoszka.com

Last edited by ssoszka; Oct 18, 2010 at 01:25 PM.
  #4  
Old Oct 18, 2010, 02:05 PM
juggledad's Avatar
juggledad
 
22,186 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
Style & configure LAYOUT
If you use %pages or %pages-right it will go to the edge of the page, but you could use %pages-center
__________________
Give a person a solution, you fix one issue, teach a person how to solve their problem you enable them forever.
Juggledad | Forum Moderator/Support

Last edited by juggledad; Oct 18, 2010 at 02:19 PM.
  #5  
Old Oct 21, 2010, 11:41 AM
ssoszka
 
75 posts · Apr 2009
Oregon, USA
Send a message via Skype™ to ssoszka
I tried playing with the idea. It didn't work for me tell me more about %pages-center. Where would I use that and what other coding do I need?

Thanks
__________________
Dr. Shawn Soszka
http://www.DrSoszka.com
  #6  
Old Oct 21, 2010, 12:09 PM
juggledad's Avatar
juggledad
 
22,186 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
%pages-center - see 'Configure Header Area'
__________________
Give a person a solution, you fix one issue, teach a person how to solve their problem you enable them forever.
Juggledad | Forum Moderator/Support
  #7  
Old Oct 21, 2010, 03:20 PM
ssoszka
 
75 posts · Apr 2009
Oregon, USA
Send a message via Skype™ to ssoszka
Quote:
Originally Posted by juggledad
%pages-center - see 'Configure Header Area'
Thanks for the reply. Tried that but the page menu is centered but it doesn't stretch across the screen. Check my site out to see what I mean. I have done some custom menu work it...

ALSO a few other issues... How do you get rid of the "default" widgets in the left and right sidebars which I'm using as padding for my site. I don't want anything to show up in the L & R sidebars, I'm using the inner side bars for the side bar function.

Finally, I want to get rid of the white padding around the edge of the page. I can't figure out how to get that done.

Thanks, again.
__________________
Dr. Shawn Soszka
http://www.DrSoszka.com

Last edited by ssoszka; Oct 21, 2010 at 03:26 PM.
  #8  
Old Oct 21, 2010, 07:36 PM
juggledad's Avatar
juggledad
 
22,186 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
Quote:
ALSO a few other issues... How do you get rid of the "default" widgets in the left and right sidebars
add a widget there - you can add a text widget and enter ' ' and you will get one space so it won't show
__________________
Give a person a solution, you fix one issue, teach a person how to solve their problem you enable them forever.
Juggledad | Forum Moderator/Support
  #9  
Old Oct 21, 2010, 09:14 PM
ssoszka
 
75 posts · Apr 2009
Oregon, USA
Send a message via Skype™ to ssoszka
That works a bit, but still leaves the formatting in the widget present. I'm still dealing with the page menu bar only showing up in the center and then nothing. Also the logo is way off in the left corner.
__________________
Dr. Shawn Soszka
http://www.DrSoszka.com
  #10  
Old Oct 23, 2010, 10:30 AM
boulderwrecka
 
1 posts · Oct 2010
is there no way to do width and height adjustments to fix this problem? or simply just resize your image and turn off the automatic resize?
  #11  
Old Oct 23, 2010, 03:47 PM
lmilesw's Avatar
lmilesw
 
10,085 posts · Jul 2009
Central New York State USA
Just my $.02 worth. How about using an image like this screenshot repeated horizontally as a background image, use just the outer sidebars, and a fixed width site? That would give you the blue and brown across the whole screen but your logo and menu would be in the center as it appears you want them. You will have to tweak the positioning of the header and menu to line up properly.
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #12  
Old Oct 26, 2010, 10:17 AM
The Boat Galley
 
10 posts · Oct 2010
I think I'm trying to do something similar. My site is http://theboatgalley.com and the problem occurs when looking at the site in Firefox or Chrome (haven't checked with other browsers) with a wide-screen monitor and no bookmarks or anything taking up width.

I'm using fluid width at 100%, with a max-width of 1200 to limit resizing. BUT I'd like to eliminate the max-width restriction on just the header, so that the orange bar will go all the way to the left and right sides of the screen, with the content then in the center. A good example of what I want to achieve is to look at Facebook, where their dark blue strip goes across the whole width, with the real content in the center at what I assume are their max-width settings.

I'm attaching screen shots to show what I'm talking about (I cropped them just to show the upper left corner to keep the size reasonable). It's a little hard to see the problem here, because the background for this reply is white and so is the problem area, but just know that there's a white area to the left of the orange bar if you look at my site on a wide-screen monitor over 1200 pixels.

Is there any way to do this?


  #13  
Old Oct 26, 2010, 01:05 PM
lmilesw's Avatar
lmilesw
 
10,085 posts · Jul 2009
Central New York State USA
As mentioned in my last post you need to create a background image that matches up with your header colors. Yours would be similar to this screenshot.
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #14  
Old Oct 26, 2010, 01:57 PM
The Boat Galley
 
10 posts · Oct 2010
But then if I have a fixed width site, won't it show just the left side on smaller screens? Or is there some way to get it to load the center? Or like this site, where the light blue shows all around on a wide screen, but just the white gets re-sized on smaller screens (or a wide screen with bookmarks on the side)?

Thanks for your help, I'm really confused on this and want to have a decent-looking site for large monitors.

Last edited by The Boat Galley; Oct 26, 2010 at 02:00 PM.
  #15  
Old Oct 26, 2010, 02:52 PM
lmilesw's Avatar
lmilesw
 
10,085 posts · Jul 2009
Central New York State USA
The site by default is centered whether you have a fixed or fluid width. The image I am talking about will just show as much on the left and right of the content area as there is room for it. Here is an Atahualpa site that uses a background image. If you right click on the background and select view image you will see what I mean. The image is repeated horizontally and looks like it is part of the header image but it just matches up with it.
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] how to change the entire background color, not the body color? crobertl Forum How-To 24 Sep 12, 2010 10:00 AM
Changing background color for entire theme Netforest Header configuration & styling 2 Nov 5, 2009 11:54 AM
Stretch Background Image To Fill Entire Page tim5046 Header configuration & styling 3 Jun 9, 2009 10:35 AM
Can't get logo and header image overlay to be centered on all screen resolutions jockoe Header configuration & styling 1 Feb 27, 2009 02:44 PM
Putting a image background in the header's logo area kirinafa Header configuration & styling 2 Feb 18, 2009 04:08 PM


All times are GMT -6. The time now is 07:50 AM.


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