Change background image

kragor · November 2014

I would like to change your background image. In "layout settings" I select boxed layout and upload my background image.

Problem is that after uploading my image on page still shows yours:

I upload demo content - TRAVEL (homepage)

http://themes.muffingroup.com/betheme/wp-content/uploads/2014/07/home_tour_bg.jpg --- thats the picture

Where can I remove or change it?

Thank you in forward.

Albert · November 2014

Hi,

did you checked your Theme options > Layout > Custom CSS & JS > Custom CSS section? Because maybe this image exist there as custom css. If this image is there, then please remove the line with css responsible for this image.

kragor · November 2014

I already did. Both are empty.... Maybe its in demo "Homepage - TRAVEL" content.

But i dont know where to change that.

kragor · November 2014

Thank you but i found it...

In page option section >> Style CSS >> Column content >> .page-id-2033 { background: #e8e1ce url(http://themes.muffingroup.com/betheme/wp-content/uploads/2014/07/home_tour_bg.jpg) no-repeat top center; }

I remove that and its ok.

Albert · November 2014

Yes, this is that one code

Great to hear that you found it!

kragor · November 2014

:-bd

dox4all · March 2016

kragor, where is that page option section?

susiemcc · April 2016

I am having the same problem. I am new to this and so would appreciate a more detailed step by step instruction with screen shots as well......other thought....if i just delete the photo that is currently used as the background image in GYM would that work?

Thanks

Albert · April 2016

@susiemcc Please send us link to your site and let us know which image you want to change exactly.

susiemcc · May 2016

thanks for the reply. I am currently working on it on my local host as I am in an area with very random internet. BUT I have worked out how to change the image....so thanks but this is sorted.

carala · August 2017

I have the same problem, where is that page option section? I want do insert a background image to all the pages, fixed in top. Could you help me?

Bryan · August 2017

@carala Do you mean the page background, header or the subheader image. Please show on a screenshot.

carala · August 2017

This is the screenshot: https://drive.google.com/drive/folders/0B_X-FXW3i9q-SVVrZUpXY0FyRkU?usp=sharing

It works as background of the section, but with different heights. I wanted it this way (as background of the page, header and content) but with a fixed height in top. Is it possible?

I tried with css but doesn't work:

body {

background: url('wp-content/uploads/2016/11/bg-header3-13.png') top center no-repeat fixed;

-webkit-background-size: cover;

-moz-background-size: cover;

-o-background-size: cover;

background-size: cover;

}

Thanks!

Bryan · August 2017

Please send a link to your website, we will help you with the css.

carala · August 2017

http://lapache.com.br/prov

Thank you!

Bryan · August 2017

Please disable maintenance mode.

thank you!

carala · August 2017

Done.

Bryan · August 2017

Try this css

body {
	background:url('http://lapache.com.br/wp-content/uploads/2016/11/bg-header3-13.png')no-repeat center top !important;
	background-size:cover !important;
	background-position:fixed;
}

carala · August 2017

I've pasted your code on the personalized css of the page "A Lapache", also on Appearance > Options BeTheme > CSS but isn't visible the image.

carala · August 2017

Almost solved. The problem was: on Appearance > Global > General it should be active the transparency for the content. Now I have the background active and with the same height in all the pages. But the image isn't visible on mobile.

The css now is:

body {

background:url('http://lapache.com.br/wp-content/uploads/2017/08/bg-header4.png') no-repeat center top !important;

background-size: contain !important;

-webkit-background-size: contain !important;

-moz-background-size: contain !important;

-o-background-size: contain !important;

}

.mobile .content-inner {

background-image: url('http://lapache.com.br/wp-content/uploads/2017/08/bg-header4.png') no-repeat center top !important;

}

carala · August 2017

Solved with css3:

@media only screen and (max-width: 768px) {

/* For mobile phones: */

body {

background:url('http://lapache.com.br/wp-content/uploads/2017/08/bg-header4mob3.jpg') no-repeat center top !important;

background-size: 100% !important;

}

Yeeeees! Thank you!

GlendaJD · March 2018

Can't figure this one out. Help. The image changes on all the pages except the home page with Global- header-background-image. How do change the home page? I can't find a place to try any of the code ideas above.

Bryan · March 2018

GlendaJD
You can set the main background image in theme options>global>general
Please send a link to your page if it does not work.
thanks

GlendaJD · March 2018

I did that and it changed the image on al the pages except the home page. www.seasidedragonfly.com is where the site is currently living. Currently it has a placeholder image while a learn the theme. Thank you for any help you can offer.

Bryan · March 2018

This is because on the home page you are using a revolution slider which takes place of the header image. Disable the slider and you will see a normal header like on other pages.
thanks

Claudia-Angerer · June 2018

Hi,

I am having the same problem. 2 days ago a backup was installed and since then I try to show the full background image on the start page again, but it is only displayed as header and not complete.

I tried this CSS but it dosn´t work:

body {

background:url('http://www.trockenbau-linz.at/wordpress/wp-content/uploads/2017/10/wordpress-startseite-gt-neu.jpeg')no-repeat center top !important;

background-size:cover !important;

background-position:fixed;

}

What could I do?

Thank you

Claudia

Pablo · June 2018

Claudia-Angerer

Is this trockenbau site yours?

If yes, please disable all the plugins and try again, there is a cache plugin which can make betheme work badly.

Claudia-Angerer · June 2018

Hi Pablo,

thanks for your response, but it doesn't work. I disable all the plugins and tried again. No it doesn't work. I deleted the cache plugin, no it doesn't work. The full background image on the start page is not displayed, just as a header. My css I have also deleted.

My global settings - General :

- picture: http://www.trockenbau-linz.at/wordpress/wp-content/uploads/2017/10/wordpress-startseite-gt-neu.jpeg

- position: Center Top/no-repeat

- Size: Cover

- Transparent: header and Top Bar with menu

My global settings - Header :

- picture: http://www.trockenbau-linz.at/wordpress/wp-content/uploads/2017/10/wordpress-startseite-gt-neu.jpeg

- position: Center Top/no-repeat

- Size: Auto Transparent: header and Top Bar with menu

What could I do now?

Thank you

Claudia

Pablo · July 2018

You shouldn't upload a background in header, try to make it in content on page.

But if you really want to keep it there, you have to use custom CSS.

header{min-height:600px !important}

Thanks.

Claudia-Angerer · July 2018

Hi Pablo,

now I have deleted the background image in header, but my full background image doesn´t work only as header.

http://www.trockenbau-linz.at

Where should I place this CSS?

Thank you

Claudia

Claudia-Angerer · July 2018

OK now it works.

I placed this CSS on start page header{min-height:600px !important} and this CSS on every content page header{min-height:170px !important}

Thank you

Claudia

Change background image

Comments