Return to previous page

Main header background image - by Karll - on WordPress WooCommerce support

This topic has 30 replies, 3 voices, and was last updated 10 years, 2 months ago ago by Robert Hall

Karll

Participant

August 27, 2014 at 11:50

Hi,

I have tried to change the main header background image using custom css, but it does not seem to be displaying for some reason, can you please advise?

http://181.224.152.217/~groovebo/lulubellepinup.ie/

#13659 Copied

29 Answers

Robert Hall

Support staff

August 27, 2014 at 12:12

Hello,

This question is a bit unclear for us. Could you please clarify us with more details?
Do you need to change logo or header background color?

Regards,
Robert Hall.

#13662 Copied

Karll

Participant

August 27, 2014 at 12:16

Hi Robert,

I just want to add a background image to the header…

I added this to custom css but it does not seem to be working :

.header-type-4 .main-nav {
background-image: (http://181.224.152.217/~groovebo/lulubellepinup.ie/wp-content/uploads/2014/08/web_header_final.jpg);
}

#13663 Copied

Karll

Participant

August 27, 2014 at 12:22

Sorry, scrap that custom css, i copied it from another post. Basically i want add a background image to the highlighted area, see attached…

#13665 Copied

Karll

Participant

August 27, 2014 at 12:36

This is what i am trying to achieve ->

#13666 Copied

Robert Hall

Support staff

August 27, 2014 at 12:43

If you insert that image the logo will cover the photo and the image dimensions aren’t suitable for the screen resolution.
Look at screenshot http://prntscr.com/4gxzni

Regards,
Robert Hall.

#13667 Copied

Karll

Participant

August 27, 2014 at 12:47

If i get the image to be the correct dimensions, could we then disable the logo so it will display correctly?

What dimensions should the image be?

#13668 Copied

Robert Hall

Support staff

August 27, 2014 at 13:11

We can try it with 1170×316 dimensions.
And it will be like at screenshot http://prntscr.com/4gy70p , but need longer image.
Did you like that?

Regards,
Robert Hall.

#13669 Copied

Karll

Participant

August 27, 2014 at 13:14

No, i would like it to fill the whole highlighted area, i can get a new image done no problem if you tell me the exact dimensions i need?

#13670 Copied

Robert Hall

Support staff

August 27, 2014 at 13:23

Please provide us with a link to the image with 1170x316px dimensions.
Also provide us with wp-admin access in Private Content.

Regards,
Robert Hall.

#13671 Copied

Karll

Participant

August 27, 2014 at 13:37

Ill have to get my graphic designer to redo the image to that dimension, ill contact them now…

#13672 Copied

Robert Hall

Support staff

August 28, 2014 at 08:01

Hello,

We’ll wait for your reply. When you get an image please contact us.

Regards,
Robert Hall.

#13720 Copied

jagarolik

Participant

August 29, 2014 at 01:03

I would also like to add a background image to my header. How can I accomplish this?

Thanks

#13807 Copied

Robert Hall

Support staff

August 29, 2014 at 06:17

Hello jagarolik,

Please provide us with link to the image what you like see in the background, screenshot where that must be placed. Also provide us with link to the page and wp-admin access in Private Content.

Regards,
Robert Hall.

#13815 Copied

Karll

Participant

August 29, 2014 at 19:17

Hey, here you go…

Please, contact administrator
for this information.

#13883 Copied

Karll

Participant

August 29, 2014 at 19:17

I have provided the screen shot in earlier posts, cheers…

#13884 Copied

Karll

Participant

August 29, 2014 at 22:28

Can you please advise?

#13896 Copied

Robert Hall

Support staff

August 30, 2014 at 07:17

Hello,

Please provide us with FTP credentials in Private Content.

Regards,
Robert Hall.

#13901 Copied

Karll

Participant

August 30, 2014 at 09:07

Sure see below…

Please, contact administrator
for this information.

#13903 Copied

Robert Hall

Support staff

September 1, 2014 at 06:19

Hello,

I’ve added a background image. Check it, please.

Regards,
Robert Hall.

#13947 Copied

Karll

Participant

September 1, 2014 at 11:48

Hi,

Thanks for that but i need it to fit the full width of the mentioned area, see attached screen shot ->

Also it is not responsive on a mobile device, can you please advise? See screen shot ->

#13992 Copied

Robert Hall

Support staff

September 1, 2014 at 12:27

This image can’t be the full width because its only 1170px width.
I’ve made some responsive customization. Check it, please.

Regards,
Robert Hall.

#13998 Copied

Karll

Participant

September 1, 2014 at 12:33

Thank you, but when i asked you what size you needed the image to be you gave me the dimensions of 1170×316, see earlier posts, which i got the designer to resize for you, now your saying its not correct, can you please advise as to what exact size it should be to cover the area?

#13999 Copied

Robert Hall

Support staff

September 1, 2014 at 13:06

These dimensions (1170х316) are for header block, and not for the width of each screen. They are completely different. For the full width need more than 2000+ px.
Thanks for understanding.

Regards,
Robert Hall.

#14001 Copied

Karll

Participant

September 1, 2014 at 13:21

I wish you had of told me that when i asked because i have to pay for every alteration. Can you tell me the exact height and width thats required please?

#14002 Copied

Robert Hall

Support staff

September 1, 2014 at 13:58

Please provide us with image size 2000×316 px.

Regards,
Robert Hall.

#14003 Copied

Karll

Participant

September 2, 2014 at 18:33

Hi, attached is the resized banner as you requested, 2000x316px

#14072 Copied

Robert Hall

Support staff

September 3, 2014 at 06:58

Hello,

I’ve added this image. You can check it.

Regards,
Robert Hall.

#14120 Copied

Karll

Participant

September 3, 2014 at 09:54

Thanks for that, if i want to put it back to the way it was, do i just remove this code from the custom css?

.header7{
background: url(‘images/web_header_2.jpg’) no-repeat center center;
width:100%;
background-size:cover;
height:282px;
margin:0;
}
.header .logo {
display:none;
}
.header7 .table-row{
height:282px;
}
@media (max-width: 1200px) {.header7{
height:189px;
}
.header7 .table-row{
height:195px;
}
}
@media (min-width:768px) and (max-width:979px) {.header7 {
height:95px;
}
.header7 .table-row{
height:100px;
}
}
@media (min-width:481px) and (max-width:767px) {.header7 {
height:91px;
}
.header .table-row{
height:91px;
}
}
@media (max-width: 480px) {.header7 {
height:60px;
}
.header .table-row{
height:18px;
}
.header {
padding-bottom:0;
}
}

#14127 Copied

Robert Hall

Support staff

September 3, 2014 at 10:50

Yes, that should be enough.

Regards,
Robert Hall.

#14140 Copied
Viewing 30 results - 1 through 30 (of 30 total)