Using Header Images in Magazine Theme

In this tutorial, I will show you the best way to add a logo and other header images to the StudioPress Magazine child theme. The default dimensions for the full-width header image are 960 pixels wide by 115 pixels high. You can simply go to Appearance. Header and upload an image that is exactly the same size: custom header Egypt WhatsApp Number List And this is what it looks like on the front: header image Fits perfectly, but the header background image color needs to be changed. Change the header skin background image or color By default, the Magazine theme uses an image to style the background of the header which you will find in your child theme images folder.

Change the Header Skin Background Image or Color

If your header image is the same height, you can simply create a new image using those dimensions, the same background color as your images background, and replace the default one. Here is a sample image you can use on the far right of this post header wrap image Otherwise, you will need to change the height of the image and also change the height values ​​in your child themes’ style.css and functions.php files. Here’s what it looks like once you’ve created a new wrap.png image and replaced the default in your images folder: change skin picture It looks perfect now, but what if you don’t want a full-width header? Change header width You can change the width of your header area simply by adding a width to the CSS code on line 163 of your child themes style.css file.

Change Header Width

Egypt WhatsApp Number List

 

Wrap Copy the code block above and paste it at the end of the file then add the width which is 960px by default. Here’s what it looks like now after changing the width of the wrapper to be the same as the header: change wrap width Now your header area and secondary navigation menu are 960px wide instead of full width. But what about the main navigation menu? To change the background width of the main navigation menu, you can simply copy the CSS code from line 352 of your child themes style. Css file and paste it at the end of the file where you will need to add 3 new declarations

Leave a comment

Your email address will not be published.