New editor: features, settings, and content creation guide

Overview

The new editor reimagines content creation in Simpplr. It combines speed, simplicity, and design flexibility to help creators produce content that is faster to build, more polished, and more enjoyable to create. Creators can start from scratch or use pre-built templates to maintain branding consistency. With drag-and-drop blocks, users can quickly add or rearrange text, images, buttons, quotes, and embeds -- everything updates automatically with auto-save. A visual preview mode ensures content looks great across desktop and mobile, while multi-step approvals and AI writing tools make it easy to collaborate, polish, and publish with confidence.

Key features

• Drag-and-drop editing blocks for effortless content arrangement

• Cover image functionality with diverse layout options

• Ability to upload custom thumbnail images

• Improved UI for page settings, accessible via an overlay panel

• Edit page settings for published content without revising the entire content item

• Updated UI for page templates

• Page template preview integrated into the page creation workflow

• Content previews optimized for desktop, tablet, and mobile screens

• Updated UI for content details

• Enhanced version history modal displaying all content states

• View content in all enabled languages during editing without manual translation

• Native mobile content details screen updated with new UI

Enablement and editor settings

The new editor is being rolled out through a controlled enablement process, as it involves a significant change to the content creation experience. Once the feature is enabled for a tenant, App managers will see a new setting under Settings > Set Up > Content Editor.

Option 1: Make new editor the default

When this option is selected:

• All users will use the new editor for content creation.

• The classic editor will no longer be available for creating new content.

Option 2: Allow users to choose between editors (default option)

When this option is selected:

• Users can choose between the classic editor and the new editor during content creation.

• This allows teams to transition gradually at their own pace.

End user experience

When the new editor is not set as default, the first time a user creates content they will see a prompt to choose which editor they want to use. Their preference is remembered for future content creation sessions.

A user-level setting is also available in profile settings, allowing users to manage their preferred editor at any time. When the new editor is enabled at the app level, the user-level setting has no default until the user specifies a preference through the content creation prompt or their profile settings. These two interfaces are synchronized -- any change made in one is immediately reflected in the other.

Editor restrictions and content behavior

With two editors available, the following restrictions apply.

Content created or edited in the new editor: All aspects of that content item -- editing, versioning, and viewing -- use the new editor going forward. There is no way to switch back to the classic editor for that content item or any of its versions.

Content created or edited in the classic editor: Content created in the classic editor continues to work as it does today. A Convert to new editor option is available on the edit content screen. If a user chooses to convert a content item, that version moves permanently to the new editor. There is no way to revert a converted version back to the classic editor.

Content rendering:

Disabling the new editor

App managers can disable the new editor at any time. However, any content already created in the new editor will remain in the new editor, as it uses features that cannot be rendered correctly by the classic editor. Attempting to render new editor content in the classic editor would break the following:

• Columns

• Inline files

• Thumbnails, including custom thumbnails

• Cover images across all layouts

Create content flow

The create content flow in the new editor has been redesigned to provide a faster, cleaner, and more intuitive experience. The flow is consistent across all entry points and allows users to begin creating content with fewer steps.

What is new

• Redesigned page creation modal with updated UI and enhanced layout

• Ability to change the editor choice between classic and new editor when both are enabled

• Unified entry flows across all screens -- Manage Content, Manage Site, Home, and Site Detail

• Template previews integrated into the editor environment instead of a list in the creation modal

• Content type and page category selection integrated into the creation modal

• Cleaner navigation transition into the editor with a clearly structured header, toolbar, and block sidebar

• Auto-save enabled from the moment the editor loads

• Cover section displayed upfront for immediate customization

Entry points

Users can start creating a page from four places:

1. Manage Content

2. Manage Site

3. Home dashboard

4. Site Detail screen

Regardless of where the user starts, the same creation modal is used.

Step-by-step creation flow

Step 1: Select Create page

Users tap the Create page button from any of the four entry points.

Step 2: Page creation modal

The modal includes the following fields:

• Content selector (mandatory -- visibility depends on the entry flow)

• Site selector (mandatory)

