Edit green header

Hi @slagunes

For the change green header, Kindly paste the code given below in Custom CSS field (Appearance -> Customize -> Header settings -> Custom CSS).

.page-mycarousel .img-responsive {
content: url("https://pixabay.com/get/eb37b60a2ff0043ed1534705fb094093e071e2d004b015489cf4c179a2ebb6/call-center-2275745_1920.jpg");
}

Change above image Url as per the requirement.

For more help refer this screenshot: https://prntscr.com/fsn7ei

If you need more help let me know.

Regards
—
Shahid

• This reply was modified 7 years, 4 months ago by Shahid Mansuri.

Hi @shahidmansuri123

Thank you very much, I was able to change the header with the instructions you gave me.

regards

Hi, I couldn’t change the header. Maybe this is because my of my plan?
What are the plan requirements to change it?

Hi @slagunes

We glad to know it worked for you. We hope you enjoying using our Bluestreet theme.
If you have any questions, please let me know.

Have a nice day. ??

Close this ticket.

Kind Regards
—
Shahid

Hi @biacomintercambio

kindly create a separate ticket for this query. Then we can easily help you.
So kindly follow given link here: https://www.ads-software.com/support/theme/bluestreet/#new-post

Regards
—
Shahid

Hi @shahidmansuri123

Before closing the ticket I have another doubt, I am testing the site in several browsers and in Chrome if I take the changes but in Explorer and Mozilla I still show the green header, what will this situation be?

Regards

Hi @slagunes

Sorry for late reply. Because we figure it out this problem.
Please replace to previous css code to the new css code below:

<strong>Replace</strong>

.page-mycarousel .img-responsive {
content: url("https://pixabay.com/get/eb37b60a2ff0043ed1534705fb094093e071e2d004b015489cf4c179a2ebb6/call-center-2275745_1920.jpg");
}

<strong>To</strong>

.page-mycarousel { 
	background-image: url("https://localhost/wordpress-lite/wp-content/uploads/2017/07/1600x400.jpg"); 
	background-size: 100% 100%;
	padding: 336px 0 65px; 

}
.page-mycarousel .img-responsive { display: none; }
@media (max-width: 1441px){
.page-mycarousel {
    padding: 300px 0 15px;
	}
}
@media (max-width: 1200px) { 

.page-mycarousel {
    padding: 250px 0 15px;
	}
}
@media (max-width: 992px) { 
.page-mycarousel {
    padding: 200px 0 15px;
	}
}
@media (max-width: 768px) { 
.page-mycarousel {
    padding: 150px 0 15px;
	}
}
@media (max-width: 480px) { 
.page-mycarousel {
    padding: 100px 0 15px;
	}
}
@media (max-width: 300px) { 
.page-mycarousel {
    padding: 50px 0 15px;
	}
}

And you need to use image dimension also 1600×400 pixel. Change image path as per the need.

Regards
—
Shahid

• This reply was modified 7 years, 4 months ago by Shahid Mansuri.

Hi @shahidmansuri123

Thanks for the answer, I am writing you to solve the problem using the first method that you shared with me and add the following:

Use the same header image and rename it to “page-header-bg.jpg” and then save the image to the “images” folder of the theme.

With this combined action you can see the header in all browsers.

Thank you very much for your help.

Regards,

Hi @slagunes

We’re glad that you were able to figure it out. Please share your feedback if you like our theme: https://www.ads-software.com/support/theme/wallstreet/reviews/#new-post

Have a great day. ??

Thanks