The Size of Header on BookLite
-
How to reduce the header on theme “BookLite”? The image that I
have on right now is large. Is there any code to insert in CSS to
downsize it?Awaiting the favor of your early reply.
Thanks in advance.
Rafiq
The blog I need help with is: (visible only to logged in users)
-
Hi there,
You can make the header narrower with this CSS:
#masthead { height: 300px; }Just adjust that 300 until it looks like you want it to. Does that work? :)
-
No, it did not worked. It reduces the height tremendously. I tried
to change the px, but it distorts the image completely. I believe
that something is missing in the code. It should reduce width
and height proportionately. -
Hi there,
When I adjust the px size, it works properly to shorten and lengthen the header area without distorting the width. If you’re still seeing distortion, can you leave what you’ve entered, so I can take a look?
Note that doing this won’t affect the actual image you’ve uploaded, just the size of the header area. So if you want a shorter image, but you don’t want the bird cut off at all, you’ll want to resize your image to fit the new dimensions, upload it again and set the new sized image as header.
-
-
-
Any idea on how to adjust the width as well as height of the image?
If you look at the image, you will notice that the height is shrunk.
My goal is to reduce the image proportionally in both width and
height. Let me know if there be any change in the existing code.Thanks,
Rafiq
-
Good Morning WordPress Support Team,
Patiently awaiting for a reply on how to adjust the size of the image on
the header of BookLite theme.I am confident that you all should have an answer. As you can see I
tried it, and the width remains the same and the height is shrunk down.
All I need is to get the code that will adjust the width and the height
proportionately.Thanks,
Rafiq
-
Hi Rafiq,
Try the following to reduce the width:
#masthead { background-size: 50% !important; } -
Hi Rafiq,
To reduce the vertical space, add the height parameter back to the masthead:
#masthead { background-size: 50% !important; height: 300px; }You can make it more or less than 300 until it looks the way you want.
We’ve got a great series on the Daily Post teaching our users basic CSS. You should check these out! They’re a big help:
http://dailypost.wordpress.com/2013/06/21/css-intro/
-
I wish I was a WordPress wiz. For the last two months I am now
learning new things every day with the help of you and everyone
else.BookLite on Google Search says that the keep header size is with
pixels 1440 px width and 500 px height. I think I will leave it at that.One more question which I have is, “How can I shrink the space
from the bottom of the image and “The Story of Salman Amin Khan.”Appreciate your help.
Thanks again,
Rafiq
-
Hi Rafiq,
You’ll be a wiz before you know it! :)
To shrink that space, try:
#main { padding-top: 1em; }If you’d like a smaller header image area without going through the trouble of customizing it, you might check out some alternate themes. Book Lite has a particularly large header.
Here are a few examples of themes with a full-width option like Book Lite, but a narrower custom header area:
http://theme.wordpress.com/themes/suits/
http://theme.wordpress.com/themes/coraline/
http://theme.wordpress.com/themes/able/
- The topic ‘The Size of Header on BookLite’ is closed to new replies.