Replacing Images on Your Impact Site

Replacing Images on Your Impact Site

Add, Replace, or Delete

This article explains how to replace an existing image or photo on your Impact website. If you wish to add a new image, go here. If you wish to delete an existing image, go here.

Overview: You first need to find the website page that contains the image to be replaced, find the associated Image block, and select the replacement image. The following instructions will guide you through this process.

Which Admin Area

Orgill’s Impact eCommerce system has two Admin areas (Elastic Path and Builder.io). All content edits, such as image changes, happen in Builder.io. If you don’t have a Builder.io login yet, refer to Requesting a Builder.io Login.

Finding the Website Page

Log into Builder.io and navigate to: Content > Content Type > Page models > Page. You will see an area with a list of all your website pages on the right.



Click on the name of the page you’d like to edit to open the Visual Editor.



Below are the instructions on how to use the Visual Editor to replace images on your page.

Replace an Image

Click on the image in the work area to select it.

Go to the Options tab.

Click Change Photo.



Upload an image by selecting [Upload a Photo] and then select it in the Asset Library. Make sure each image you upload is smaller than 100MB.

Alternatively, you can select an existing photo from the Asset Library that you have uploaded in the past.

Once the image is added to the work area, select [Publish Update] in the top right corner.

Images and Accessibility

Whenever you add an image to your site, always add Alt Text to images. Alt Text is a phrase that you provide with the image so that screen readers and search engines know what the image depicts.

To add Alt Text to an image in Builder.io:
  1. Select the Image block in the work area.
  2. Click the Options tab.
  3. Add text to the Alt text field.
The image below shows where the Alt text field is located within the Options tab. Remember that images serve as visual enhancements and should not be the only source of the information.

Delayed Update

It might take a while for the changes to appear on your public website. Due to caching, you might still see an old version of the public content for a few hours or a day, even though the updated content is visible within the Builder.io admin area.

Visual Editor Documentation

See Builder.io documentation to learn more about the Visual Editor: https://www.builder.io/c/docs/visual-editor 


    Emerge2 is here to help with website and ecommerce enhancements, marketing, and support services.

    These articles were created by Emerge2 Digital and are part of our Emerge2 Knowledge Base.