Page 1 of 1

Header background color

Posted: Mon Apr 27, 2015 5:24 pm
by zunox
Hello, does anyone know how to change header background, im using opencart 2.0.1.1 and in stylesheet.css i dont find header

Re: Header background color

Posted: Mon Apr 27, 2015 7:56 pm
by viethemes
You can use my own extension Custom CSS and add code below

Code: Select all

#top {
	margin-bottom: 0;
}

header {
	padding-top: 40px;
	background-color: red;
}
Additionaly I have a commercial extension Live Theme Editor. It allows to customize the default theme eaiser. You don't need to know about CSS.

Re: Header background color

Posted: Mon Apr 27, 2015 8:41 pm
by zunox
thanks a lot it is working

Re: Header background color

Posted: Tue Apr 28, 2015 3:14 pm
by viethemes
Glad to hear that the problem is solved :)

Re: Header background color

Posted: Sat Aug 15, 2015 12:35 am
by Solan
SUPER THANKS! This helped me a lot with some other changes ;D

Re: Header background color

Posted: Sun Mar 26, 2017 6:23 pm
by VincentG
Thanks a lot it works perfectly!
Sometimes your looking for something that's isn't there :-)

Re: Header background color

Posted: Thu May 11, 2017 9:52 pm
by robster
Hi

I tried this today on 2.0.3.1 and it just made the whole background red not just the header. See screenshot. What could I be doing wrong?

Thanks

Robster

Re: Header background color

Posted: Thu May 11, 2017 11:00 pm
by viethemes
robster wrote:
Thu May 11, 2017 9:52 pm
Hi

I tried this today on 2.0.3.1 and it just made the whole background red not just the header. See screenshot. What could I be doing wrong?

Thanks

Robster
Could you provide your site URL so we can take a look at the problem closer?

Re: Header background color

Posted: Thu May 11, 2017 11:01 pm
by viethemes
robster wrote:
Thu May 11, 2017 9:52 pm
Hi

I tried this today on 2.0.3.1 and it just made the whole background red not just the header. See screenshot. What could I be doing wrong?

Thanks

Robster
Could you please provide your site URL so I can take a look at the problem closer?

Re: Header background color

Posted: Thu May 11, 2017 11:58 pm
by robster
Hi

I sorted it - all good now thanks.

I have now used a full width image for the header area and it looks great. It doesn't look good on a mobile device though as it is not resized. Can I add code in the custom CSS to either resize on mobile views or just completely remove the image on mobile views?

Thanks

Rob

Re: Header background color

Posted: Fri May 12, 2017 12:11 am
by viethemes
Glad to hear that the problem is solved!
Maybe you can try using background-size: 100%; for that image.

Re: Header background color

Posted: Fri May 12, 2017 12:49 am
by robster
Would you be so kind as to give exact code. Assuming image is /image/image.jpg

Re: Header background color

Posted: Fri May 12, 2017 9:51 am
by viethemes
You can try this code

Code: Select all

header {
background-size: 100%;
}

Re: Header background color

Posted: Fri May 12, 2017 4:04 pm
by robster
Hi

Thanks very much once againbut that doesn't do it. To be honest I would rather the header was hidden in mobile view.

Robster

Re: Header background color

Posted: Fri May 12, 2017 11:03 pm
by viethemes
Could you provide your site URL so I can take a look at the problem closer?

Re: Header background color

Posted: Fri May 12, 2017 11:39 pm
by robster
You know what - I am going to go for one of your extensions. Will I be able to make it work using these? Also I need to be able to have the header image a clickable hyperlink - can this be done too?

Rob

Re: Header background color

Posted: Sat May 13, 2017 10:45 pm
by viethemes
Yes. Visual Theme Editor or Live Theme Editor will help you to do that :) I can make a custom code to make header clickable.

Re: Header background color

Posted: Mon May 15, 2017 4:31 pm
by robster
Order being placed right now :)

Re: Header background color

Posted: Mon May 15, 2017 10:38 pm
by viethemes
robster wrote:
Mon May 15, 2017 4:31 pm
Order being placed right now :)
Thanks for purchasing our extension! If you have any question please don't hesitate to contact us via email viethemes@gmail.com :)