Using the InContext Editor

Updated on 20-October-2016 at 10:16 AM

Business Catalyst End of life announcement - find out more details.

InContext Editing is a browser-based interface that allows you to edit and update the editable regions of your site. It is an integrated feature in the Admin Console, so you can use it without installing or launching any other software. Best of all, you can enter regular text to update page content with no coding required.

You can use InContext Editing to update and add new images as well. You can simply browse to select files that exist on your computer and use the interface to upload them. You can also choose images that are already uploaded to your site, or uploaded to any location on the Internet. And you can edit and modify module content directly.

To access the InContext Editing interface, click the Edit tab within the admin of your site.


Getting started with InContext Editing

Clicking the Edit button opens the Editor, displaying the home page of your site. You can hover over various sections of the content of your site. Any editable content is highlighted and presented with editing options as below:


You can navigate to other pages of your site by clicking links on a page as you would on the live site. If the link is marked as editable, hovering over the link displays an option to update the link.

  • wrap your selection in a div tag, and transforming that div into an Editable Region

The relevant editor appears for the type of content you are trying to update. Once you have finished updating the content, click Update in the editor window and then you can publish the page. Publishing the Page saves the live version of the page.

If your site has been set up to use device-specific folders (Settings > Mobile Support), the dropdown from the top bar can be used to access the various device-specific versions of the current page.


To edit a page using InContext Editing that is not linked from the home page, you can enter the page's name in the address field of the browser while ICE is enabled:

For example, this is the URLthat displays when editing the home page with InContext Editing:

Edit the URL (after the equal sign) to access the Contact page:

Use your cursor to highlight some existing text or click in the area you want to enter new text, and then begin typing the new text content.


As you are editing a text area, the top of the interface displays the formatting tools available. For example, you can set the font face, size and color granted these options have been set for the region.

Updating images with InContext Editing

Now let's see how to edit and insert images. Hover over an image, and then click the Edit button below the image.

  • To replace the image with another image already uploaded on your site, use the From Site tab, and then select the folder from the drop-down menu. Select the image.
  • To upload a new image, click the From My Computer tab, and then click Browse to upload.Select the file from your computer.
  • To reference an image from another site, click the From External URL tab, and then enter the URL in the field provided.

Click Update to replace the image.


In this section, you'll learn how to access the features in the interface to add and customize links. Follow these steps:

  1. Hover your mouse over an editable link, and then click the Edit button.
  2. Do one of the following:
    1. To link to an internal page (another page of your site), select one of the options from the left panel (example Web Pages). Click one of the items from the tree view.
    2. To link to an external site, ensure that the External Link tab is selected, and then enter the URL link in the field provided.
  3. Click Update.

After you've finished updating text, image and links on the page, you can then publish to the live site or discard the changes using the options available at the bottom of the InContext editing window.