Why can't I edit and change my background image?

In order to be able to edit an image, it has to be part of the HTML source of the position you are editing. While this makes sense, it is not always obvious. For example, with the help of CSS (Cascading Style Sheet) images can be shown in places where the actual HTML source does not contain an image at all.

You can edit the HTML source of the position to see if there is any CSS trickery going on using the HTML editor.

For example, if the HTML looks like this...

<div>
  <div class="background-image">
    <img src="/images/background.jpg" />
  </div>
  <div class="text">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. </div> </div>

...and you can only edit the text, then apparently the magical class "background-image" makes the image appear behind the text.

In the above example, if you want to change the actual image, change the "src" attribute of the "img" tag to the URL of another image. Just make sure the URL of the image is publicly accessible, in other words, the image has to be uploaded to a public website.

Sometimes the HTML source does not even have an "img" tag at all:

<div class="background-image">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</div>

In this case the image is delivered via the CSS class "background-image" and the URL for the image is part of the style sheet itself. BlueConic cannot edit the style sheet itself, so in this case there is no way to edit the image.

To summarize:

  • If you cannot edit an image with the inline editor, try the HTML editor.
  • In the HTML editor you cannot upload an image, so you will have to use the URL of an existing image.
  • If the HTML editor does not contain an image URL to edit, the image is likely served via CSS and cannot be edited.