Change background Images in Editor

[Toni_Krstic]

Hi,

I am having difficulty understanding the perfect set-up for being able to change images in Editor. My client need to be able to change the image in the Editor, however with the set-up I now it does not work.

I have a container where the image is set-up like this:

Since I have lines overlaying the image, it seems like the editor cannot find the image. If I remove the overlay lines, then I am able to change the image in Editor. See image:

I would really appriciate is someone could explain a solution.

Thanks in advance.

[Stan (justAnotherDeveloper)]

hi @Toni_Krstic do you mean Designer or Editor as your images are from Designer?

Anyway, the best way to get help is to follow the forum post guide that is pinned on top of each section, if you have missed it here they are.

When posting please:

• Required: Share your project’s Read-Only link and live site’s Published link
• The read-only link is a special URL generated in the Dashboard to allow others to view your project in the Webflow Designer. How to get your project’s read-only link?
• The published link is the webflow.io subdomain where you can view the live site with custom code running. It is IMPORTANT to share this link, as custom code (eg. javaScript) does not run in the Designer.
• Describe issue in detail including what page, section and/or element is localized
• Upload as many screenshots as possible or provide screencast videos to help others help you faster
• Add a description and/or post a link to a working example of what you’re trying to achieve
• Reply to users by tagging using the @ sign followed by their forum username like this: @forumMemberName

[Toni_Krstic]

Hi,

Ok, thank you @Stan

I mean, my client cannot change the image in Editor:

It seems due to the fact that the set-up is not correct in Designer:

I have tested to remove the “image-overlay-lines” and it it possible to change the image then, but with the “image-overlay-lines” I does not give me the option to change the image.

Read-Only Link: Webflow - ASK-Agency Final

It is on the Home page. Third section in the body.

Published Link: https://ask-agency-final.webflow.io/

I am trying to get it to be possible to change the image in Editor, here is an example of it working when i remove the “image-overlay-lines”:

[Stan (justAnotherDeveloper)]

From what you are describing it is a z-index issue.

[Toni_Krstic]

Hi @Stan

Thank you for your reply.

You seem to be right about that.

I still want the “image-overlay-lines” to overlap the image as it is an design element (In Designer), so how do I still get the lines, and have the ability to change the image in Editor? Any idea?

Thank you again for your help.

[Stan (justAnotherDeveloper)]

hi @Toni_Krstic you can try set on text or whatever element is covering your image pointer-events: none in this case the mouse will “see trough” this element and image should be clickable.

example:

[Toni_Krstic]

Hi @Stan

That worked, Thank you so much for your help

[freelancedan (Dan)]

Thank you for this, Stan. I can’t tell you how many times I’ve needed this solution for this issue.
Just one thing, it only worked for me after I added an ‘s’ after ‘event’ which is the proper syntax according to w3schools.com.
So:
pointer-events: none;

[Stan (justAnotherDeveloper)]

sorry for typo @Toni_Krstic but in CSS it is correct. The typo in response is now fixed.