• List of 5 recently used sites (optional)

• Content type selector (mandatory)

• Page category selector (mandatory)

• Editor selection -- Classic or New (optional -- only shown when both editors are enabled)

• Create button

Users must select one site to proceed. The site selection dropdown shows all sites where the user has permissions. Recently used sites appear as tiles for quick selection.

Step 3: Content type and page category selection

Content type options include:

• News content

• Knowledge content

Page category selection shows all categories created under the selected site. Users can also create a new category directly from this field in the creation modal.

Step 4: Select Create

On selecting Create, the user is redirected to the page editor. Auto-save starts immediately. The editor loads with the following:

• Header

• Cover section, which includes the cover image and title field

• Editor canvas

• Block sidebar

• Editor toolbar

Editor layout

The editor consists of the following areas:

Key notes

• The page template dropdown is no longer shown in the creation modal -- template selection has fully moved to the editor flow.

• Mandatory selections at creation time are limited to site, content type, and page category.

• Primary language, display author, and other metadata are handled inside page settings, not during page creation.

• Page creation is limited to desktop and tablet users only.

Auto-save

The auto-save feature ensures that page edits are continuously and safely preserved while users create or edit content. A manual Save button is also available for users who prefer explicit control. Together, these mechanisms prevent data loss due to browser closure, user logout, or network interruption.

• Auto-save applies to all page types -- News and Knowledge.

• All edits to content and metadata are saved automatically at regular intervals.

• A manual Save option is available for user-initiated saving.

• Version history is maintained for audit and rollback purposes.

• Offline editing is handled gracefully, with changes synced upon reconnection.

• Visual indicators provide clear feedback on save status.

How auto-save works

Draft initialization

When a user selects Create page and completes the mandatory fields (site, category, and content type), a new draft is automatically created with the default name "Untitled page."

Auto-save

• Frequency: Every 30 seconds after the last detected change.

• Content saved: Page body, metadata, layout, and inline content blocks.

• UI indicators: A "Saving..." indicator appears while the operation is in progress, followed by a "Saved" indicator on success.

• Auto-save runs silently in the background without blocking user actions.

Manual save

• A Save button is available in the editor toolbar.

• Selecting Save immediately triggers a full save request, regardless of the auto-save schedule, and overrides any pending auto-save interval.

• The same success and failure indicators appear as with auto-save.

• Each manual save creates a version entry in version history. If no changes have been made since the last version, the system skips the redundant save.

Offline editing

• The system detects loss of internet connection.

• Any edits made during an offline state will not be saved.

• When the connection is restored, the last auto-saved changes are shown and the "Saving" indicator appears as auto-save triggers.

• If another editor takes over edit access during the connection loss, the current user will lose edit access and the content will be locked by the second user.

Version history

• Auto-save continuously adds changes to the current version.

• Each manual save action creates a new version entry.

Drag-and-drop components

The drag-and-drop system is one of the core upgrades in the new editor. It provides a modern, block-based editing experience where authors can insert, reposition, and manage content elements with full control and visual clarity.

What is new

• Fully redesigned block sidebar with categorized content blocks

• Smooth drag-and-drop interactions across the entire canvas

• New hover states, drop indicators, and empty-state placeholders

• Ability to reorder components using drag-and-drop

• Auto-save on every block movement or modification

• Standardized block UI with consistent styling and spacing

Block sidebar

Located on the left side of the editor, the block sidebar contains all available components that a user can add to the page. Blocks are organized into the following categories:

Text

• Heading

• Paragraph

• List

• Quote

• Callout

• Table

• Code

Structural elements

• Columns

• Accordion

• Divider

• Button

Media

• Image

• Video

• File

• Embed

Smart blocks

• Survey

• Polls

• Forms

Users can scroll through the sidebar or use category grouping for easier discovery.

Adding a block

Users can add blocks in two ways:

Drag and drop: Click and hold any block from the sidebar, drag it into the canvas, and release to insert. Visual drop targets appear to guide placement.

Click to insert: Clicking a block inserts it below the currently selected block. If no block is selected, it appears at the bottom of the canvas.

