-
nngrey
ParticipantI would like to add a subtitle to my blog that is on the same line as the title but slightly to the right (about 15 spaces) and in a smaller font, maybe italicized. Something like this…
Heard Immunity [spacing here] a public health blog[smaller font]
I can’t use the existing tagline function because it appears below the title and expands the height of the header.
Anyone have any suggestions? Thanks
My blog is at http://heardimmunity.com/
I have already added the following custom CSS to my Pinboard theme in order to remove social media and search icons and reduce the height of my header:
#site-title {
line-height: 92px;
}#social-media-icons {
display:none;
float:none;
margin-top:0;
}#header input#s {
display: none;
}tejae
ParticipantYou could use an image file with the text you want. I’ve attached a visual but it may not be the correct size you need. Just copy and paste it to your computer and upload it in the Appearance>header section.
nngrey
ParticipantThanks, that’s not a bad idea. I wonder if it will change my header height? I may try this though. Best, Nathan
tejae
ParticipantI’m not sure. The example was just a mock up. The real one would have a transparent background.
If you want to test it out, go ahead and add it (don’t crop)
then let me know you’ve added it, so I can visually see it on your site. then I can adjust the size in whatever direction you need it adjusted.
my logo took quite a few tries to get it the correct size.
nngrey
ParticipantWell, I tried adding an image header but it blew up my margins. I created an image 1140 by 100. When I added it, the margins expanded top and bottom (and even side to side although it could be that my image needed to be longer. I think I saw some directions for editing the custom css if you wanted your graphic to fill the entire header without margins. I’ll have to hunt around for it again.
tejae
Participant1140 sounds about right x 100.
you may have seen the instructions on Alexanders website:
nngrey
ParticipantWell, I followed Alexander’s directions and used a graphic file that was 1140 x 100 but the header height did not contract to the size of the file – I had about 50 px space above and below.
tejae
ParticipantHere’s a transparent file (png) that is 60px in height instead. (not sure it will work either, but thought we’d give it a go)
nngrey
ParticipantWell, I tried your file and it definitely looked better than mine. I was trying to create a transparent jpeg – didn’t seem to work. Your png did. But the header still won’t contract to the image size. Odd. I am playing around with other png files now.
I really appreciate your help with this!
Nathan
tejae
Participantyes, as you discovered, jpg doesn’t support transparency.
i took a look at your site, the header looks great to me. lol
I don’t understand what you mean by “the header still won’t contract to the image size”.
Visually, do you want the letters to take up the whole space across?
nngrey
ParticipantI’m pretty happy with it now – thanks for your feedback. My image is now about 38 px high, just as high as the font itself, but the header is more like 90px high, including my image. I was hoping that I could get the header down to about 70px, but it won’t contract any further. Width is fine.
Anyway, like I said, I’m pretty pleased now and really appreciate your support!
You must be logged in to reply to this topic.