---
schema_version: "1"
id: b8014ec54bfba8be026e71b66673d2ba8bf474e4da0419afb54861dd2f379e82
title: Add Images to Text as a Contributor
collection: admin
version: current
locale: en-us
portal_url: https://docs.salesforce.com/admin/current/en-us/platform/264-0-0/siteforce_contentblock_livemode_image.md
canonical_url: https://help.salesforce.com/s/articleView?id=platform.siteforce_contentblock_livemode_image.htm&release=264.0.0&type=5
source_site: help.salesforce.com
content_type: documentation
content_hash: 2b71ad8bac797b87aef2d07c546921b91943f805bdabc02bb2660a5e48b7c85e
description: As a contributor, you can quickly add images to any editable text areas on the page using an inline editor.
products:
  - Salesforce Platform
  - Security
release: "264"
---
# Add Images to Text as a Contributor

As a contributor, you can quickly add images to any editable text areas on the page using an inline editor.

### Required Editions

<table class="slds-table slds-table_bordered slds-max-medium-table_stacked slds-m-bottom_small edition">
        <colgroup>
          <col>
        </colgroup>
        <tbody>
          <tr class="">
            <td class="slds-cell-wrap" style="vertical-align:top;">Available in: Salesforce Classic</td>

          </tr>
          <tr class="">
            <td class="slds-cell-wrap" style="vertical-align:top;">
              <p>Available for purchase in: <strong>Enterprise</strong>, <strong>Performance</strong>,
                and <strong>Unlimited</strong> Editions</p>
              <p style="margin-bottom:0;">Available (with limitations) in:
                <strong>Developer</strong> Edition
              </p>
            </td>

          </tr>
        </tbody>
      </table> <table class="slds-table slds-table_bordered slds-max-medium-table_stacked slds-m-bottom_small permission">
        <colgroup>
          <col style="width:50%">
          <col style="width:50%">
        </colgroup>
        <thead class="slds-text-title_caps ">
          <tr class="">
            <th scope="colgroup" class="slds-cell-wrap" colspan="2" style="text-align:center;vertical-align:top;" id="d32043e74">User Permissions
              Needed</th>
          </tr>
        </thead>
        <tbody>
          <tr class="">
            <td data-label="User Permissions Needed" class="slds-cell-wrap" style="vertical-align:top;" headers="d32043e74 ">To edit only content in Site.com sites:</td>

            <td class="slds-cell-wrap" style="vertical-align:top;" headers="d32043e74 ">
              <p><samp class="parmname">Site.com Contributor User</samp> field enabled on the
                user detail page</p>
              <p>AND</p>
              <p style="margin-bottom:0;">Contributor role assigned at the site
                level</p>
            </td>

          </tr>
        </tbody>
      </table>

Editable text areas display a gray border when you hover over the text. You can add images to these areas only.

When the page is open:

1. Double-click the text area you want to edit.
    
    The inline editor appears.
2. Position your cursor where you want to insert the image and click ![Image](https://sf-zdocs-cdn-prod.zoominsoftware.com/tdta-platform-extend_click-264-0-0-production-enus/5f7d9219-b7b1-4552-8891-f1aba9b289fc/extend_click/images/siteforce_icon_live_image.png).
3. In the Image Properties dialog box, enter a URL to an image in the URL field.
    
    For example, to add an image that you uploaded to the site, type / followed by the image filename, such as /myimage.png.
4. Enter a brief description of the image in the Alternative text field. If the browser can’t display the image, the description is used by screen reader users or as a substitute. It can also help with search engine optimization (SEO).
5. Optionally, preview how the image appears in relation to the text on the page and set:
    - The width and height of the image
    - The image border (for example, to set a border that's 10 pixels wide, enter 10 in the Border field)
    - How much space surrounds the image (which is controlled by the `HSpace` and `VSpace` properties)
    - How the image aligns with the text on the page
6. Click **OK**.

Your changes are saved automatically when you click anywhere outside the text area.

#### See Also

- [Edit Content Blocks as a Contributor](https://help.salesforce.com/s/articleView?id=platform.siteforce_contentblock_livemode_edit.htm&release=264.0.0&type=5 "Content blocks contain the text of your website pages, and can also house images and hyperlinks. As a contributor, you can edit the text in editable content blocks using an inline editor. Because you're editing the text inline, you always know exactly how the finished page looks when it's live.")
- [Understand the Inline Editing Toolbar](https://help.salesforce.com/s/articleView?id=platform.siteforce_contentblock_livemode_toolbar.htm&release=264.0.0&type=5 "As a contributor, you can use the inline editor to edit any editable text areas on the page. Editable areas display a gray border when you hover over the text.")
- [Preview How Pages Appear on Mobile Devices](https://help.salesforce.com/s/articleView?id=platform.siteforce_contentblock_livemode.htm&release=264.0.0&type=5 "With live mode, site administrators, designers, and contributors can preview how pages and templates appear on devices such as mobile phones and tablets.")
- [The Contributor's Page Editing View](https://help.salesforce.com/s/articleView?id=platform.siteforce_editor_page_edit.htm&release=264.0.0&type=5 "Use the Overview tab to import assets, preview the page, and update the appearance of the page.")