Drop indicators

The new editor introduces visual indicators to make placement clear:

• Horizontal bar -- insert block in a specific position

• Section highlight -- drop inside a layout block

• Empty space placeholder -- visible when the canvas has no content

Reordering blocks

Users can move existing blocks by grabbing the drag handle shown on hover and moving the block above or below other blocks.

Empty canvas state

When the editor is completely empty, users see top-level tiles to get started:

• Write with AI

• Templates

Selecting an option performs its action.

Auto-save behavior

Every drag, drop, delete, reorder, or structural change is automatically saved instantly, the version is updated, and state consistency is maintained even on accidental exit. Users never need to manually save block placement.

Permissions

All users with content creation permissions can use drag and drop. Templates may preload blocks that users can freely modify.

Content blocks and toolbar capabilities

This section outlines the available content blocks in the new editor and the contextual toolbar options supported by each block. Toolbar options are context-sensitive and appear only when the relevant block is selected or focused. Inline formatting options apply only to selected text ranges. Block-level actions such as duplicate and delete apply to the entire block.

Common toolbar behaviors

The following actions are available across most content blocks:

• Duplicate block

• Delete block

• More options menu

• Keyboard and mouse-based selection

• Block-level focus and hover states

Text-based content blocks

Heading block Used for structuring content into clear sections and hierarchies. Toolbar options: Bold, Italic, Underline, Strikethrough, Text color, Highlight color, Text alignment, Indent, Bullet list, Ordered list, Emoji, Link, Writing assistant, More options, Copy block link, Duplicate, Delete.

Paragraph block Primary block for body content and long-form text. Toolbar options: Bold, Italic, Underline, Strikethrough, Text color, Highlight color, Text alignment, Indent, Bullet list, Ordered list, Emoji, Link, Writing assistant, More options, Duplicate, Delete.

List block Used for ordered and unordered lists. Toolbar options: Bold, Italic, Underline, Strikethrough, Text color, Highlight color, Text alignment, Indent, Bullet list, Ordered list, Emoji, Link, Writing assistant, More options, Duplicate, Delete.

Quote block Used to highlight quoted or emphasized content. Toolbar options: Background color, More options, Duplicate, Delete.

Callout block Used to draw attention to important information or notices. Toolbar options: Background color, Border (corner rounding), More options, Duplicate, Delete.

Table block Used to present structured data in rows and columns.

Primary toolbar options: Table settings, Table alignment, Border, More options, Duplicate, Delete.

Bubble menu options (row-level): Header row, Move row up, Move row down, Insert row above, Insert row below, Color (text and background), Alignment, Duplicate row, Delete row.

Bubble menu options (column-level): Header column, Move column left, Move column right, Insert column left, Insert column right, Duplicate column, Delete column.

Table-level action: Delete table.

Code block Used to display code snippets or technical content. Toolbar options: More options, Duplicate, Delete.

Structural element blocks

Columns block Used to create multi-column layouts within a page. Toolbar options: Select columns, More options, Duplicate, Delete.

Accordion block Used to organize collapsible content sections. Toolbar options: Border, Background color, More options, Duplicate, Delete.

Divider block Used to visually separate sections of content. Toolbar options: More options, Duplicate, Delete.

Button block Used to add call-to-action buttons within content. Toolbar options: Button styles, Align, Border, Link, More options, Alt text, Duplicate, Delete.

Media blocks

Image block Used to display images within the content. Toolbar options: Align, Add image, Border, Crop, Replace, Link, Caption, More options, Alt text, Duplicate, Delete.

Video block Used to embed video content. Toolbar options: Align, Add video, Replace, More options, Duplicate, Delete.

File block Used to attach downloadable files. Toolbar options: Display options, Add file, Replace, More options, Duplicate, Delete.

Embed block Used to embed external content such as third-party widgets. Toolbar options: Align, Replace, More options, Duplicate, Delete.

Smart blocks

Survey block Used to embed and interact with surveys. Toolbar options: Edit, Open survey, More options, Duplicate, Delete.

