This beginners guide shows you how to add a full width header image to the new Genesis Sample child theme by StudioPress.
Your image will reduce in size ( scale down ) when the screen size reduces so it’s not cutoff.
In this example, we’ll add a image which is 1140px width by 350px height however this method can be used for any image dimensions.
There’s 2 steps :
Step 1 : Modify the PHP code on lines 154 and 155 in the Genesis Sample themes functions.php
// Adds custom logo in Customizer > Site Identity.
add_theme_support(
'custom-logo', array(
'height' => 350,
'width' => 1140,
'flex-height' => true,
'flex-width' => true,
)
);Step 2 : Add your image to Customize > Site Identity > Logo and set the width using the Logo Width setting :
In this case, the width has been set to 1140px.
No need to modify any CSS.
Demo Video
Shows the image being added to the Customize > Site Identity > Logo field and scaled down on smaller screens.
Subscribe for new Genesis Tutorials