[EspenParticipant]

Im using Ethos II. In the introduction section in cornerstone im using a transparent image and a black background color.
In the preview it looks good but when i go to the site, the black background is gone. How to fix this?

[ThaiModerator]

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

[EspenParticipant]

http://www.droneklang.no

[EspenParticipant]

It seems like its not possible to use both a background color and an image at the same time. Which is a problem when using transparent images..

[LelyModerator]

Hello There,

Using background image over a background color is possible. You only need to have an image with a transparent background and after that you use this.
Example:
body {background:#ffffff url(‘img_tree.png’) no-repeat right top;}
the #ffffff is the color that you want behind your image.

Very important that your image extension support transparency, use .png or .gif

If you’re referring to section 2 on the link you’ve provided, please change the green image with an image with transparency.

Hope this helps.

[EspenParticipant]

Hi,

And thanks for replying. In this case i was referring to the “introduction” section of the ethos theme. I suppose that will be the first section as the green is section 2. In cornerstone its called “introduction”. I have a transparent png image and choose the black background color. In the preview window to the right of the cornerstone editor everything looks fine, but when i visit the page the black background is gone and only the transparent image is shown with a white background.

I will try the above method, but im not really sure where to exactly enter the code mentioned above. You say i need to have an image with a transparent background and after that you use this:

body {background:#ffffff url(‘img_tree.png’) no-repeat right top;}

I have no luck with this, cause i dont know where to put the code.
Can you specify where i should enter the code?

[RadModerator]

Hi there,

Hmm, still confusing. I’m not sure what section is introduction at your end, would you mind providing a login for testing? Background works okay on my end with png images.

And you should add that css at Admin > Appearance > Customizer > Custom > CSS.

And also, by adding background image at customizer and page setting, it will then cover the background you just set using the code provided. Means, you must remove your backgrounds and use that custom css.

Thanks!

[EspenParticipant]

Still not working and even more confused. In Ethos Demo 2 theres a picture with a camera on the very top first page, section is called introduction in cornerstone. This is the picture i want to replace with a png image and a black background color.

How do i do this? Where do i upload my image, under layout and design in the customizer settings or in cornestone editor?

I will provide a login later, need to sleep now..

[LelyModerator]

Hello There,

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password
– Specific URL and part of page where you want the transparent image over background color
– URL or name of the image

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

[EspenParticipant]

This reply has been marked as private.

[ChristopherModerator]

Hi there,

The provided credentials are not working, please check.

Thanks.

[EspenParticipant]

This reply has been marked as private.

[ChristopherModerator]

Hi there,

Please enable ‘Advanced controls’ option and add background-color:#000; in style filed of section 1.

Hope it helps.

[EspenParticipant]

It didnt help much. Its the same as before. Its only working in the preview window, but not when i “view page”.

[DarshanaModerator]

Hi there,

Could you please try adding the following CSS rule into your Cornerstone > Custom CSS section (http://screencast.com/t/iw1oyiRCWT).

#x-section-1 {
    background-color: #000000 !important;
}

Hope that helps.

[Author]

Posts