Typography

The new editor introduces a standardized typography system to ensure consistent visual hierarchy, improved readability, and predictable spacing across all content blocks. Typography styles are applied automatically based on the selected text type -- no manual adjustments are required.

Heading font sizes

Heading margins and line height

Spacing around headings is automatically calculated based on font size.

Margins:

• Top margin: Heading font size x 1.25

• Bottom margin: 0.5em

Line height:

• Font size greater than 18px: Line height = heading font size x 1.2

• Font size 18px or smaller: Line height = heading font size x 1.5

Exception: If a heading is the first element on a page, the top margin is not applied and page-level padding rules are followed instead.

Calculated heading top margins

Paragraph margins and line height

• Line height: Paragraph font size x 1.5

• Top margin: Paragraph font size x 1em

List margins and line height

• Line height: 1.5em

• Top margin: 0.75em (calculated as paragraph font size x 0.75 -- for example, a 16px font produces a 12px top margin)

Each list item inherits the same line height to ensure consistent spacing between bullets or numbered items.

Standard content block spacing

A standard vertical margin of 40px is applied between all content blocks other than Heading and Paragraph blocks. This spacing is system-defined, applied automatically, and cannot be manually adjusted. Heading and Paragraph blocks continue to follow their respective typography-specific margin rules.

Editor behavior

• Typography styles are applied automatically based on the selected text type.

• Spacing and line height are system-controlled and cannot be overridden at the block level.

• Drag-and-drop, insert, and reorder actions preserve typography rules.

• Visual spacing updates instantly when switching between text styles.

Cover image

The cover image functionality in the new editor introduces a redesigned, flexible, and more visually compelling way for content creators to control how their page cover looks. The new system supports multiple layouts, improved upload interactions, real-time previews, better cropping logic, and consistency across the page editor, page template editor, and content details.

What is new

• Fully redesigned cover UI with new layout options

• Improved image upload flow with better quality handling

• Support for four cover layouts: Default view, Split view, Background overlay, No cover

• Drag-and-drop image upload

• Inline cropping and repositioning tools

• Ability to switch layouts without losing previously uploaded images

• Responsive behavior optimized for desktop and mobile previews

Cover layout options

Creators can choose from any of the four available layouts. Switching layouts is instant and updates the canvas immediately.

1. Default view

Standard full-width image. The title appears below the cover. A safe choice for most news and informative content.

Edit layout options:

• Layout width: Full width, Large, Regular

• Aspect ratio: Extra large (16:9), Large (2.5:1), Medium (3:1), Small (4:1)

• Content width: Depends on layout width as follows:

• Content alignment: Left aligned or center aligned

• Border colors: No color or shades of brand color

• Corner rounding: None, Small, Medium, Large

2. Split view

Two-column hero layout. The left side shows the cover image and the right side shows the title. Ensures readability even with busy images. Commonly used for branded announcements.

Edit layout options:

• Layout width: Full width, Large, Regular

• Aspect ratio: Extra large (16:9), Large (2.5:1), Medium (3:1), Small (4:1)

• Border colors: No color or shades of brand color

• Corner rounding: None, Small, Medium, Large

3. Background overlay

The title sits on top of the cover image. Users can apply a controlled overlay to maintain text contrast. Smart controls ensure the heading remains readable.

Edit layout options:

• Layout width: Full width, Large, Regular

• Aspect ratio: Extra large (16:9), Large (2.5:1), Medium (3:1), Small (4:1)

• Corner rounding: None, Small, Medium, Large

• Text color: Black or White

• Content width: Depends on layout width as follows:

• Content alignment: Left aligned or center aligned

• Overlay color

• Overlay opacity: Default is 40%, and can be changed

• Border colors: No color or shades of brand color

4. No cover

Removes the cover image from the cover section. The page begins directly from the page title. Ideal for simple text-only use cases or micro-updates.

Edit layout options:

• Content width: Fill container, Large, Regular

• Content alignment: Left aligned or center aligned

Uploading a cover image

Users can upload a cover image using the following methods:

