-
Posts
-
Im trying to change the header size image in the theme Wire and when dont understand what I should put exactly in the css space.
someone said to put .site – branding but I dont get it.
Please help , what do i put in the CSS to change the size of the Header image, ? Thank you
The blog I need help with is itrekwear.comHi there, are you trying to change the height of the header image strip?
The class that’s used on the header background image is this one:
.site-brandingIf you’d like to increase the height, try something like this in your CSS:
.site-branding {
height: 460px;
}Let me know how it goes.
what does the .site-branding mean. how exactly should i write it.
Thank you so much, just want to get this done to get started.
Hi there, site-branding is the name of the HTML element in which your header image is contained.
You would write the CSS exactly as I showed you above:
.site-branding {
height: 460px;
}Paste these lines of code in your custom CSS editor under Customize > CSS. This will make your header image 460px high, but you can adjust that number as you like.
If you’re interested in learning more about how to find CSS selectors in your code, this is a very good post to check out.
so it would be itrekwear.com is that my site branding.
This is your site-branding HTML element, which you can see if you view your browser source:
<div class="site-branding">
<div class="logo">
<h1 class="site-title"><a href="http://itrekwear.com/" title="=" rel="home">=</a></h1>
<h2 class="site-description"></h2>
</div><!-- .logo -->
</div><!-- .site-branding -->Does this answer your question? I’m not 100% sure what you’re asking. :-)
I got it to work but now it wont work with the mobile phone, wont resize, any help their thank you
You might want to try applying the custom CSS I provided earlier only to larger screens. Could you try replacing the earlier code with this and let me know if it helps:
/* Desktops and laptops
*/
@media only screen
and (min-width : 1224px) {
.site-branding {
height: 740px;
}
}Hi there, did you still need any help with this? It looks like you left the original code in addition to adding the new bit, so things look a little off – you’ll want to actually replace the old code with the new piece.
Your CSS customizations currently look like:
/* Desktops and laptops
*/
@media only screen
and (min-width : 1424px) {
.site-branding {
height: 840px;
}
}
}
.site-branding {
height: 740px;
}You want to keep just the first part so the .site-branding class doesn’t become twice as high as it should be:
/* Desktops and laptops
*/
@media only screen
and (min-width : 1424px) {
.site-branding {
height: 840px;
}
}
}Let me know how it goes.
Hi there, just checking in to see whether you still needed any help with this issue or if you’re all set. Thanks!
The topic ‘How to change the Header Size Image in WIRE’ is closed to new replies.
Theme Support 