How do you use full size header Lifestyle Pro??

[SteveDub]

Brad I've swapped out my media queries code for the one you posted up and although it fills the space on iPad & iPhone properly it's still not showing the whole image..So I have put back to the original (padding visible on mobile devices) just for the moment to keep the code as clean as possible. Do I need to make different size images for these types of devices as well as the original 1140x200??

ALSO although it now looks better on PC monitors it's still chopping off a bit from the edges of my Header image?

I'm really sorry to keep asking Brad but I just can't get my head around what I'm doing different to Sam, as hers seems to look fine on both iPhone & iPad and she seems to have followed the same instructions without playing with the Media Queries??

Thanks for your patience!
Steve

[SteveDub]

...Sorry here's the link (it's just a test header image atm @ 1140x200px) and not necessarily the colour scheme I'm going to use FYI.

gamerbundles.co.uk

[Brad Dalton]

I would need to spend some time and play around with it locally to work out the best solution.

I can only really point you in the right direction because different people like different parts of their sites to look differently on different sized devices, Plus not everyone has the same customization and coding so its not like one solution works for everyone.

---

Tutorials for StudioPress Themes.

[SteveDub]

Totally understand that Brad and I wasn't expecting any more than the great advice and help you have already given or here. It's just really frustrating as I follwed the tut above as did Sam and made an image 1140x200 and hers looks fine on all my devices x4 different size screens in total!

Oh well I'll work something out eventually.

Thanks so much for your support,
Steve

[Brad Dalton]

Published a new post that you may be interested in http://wpsites.net/web-design/customize-mobile-responsiveness-of-lifestyle-pro-theme-header/

---

Tutorials for StudioPress Themes.

[SteveDub]

Thanks Brad I did see this on facebook! I have started playing around with different sizes etc and using help from your posts.. I will get there eventually, otherwise I will just hire someone to sort it for me lol!

It's been a while since I've done anything like this and now there's obviously so many devices to view websites on, I'm trying to get this right so I don't lose visitors when the sites fully live.

I've now checked these different changes on a 19" & 23" monitors my netbook and an iPad and the header responds differently on all of these, mostly chopping off part of it.

Thanks,
Steve

[SteveDub]

...and I've just realised the reason Sam's is working on all platforms is because I don't think she is using the same Child Theme anymore! As her original screenshot shows Lifestyle Pro, whereas the link now looks like a completely different site.

Steve

[Alex]

Hey there - sorry to interject, but I'm having a similar problem.

On this site I've set a full-sized header but it doesn't behave responsively.

I've been trying to make it work, and it is better than vanilla, but still doesn't behave properly.

Any help is appreciated.

[SteveDub]

Seems like you're having the same issue Alex! If you have tried everything in the above post including most recent link, then we are probably at the same point!?

I have reset mine back to original for now until I know whether I need to design different sizes or something! I just want the original to re-size for multiple screens, I think this may be the same for you.

Steve

[Alex]

Hey buddy, I took a nap and figured it out. Why it works - I don't know, but I'm not touching it.

Check out this guys guide:
http://blackhillswebworks.com/2013/05/10/how-to-replace-the-studiopress-background-header-image-with-a-real-image-logo/

This is what worked for me:

In functions.php have:

//* Remove the header right widget area
unregister_sidebar( 'header-right' );

/**
* Filter the genesis_seo_site_title function to use an image for the logo instead of a background image
*
* The genesis_seo_site_title function is located in genesis/lib/structure/header.php
* @link http://blackhillswebworks.com/?p=4144
*
*/
 
add_filter( 'genesis_seo_title', 'bhww_filter_genesis_seo_site_title', 10, 2 );
 
function bhww_filter_genesis_seo_site_title( $title, $inside ){
$child_inside = sprintf( '<a href="%s" title="%s"><img src="'. get_stylesheet_directory_uri() .'/images/dhead.png" title="%s" alt="%s"/></a>', trailingslashit( home_url() ), esc_attr( get_bloginfo( 'name' ) ), esc_attr( get_bloginfo( 'name' ) ), esc_attr( get_bloginfo( 'name' ) ) );
$title = str_replace( $inside, $child_inside, $title );
return $title;
} // End bhww_filter_genesis_seo_site_title

/**
* Remove the site description
*
* @link http://www.briangardner.com/code/remove-header-elements/
*/
remove_action( 'genesis_site_description', 'genesis_seo_site_description' );

//* Add support for custom header
add_theme_support( 'custom-header', array(
	'header-selector' => '.site-title a',
	'height'          => 150,
	'width'           => 1140,
) );

Also, that guide says to delete the custom header - but doing so hid the header on my site so I have to have custom header but then select "no header" in the header selection menu.

[tproud]

Hi Brad, I was trying to open http://wpsites.net/web-design/customize-lifestyle-pro-theme-header-image-area/ but it says "Sorry but this content is not available in your country at the moment." Is there any way for me to view this content? I need to modify the size of the header. I'm in Ukraine. Thank you.

[Bargnchk]

Hi guys, I'm fairly new to all this but am determined to work it out. I've been reading Brad's links but I can't decipher where to find the Lifestyle Pro php files and css files. Can anyone direct me where to find these in WordPress?

[Brad Dalton]

I just got hired by a client to do this.

Here's the after shot:

---

Tutorials for StudioPress Themes.

[Bargnchk]

Ok I give up trying to make my logo take up the whole size. Not getting anywhere. I even resized my logo to the size that's defaulted in the template 320 x 110 but the settings keep cutting my logo in half horizontally even though I've made the height 110. argh

[Author]

Posts