last day (15 days later) » 

4:03 PM
0
A: Wordpress: Header image size?

henrywrightTake a look in your theme's functions.php file for add_theme_support. This function registers support for the custom header image. Regarding the width and height of the default image, you can pass some $args like this: $default_args = array( 'default-image' => '', 'random-defaul...

 
Thanks for the tip. I looked in my functions.php file and found: '// Custom header $args = array( 'width' => 1280, 'height' => 416, 'default-image' => get_template_directory_uri() . '/images/header.jpg', 'uploads' => true, 'header-text' => false ); add_theme_support( 'custom-header', $args );' It seems like my theme is already fetching (is that the right word?) the header image at 1280 x 416, which is the Wordpress default. Or am I misinterpreting this? edit Sorry for the mangled code. I STILL don't know how to format code in a Stack Overflow comment
I enclosed my code in single quotes, as per the mini-Markdown formatting instructions. But the above is how it turned out. Any thoughts on what I'm doing wrong there?
Perhaps the single quotes in my code are throwing off the mini-Markdown. How can I resolve this issue?
 
Take a look here for tips on comment formatting.
 
Thanks, but I don't think that formatting page addresses my issue. I want to include code, which requires enclosing my code in backticks. But what happens if my code itself contains backticks?
 
Backticks and single quotation marks are different characters so you should be OK.
 
Ohhhh--BACKTICKS. OK trying now. Back to the original topic, here's what I meant to type earlier: I looked in my functions.php file and found-- // Custom header $args = array( 'width' => 1280, 'height' => 416, 'default-image' => get_template_directory_uri() . '/images/header.jpg', 'uploads' => true, 'header-text' => false ); add_theme_support( 'custom-header', $args ); edit: <sigh> I enclosed that in backticks, yet it's still garbage. I'm not sure how to better format it. Suggestions? If not, can you make sense of the php code? It seems to have the default WP height and width.
 
4:03 PM
Could 1214 x 243 pixels be the size of the containing element? Perhaps the image is being reduced in size to fit that?
 
OK that could very well be the case. An 'inspect element' on the web page is consistent with this. How can I verify this is what's happening? Also, if this is the case, why would the theme functions.php indicate it is fetching a header image of 1280 x 416, but then just turn around and cram it into a header element of 1214 x 243?
 
It sounds as though that's what is happening
Browsers often do that to stop the image overflowing the containing element
 
So my theme has set the element size of 1214 x 243. But when I try to cram a 1280 x 416 image into it, the browser crops it? Where in my files can I find out the size of the containing element? Would that be in the original style.css? Or page.php? Somewhere else? Again, this is the header image that appears on every page.

Thanks for the assistance. I've posted a couple of these questions to the theme forum, but the developer doesn't seem to be very responsive. The perils of relying on other people's (free) work.
 
I don't think the browser is 'cropping it', rather it proportionally scales down to fit
If you right click on the element in Chrome, you should be able to use Chrome's dev tools to get the height and width of it
Images scaling in this way can be a good thing... it helps the website to be responsive. For example, if you have a 'fixed' image 1280 x 416 pixels and a website visitor tried viewing your site on a tablet, the image will be far too large to display on screen all at once.
whereas if the image is 'fluid', it will be proportionally resized by the browser resulting in the whole image fitting on screen.
 
Yes I've done that. An inspect element indicates that the image displayed has a size of 1214 x 243. *But,* the image I uploaded is 1280 x 416 AND parts of it are indeed cropped when displayed on the web page. That's what is making this so confusing. i would have understood scaling--but cropping is definitely occurring. The web page is cropping both the top and bottom of the original image.

FYI, my theme is indeed billed as 'responsive.'
 
4:19 PM
Humm... when you upload the image, does it give you two options: Crop and skip cropping?
Try selecting 'skip cropping' to see if that results in the image not being cropped
 
When I upload the image, I am offered no cropping options at all. I assumed this was because my image was 1280 x 416--since Wordpress indicates images of these size will be used 'as is.'
 
How are you uploading the image? Appearance > Header or are you going to Appearance > Customize?
 
Appearance > Header. Whenever I upload a non-1280 x 416 header image in this manner, I am offered cropping options.
 
That's strange
Perhaps it's a bug in the uploader?
I've never come across that before to be honest
 
OK. Thanks anyway. I'll try to make some headway on some of the other forums. Thanks for the assistance!
 
4:26 PM
Sorry I couldn't help more. Hope you get it working.
 
No problem. Cheers.
 

last day (15 days later) »