Adding header image

thenextavengerblog · Member · Dec 10, 2016 at 12:42 am
Copy link

Add topic to favorites
Hi everyone,

I’m hoping someone can help me, I’m loving the new theme I’ve chosen, although it doesn’t come with a header image. I found a code on here which allows me to add an image where the title and tagline is, but I don’t know how to alter the size, as it’s just a little too small for the image I would like to use. Also I was wondering if there was a way I could change the font colour of just the title and tagline as well, as it’s not very visible with the chosen picture.

The site I need help with is; http://www.thenextavenger.com

thanks in advance for all your help!

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Dec 12, 2016 at 8:10 pm
Copy link
Hi there, I’m not seeing a header image on your site right now. Can you give me the URL for the image you wish to use and then also let me know how large you want that image?
thenextavengerblog · Member · Dec 12, 2016 at 11:25 pm
Copy link
Hiya, yeah the theme doesn’t come with a header image, I found a CSS code to put one in, but it kept it the height of the dark blue banner across where it said ‘The Next Avenger’, so I didn’t publish it, as it cropped too small and looked silly.

The image is here; http://i1053.photobucket.com/albums/s461/Annie_Larkin/8b5baf2f-86e1-42ac-8edb-d0e181fef8b5_zpsqkbeoiqn.jpg

I don’t really mind how large it is, I just want it to look alright with the rest of my blog, obviously I would like it to have as much height on the image above and span the width of the site, if that’s possible :)

Thanks for the help :)
thesacredpath · Member · Dec 13, 2016 at 6:42 pm
Copy link
Hi and thanks for the link. I found a similar image in your media library, so I used that one since it is better to pull from your media library than photobucket just in case there is an issue at photobucket that keeps the image from loading. Give this a try and see what you think.
```
.header {
  background-image: url('https://thenextavengerblog.files.wordpress.com/2016/02/cropped-fizzylemonstudio-com-0249.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: left -90px;
  padding: 250px 0 !important;
}
```
You will see that you disappear from the right side, on smaller screens, and that could be corrected, but I don’t think we would want the title and tagline to run over your face on smaller screens.
thenextavengerblog · Member · Dec 13, 2016 at 8:31 pm
Copy link
That’s absolutely fantastic! Thank you so much, that’s just what I wanted :)
thesacredpath · Member · Dec 14, 2016 at 2:14 am
Copy link
Hooray and you are welcome!

No items found.