Add cover image section:

• Upload button -- upload an image from the local system

• Browse button -- select from the intranet library

• URL -- add an image address link

• Unsplash -- select from the Unsplash library

Drag and drop: Drag an image file into the cover area to replace or insert a cover.

Replace image: Once an image is set, a Replace image button appears. Accepted formats include JPG, JPEG, and PNG. The system recommends a minimum resolution for high-quality display.

Image adjustments

Once uploaded, users can:

• Reposition the image using cover layouts

• Crop using the built-in cropping tool

• Replace the image

• Add a caption

• Add alt text

Handling text legibility

The new editor provides options to adjust overlay and text color for readability:

• If the image is dark, users can apply white title text.

• If the image is bright, users can apply black title text.

Behavior across templates and page creation

Cover functionality behaves consistently across page creation, page editing, page template creation, and page template editing.

Key rules:

• Cover settings in templates become the default for new pages.

• Authors may override the cover layout or image while editing their page.

• Changing a template does not update pages already created from that template.

If no cover image is provided

If a user selects a layout that requires a cover image but does not upload one, the cover layout automatically switches to the No cover layout at the time of saving or publishing. For published content, the system renders the space gracefully without an image.

Mobile, tablet, and web preview support

Preview mode with web, tablet, and mobile toggles shows the cropped view, text readability, layout responsiveness, and split view behavior on small screens. This helps creators ensure the cover looks polished before publishing.

Auto-save behavior

The following actions are saved instantly:

• Uploading or replacing an image

• Changing the cover layout

• Cropping

• Title updates

Title visibility by layout

Cover images do not impact thumbnails directly -- thumbnails are managed separately and the choice to use the cover as a thumbnail is up to the user.

Thumbnails

Thumbnails in the new editor allow content creators to define a dedicated visual representation for their content across listing surfaces such as content feeds, search results, carousels, tiles, newsletters, and mobile views. Unlike cover images, thumbnails are independent, purpose-built, and optimized for smaller formats.

What is new

• Dedicated thumbnail management UI, separate from cover images

• Ability to upload a custom thumbnail image

• Clear distinction between cover image and thumbnail

• Improved preview of thumbnail usage across content listings

• Better image validation and aspect ratio guidance

• Auto-save and version tracking for thumbnail changes

• Thumbnail updates without requiring a cover image

Thumbnail management is available inside page settings, which can be opened from the settings icon in the top right of the editor.

What is a thumbnail

A thumbnail is a small, cropped image used to visually represent content in the following surfaces:

• Content listing pages

• Carousels and tiles

• Search results

• Mobile screens

• Feed

• Related content sections

• Newsletter

• Content share modal

Two thumbnail sizes are supported: Widescreen (16:8) and Square (1:1).

Uploading a custom thumbnail

Users can upload a custom thumbnail using the following options:

• Upload from local system

• Select from the intranet or media library

• Provide an image URL

• Select from Unsplash

The UI provides guidance on recommended aspect ratio, minimum resolution, and image clarity for small-screen usage.

If no thumbnail is uploaded and no cover image is added, the thumbnail falls back to system-defined default behavior such as the site image or a placeholder image.

Replacing a thumbnail

Users can replace the thumbnail with a new image at any time. Replacing a thumbnail updates it everywhere the content appears. The edit thumbnail option also allows users to crop the image. If no thumbnail is uploaded and no cover image is added, the thumbnail falls back to system-defined default behavior.

Relationship between cover image and thumbnail

The new editor intentionally decouples thumbnails from cover images.

Important rules:

• Cover images automatically become thumbnails by default until a thumbnail is manually added.

• Once thumbnails are automatically generated, they can be adjusted or cropped.

• Thumbnails can also be custom uploaded by the user.

• Changing or removing a cover image affects the thumbnail only if the user has set the thumbnail to use the cover image in settings.

• Changing the thumbnail does not affect the cover image.

Permissions

Users with content edit permissions can manage thumbnails. Template-defined thumbnails apply only at creation time. Existing content is not affected by later template changes.

Key notes

