Inline editing

Overview

Use this procedure to edit and upload content while you are browsing the website. You do not need to open the website in the backend; you can use the inline editing function to edit your website directly while browsing it. Using the direct inline editing, you can see how the items you are editing look in the context of the website.

NOTE: By default, the inline editing functionality is disabled. You can enable inline editing by navigating to Administration » Settings » Advanced » Pages and in the Enable in-line editing input field enter true or false to enable or disable this functionality.

PREREQUISITES
    • To use inline editing, you must be logged in Sitefinity CMS backend.
    • You can edit only the currently published version of content. You cannot edit items that are in status Awaiting approval, Awaiting publishing, Rejected. Draft and Scheduled content is not displayed on the frontend.

Permissions for inline editing

To use inline editing, you must be a Backend user, because you cannot open the inline editing without being logged in the backend.

You must also have permissions to modify and publish the item that you want to edit, using inline editing.
If your site has an active workflow, the process of editing and uploading content follows the rules of the workflow. For more information, see Workflows and Workflow statuses.

Inline editing procedure

To directly edit your website, perform the following:
  1. Open the inline editing, login to Sitefinity CMS, and open the website in a browser.
    The system opens the website and displays the following icon in the right of the page:

    When the system displays this icon, it means that you can edit content directly in the browser.

  2. Click the icon and in the dropdown menu, click Edit content.
    A banner appears on top of the page, displaying publishing options.
    When you are in inline editing mode, the system indicates this by changing the color of icon as in the following screenshot:
  3. You edit content by clicking it.
    On mouse-over, the system colors the content that can be edited in yellow.
    For more information about which content can be edited directly in the browser, see Covered content section below.
  4. Save the edited content as draft or publish it.
    For more information, see Saving and publishing section below.
  5. To exit the inline editing mode, in the toolbar, click EXIT EDITING.
    If you have unsaved content, the system prompts you.

NOTE: To see which user is logged and can use the inline editing icon. The system displays the user that is currently logged in Sitefinity CMS. You can use the icon button to logout after you finish the changes.

Supported content

The following table lists all content items that you can edit directly in the browser, together with editing actions available for each content type:

Widget Available actions
Content block
  • Edit content
  • Edit all properties (in the backend)
    For more information, see Content blocks » Edit content blocks.
News
  • Edit title
  • Edit content
  • Edit all properties (in the backend)
    For more information, see Edit and delete news.
Blog list
Blog post
Events
  • Edit title
  • Edit event description
  • Edit all properties (in the backend)
    For more information, see Create content.
Lists
Image
  • Change image
  • Edit title
  • Edit alternative text
  • Edit display size
  • Edit all properties (in the backend)
    For more information, see Image actions.
Dynamic widgets
  • Edit title
  • Edit all properties (in the backend.)
    For more information, see Dynamic content items » Edit a dynamic content item.

Editing tools

  • You edit titles by directly inputting text in the input field.
  • You edit content and descriptions, using the text editing tools that appear in the toolbar.
    For more information, see Text editor.
    There is a separate toolset for the text editor in inline editing mode. For more information about configuring the toolsets, see Text editor settings.
  • To edit an image, click the image and then click icon.
  • To edit all properties of an item, you must open it for editing in the backend.
    To do this, click the item on the frontend and then in the toolbar, click » Edit all properties.

Save and publish

  • Publishing a single item.
    When you are editing a single item, for example the news title, you can publish this item only. To do this, in the toolbar click » Publish <item name>.
  • Publishing all changes on the page.
    To do this, click PUBLISH ALL button in the toolbar.

    NOTE: If the items that you try to publish are subject to a workflow, the system displays a notification, informing you about the new status of the content items and displays a link to editing the items in Sitefinity CMS backend.
    For example, if an item must be approved before publishing, the system inform you that the item you are editing cannot be published, the status of the item is changed to Awaiting approval, and there is a link you can follow to edit the item in the backend.

  • Saving all items on the page as draft.
    To do this, click SAVE AS DRAFT in the toolbar.
    All items on the page are saved in status Draft (newer than published).

NOTE: If not all items on the page are published, the system displays Mark not published content link in the toolbar. When you click the link, next to each item, the system displays its status.

Other inline edition options

When you click icon, you can use the following options:

  • Edit widgets and layout
    The system opens the page in page editing mode.
    For more information, see Apply page templates.

Increase your Sitefinity skills by signing up for our free trainings. Get Sitefinity-certified at Progress Education Community to boost your credentials.

Web Security for Sitefinity Administrators

The free standalone Web Security lesson teaches administrators how to protect your websites and Sitefinity instance from external threats. Learn to configure HTTPS, SSL, allow lists for trusted sites, and cookie security, among others.

Foundations of Sitefinity ASP.NET Core Development

The free on-demand video course teaches developers how to use Sitefinity .NET Core and leverage its decoupled architecture and new way of coding against the platform.

Was this article helpful?