• Thumbnails are optional but strongly recommended for discoverability.

• Thumbnail images should prioritize clarity over detail.

• Best practice is to use purpose-designed images rather than cropped covers.

• Thumbnail changes are safe, reversible, and non-destructive.

Page settings

Page settings in the new editor provide a centralized, non-intrusive way for content creators to manage metadata, visibility, and configuration options for a page without interrupting the content editing flow. The redesigned page settings experience is delivered through an overlay panel, allowing users to view and modify settings while keeping the editor context intact.

What is new

• Page settings accessible via a dedicated overlay panel

• Non-blocking UI that preserves editor context

• Clear grouping of settings for better discoverability

• Instant auto-save for configuration changes

Accessing page settings

Page settings can be opened from the Settings icon in the editor header, available for draft, in-progress, and published content.

Page settings overlay structure

The page settings overlay is organized into the following sections:

• Page details

• Audience and visibility

• Customize page preview

• Files and attachments

• Publishing and expiration

The overlay can be closed at any time without losing unsaved changes.

Page details

This section contains core page attributes:

• Display author (editable)

• Content type (editable)

• Page category (editable)

• Primary language (editable)

• Created by (read-only)

The display author is what appears everywhere the author of the page is shown. If the author is changed, the display author is updated but the Created by field remains unchanged.

Changes made in this section reflect instantly in the editor header and canvas and are auto-saved without manual confirmation.

Audience and visibility

Controls in this section define who can see the content. Options include audience targeting and page access restrictions to selected audiences only. Visibility changes take effect immediately upon save. For published content, changes do not require a full content revision.

Publishing and expiration

This section allows users to control the lifecycle of the page. Available options include:

• Publish date (immediate or scheduled)

• Expiry date

• Allow feed comments checkbox (if applicable)

• Allow questions checkbox (if applicable)

Scheduled publishing respects the selected time zone. Expired content is automatically removed from active listings. Expiry does not delete the content -- it changes visibility only.

Auto-save and version history

All page settings changes are auto-saved instantly, reflected in version history, and can be audited without reverting content blocks.

Page templates

Page templates in the new editor allow site managers and authorized users to standardize page structure, layout, and visual presentation while maintaining flexibility for individual content creation. Templates are site-specific, reusable across multiple pages, and tightly integrated into the editor experience.

What is new

• Updated UI for template creation and editing

• Option to select the editor when creating a template, if both classic and new editor are enabled

• Template editor mode aligned with the page editor layout

• Template preview integrated directly into the page editor

• Clear enable and disable controls affecting template availability

• Improved template settings experience with structured accordions

Who can create and edit templates

Template access is role-based. Site managers and users with explicit template permissions can create and edit templates. Once templates are created and enabled, any user who can create content in a site can use those templates.

Creating a page template

Entering template creation

Users initiate template creation from the site-level template entry point. When both editors are enabled, users will see a prompt to choose the editor when creating a template.

On entry, the system opens the template editor mode. The layout matches the page editor experience.

Template editor layout

The template editor includes:

• Header (save state, exit)

• Toolbar (standard editor actions)

• Left block sidebar (content blocks)

• Cover section including the cover image and title field

• Editor canvas

All editor interactions behave the same as in page creation.

Template settings

Template settings are accessed via the Settings icon and are organized into two accordions.

Template details (mandatory fields: template name and page category)

• Template name (mandatory)

• Status: Enabled (default) or Disabled

• Content type

• Page category

• Primary language

Customize page preview Controls how the thumbnails of the page will appear after page content is saved or published. Includes thumbnail selection (same behavior as page settings) and topics (multi-select).

Saving a new template

1. Select Save in the header.

2. The user is redirected to the template settings page.

3. The template details accordion opens by default.

4. Mandatory fields must be completed.

5. Once completed, Customize page preview becomes accessible and the Save button becomes enabled.

6. Selecting Save in the footer creates the template.

Editing a page template

When editing an existing template, all previously saved content and settings are pre-populated and the editor opens in template editor mode. The Save button is replaced with Update.

Users can freely edit content blocks and settings. Selecting Update in the header redirects to the template settings page and opens the template details accordion by default, enforcing mandatory field completion. Once Customize page preview is opened, both accordions become freely accessible and the Update button is enabled.

Template availability during page creation

Only enabled templates appear in the editor's template sidebar. Disabled templates are hidden from page creation but remain editable by authorized users. Template selection occurs inside the page editor, not in the creation modal.

Applying a template to a page

When a template is selected, all predefined blocks render instantly, cover layout and settings are applied, and thumbnail and preview settings are pre-filled. Users can modify any block, remove or add new blocks, and change the cover or layout.

If a user selects a template after adding content to the canvas, all content already added will be lost. A warning is shown before this action is completed.

Key notes

• Templates accelerate page creation without restricting creativity.

• Template changes never affect pages that have already been created.

• Editor experience is consistent across pages and templates.

• Visibility of templates is controlled by their enabled or disabled status.

Content previews

Content previews in the new editor enable authors and reviewers to accurately visualize how a page will appear across different devices before it is published. The preview experience is tightly integrated into the editor workflow, allowing users to validate layout, readability, and visual hierarchy without leaving the editor.

What is new

• Dedicated preview mode accessible directly from the editor toolbar

• Support for desktop, tablet, and mobile previews

• True-to-render preview reflecting cover layouts, blocks, and other content elements

• No impact on auto-save or draft state when entering preview

• Improved responsiveness testing for complex blocks such as columns, media, and embeds

Accessing content preview

Users can access preview mode from the viewing mode option in the editor toolbar, available during page creation and editing. Preview opens in an overlay or full-screen mode. The editor canvas is temporarily replaced by the preview view. No content changes can be made while in preview mode.

Preview modes

Desktop preview

The default preview mode. Reflects the standard web layout including desktop typography and spacing. Best used for final layout verification, visual hierarchy checks, and large image validation.

Tablet preview

Simulates medium-screen responsiveness. Adjusts column stacking, media scaling, padding, and margins. Best used for tablet readability, split view cover behavior, and multi-column content validation.

Mobile preview

Simulates small-screen content consumption. Automatically stacks columns vertically, scales media, optimizes text wrapping, and adjusts cover layouts. Best used for mobile feed readiness and long-form readability.

What the preview reflects

Included in preview:

• Cover image layout and title placement

• Content blocks and their order

• Typography and spacing

• Images, videos, embeds, and files

• Column and accordion behavior

• Other metadata such as read time and attachments

Not included in preview:

• Editor-only UI elements such as block outlines, toolbars, and drag handles

• Draft indicators or save states

• Breadcrumbs, must-read alerts, or banners

• Page detail footer and other components such as feed

Preview and auto-save behavior

• Entering preview does not trigger a save.

• Previewing content does not create a new version.

• Any unsaved in-progress changes are previewed as-is.

• Exiting preview returns the user to the editor exactly where they left off.

Key notes

• Preview should be used before submitting for approval or publishing.

• Mobile preview is strongly recommended for long-form and media-heavy pages.

• Preview mode is read-only and safe to exit at any time.

• Preview experience is not available in the page template editor at this time.

Content details

The content details experience in the new editor has been redesigned to provide a clearer, more informative, and more action-oriented view of published and in-progress content. The new UI surfaces essential metadata, engagement indicators, status-driven actions, and lifecycle information in a structured layout. Content details act as the central single source of truth for a page once it moves beyond the editor.

What is new

• Updated content details UI with clearer visual hierarchy

• Status-aware header actions for Draft, Submitted, Published, Scheduled, and Unpublished states

• Improved metadata grouping and readability

• Enhanced version history access

• Integrated alerts for Must Read, Validation, and Moderation

• Consistent experience across Knowledge and News content types

Content details layout

The content details screen is divided into the following sections:

1. Header

2. Status and alerts

3. Content body

4. Metadata and system information

Header section

The header is dynamic and changes based on content status (Draft, Submitted, or Published), user role (Standard user, Author, or Manager), and content type (Knowledge or News).

Common header elements include the page icon with the label "Page," contextual action buttons based on status and role, and a 3-dot overflow menu with secondary actions.

Status-based header behavior

Draft content

Authors (standard users) see: Edit, Submit for approval, and overflow actions including Delete and Version History.

Managers see: Edit, Publish, and overflow actions including Delete, Add sentiment check, Version History, and Onboarding history.

Submitted for approval

Authors (standard users) see a read-only view with no action buttons.

Managers see: Reject, Approve and Publish, and overflow actions including Edit, Delete, Version History, and Moderation history.

Published content

Standard users see a view-only experience with no new header actions.

Managers see an analytics summary showing Total views, Viewed by, and Must read, an Edit button, and an overflow menu with advanced actions.

Alerts and banners

Content details can surface the following contextual alerts at the top of the page:

• Must Read (confirmation, completed, and manager view)

• Validation Required or Validation Expired (Knowledge pages)

• Published page has pending changes

• Content scheduled for publishing

Alerts are persistent based on rules. Multiple alerts may stack vertically. Alerts never block content visibility.

Content body

The content body renders the cover image and layout, page title, and all content blocks in read-only mode. The rendering matches the published view exactly, with no editor affordances such as drag handles or block toolbars. The content is responsive across desktop, tablet, and mobile.

Metadata and system information

Metadata is displayed below or alongside the content body and includes author name, published date, last updated date, language, topics, and files or attachments. This information is read-only.

Permissions and access control

Content details visibility depends on page status, user role, site permissions, and audience restrictions.

• Standard users can view published pages and their own drafts.

• Standard users cannot view drafts created by others.

• Managers can view all content states.

Content type consistency

The content details UI behaves consistently for Knowledge and News pages. Differences apply only where explicitly defined, such as the Validate action for Knowledge pages.

Content history

Content history includes version history, moderation history, feedback history, and onboarding history. While there is no change in the functionality of these features, the UI has been updated. Users can access all of these options from the 3-dot menu on the content details screen. A dropdown in the history modal allows users to switch between all history types.

Path: Content details > 3-dot menu > History

Version history

The version history modal displays a comprehensive list of all content iterations, including user identification, timestamp (date and time), and current version status.

The following terminology defines specific version states:

A view icon appears on hover over a version, allowing users to preview the content as it appeared in that specific state. Versions viewed from the version history modal show that particular version with the appropriate header (Draft, Draft saved after published, Submitted for approval, Published, or Scheduled).

A newly introduced capability allows users to restore previous drafts or published versions as a current draft. This gives users the opportunity to review and refine content before deciding whether to republish.

Content translation in the new editor

For all users granted content publishing permissions, a language selection dropdown is displayed prominently in the header from the start of the creation process. The visibility of this dropdown depends on whether automatic content translation is enabled at the application level.

If automatic content translation is enabled at the app level, content viewed in different languages is automatically translated. A header label indicates the content was translated via Google translation and provides options for an Open source button and Edit translation.

Manual translations

Content authors can modify automatic translations and save them as manual translations. During the edit translation process, authors can update the following:

• The main content body

• Cover image captions

• The custom summary, accessible via the Add custom summary option in the header

The Open source link allows users to view the original content in a new tab for reference while editing. The Translate automatically option in the header allows users to revert back to automatic translation at any time.

Page settings and translations

The page settings option is available on every translation page, allowing users to configure page metadata before publishing. The custom summary within page settings consistently reflects the main content's summary, but users can provide a unique summary for each translation through the Add summary feature in the header.

Whenever a manual translation is added, a translation section becomes visible in the page settings screen, showing which languages are being manually translated.

When all translation copies are in sync with the main language, this is reflected in the translation section. When translations are out of sync with the main language, this is also indicated.

Mobile app

As part of this feature, the mobile page details view has been aligned with the web experience.

When the cover image is set to the Background overlay layout and only a color is added (without an image), the cover section displays the color as set on the web. This means that in the Background overlay layout, users can add just a color in the cover image section from the web, and this color is rendered on mobile as well.