Using the AEM Sidekick

​​The AEM sidekick provides content authors with a toolbar offering context-aware options so that they can edit, preview, and publish their content directly from the pages of your website.

This document explains how to use the sidekick.

Installation

Please see the document Installing the AEM Sidekick for how to install and configure the sidekick.

Using the Sidekick

The sidekick can be invoked in the following contexts:

• Within project environments
• Within online editors (depending on your project setup) to edit your content
  • Google Docs/Sheets
  • Microsoft Word/Excel

To use the sidekick extension, navigate to a URL associated with your project. This can be one of the following:

• A SharePoint or Google document (desktop only)
• A Preview URL (the domain name ending in .hlx.page)
• A Live URL (the domain name ending in .hlx.live)
• A production URL (the domain name being your project’s public host name). Note: This requires adding the project to your configuration

The sidekick extension can be toggled by clicking the Adobe Experience Cloud icon next to the address bar. If you are using the bookmarklet, click the bookmarklet in your browser’s toolbar.

Adding Projects

Adding projects to your sidekick configuration is optional for most use cases. The sidekick is able to auto-detect if a URL is associated with your project. If you want the sidekick to also recognize custom domains, such as your project’s production domain, you’ll need to persist the project in your sidekick configuration by clicking the + button on the right hand side..

Environment Switcher

^{The environment switcher on a sidekick in Google Docs.}

When using document-based authoring to create content, content moves from the editor through different environments. The environment switcher allows you to easily jump around between them.

Preview

This option takes you to the preview environment, which reflects the latest changes of the page rendered from the source document. You can also send preview URLs to stakeholders so they can review your content before it gets published. Note that this option is only enabled if the content you are looking at has been previewed before.

The preview URL follows the pattern https://branch--repo--org.hlx.page/path.

• branch, repo and org identify the location of your project’s underlying code in GitHub
• /path corresponds to the location of the content in Google Drive or OneDrive, starting from the root folder.
• A / at the end of a path refers to the index document in a folder.

Live

This option is only available if there is not yet a production environment. It shows the published content and serves as a stand-in (and the origin) for your project’s production environment. Note that this option is only enabled if the content you are looking at has been published before.

The live URL looks almost identical to the preview URL, the only difference being in the 1st level domain: https://main--repo--org.hlx.live/path

Production

This option takes you to the production environment, which is your project’s public-facing website. Note that this option may not be available during the development stage of your project or because the content has not been published yet.

This environment can be a 3rd-party or “bring your own” CDN. Depending on the project setup, new content may only appear after a delay.

If your public-facing domain name is yourproject.com, the production URL would be https://yourproject.com/path

Actions

There are a number of actions that you can take on your content by conveniently using the sidekick toolbar. Actions that have not been executed since the content was last changed are badged with an orange indicator.

Preview

\ ^{The preview action on a sidekick in Google Docs.}

Preview is the predominant action in the editor. It (re)generates the preview page based on the current document and opens it in a separate tab.

Edit

The Edit action is available in all three environments. It opens the online editor of the current page’s source document in a separate window.

^{The sidekick in a preview environment.}

At a minimum read access to the document in Google Drive or OneDrive is required to use this action.

Reload

The Reload action is available in the preview environment only. It can be used to force a content refresh, for example if you have editor and preview open side by side while working on the content. The action is identical to the Preview action in the editor.

Publish

The Publish action is available in all three environments and makes the current preview version of the page available in the live and production environments.

^{The sidekick in a live environment.}

Visitors to your public-facing website will not be able to see changes until they are published.

Bulk Actions

Open the sidekick in Google Drive or Microsoft SharePoint and select one or more files to bulk preview and publish files and conveniently copy their URLs. You can also use this feature to preview and publish media like SVG or PDF files.

Adobe continues to extend the support for file formats that can be published directly from your content source (SharePoint or GDrive) based on popular use and security considerations. Currently the supported formats include: PDF, SVG, JPG, PNG.

Formats that are under consideration for being added include: XML, MP4 as well as raw DOCX, XLSX, PPTX without transformation.

Limitation: in Microsoft SharePoint, larger selections (more than 60) may not be fully exposed to the sidekick and may therefore need to be split into smaller badges.

Bulk Preview

Selecting multiple documents in SharePoint or GDrive allows you to preview multiple documents en masse.

^{Bulk preview in Google Drive.}

Bulk Publish

Selecting multiple documents in SharePoint or GDrive allows you to publish multiple documents en masse.

^{Bulk publish in Google Drive..}

Copy URLs

Use this feature to copy the preview, live or production URLs of one or multiple files.

Unpublishing Content

If you need to remove content from your website, the first thing to do is to delete, rename, or move the underlying source document in Google Docs or OneDrive.

For a page without a source document (i.e. it was renamed or moved), the sidekick will show the following two actions when invoked in the preview environment.

Note: If you are signed in to the sidekick, you can skip deleting the underlying source document and simply hold down the Alt (Windows) or Option (Mac) key to bring up the Delete and Unpublish actions.

^{The sidekick on a preview page without a source document.}

Delete

The Delete action will permanently delete the page from all environments, implicitly unpublishing it.

Unpublish

This Unpublish action will unpublish the page, but still keep it in the preview environment for reference.

See the document Authoring and Publishing Content for more information about deleting content.

Caution: The Delete and Unpublish actions cannot be undone! Double-check the URL and page content to make sure it is really OK to delete and/or unpublish a page. The source document may have been moved accidentally and may not need to be deleted.

Sharing the Sidekick

You can share the sidekick configuration for your project by clicking the share symbol at the top right. This will copy a share URL to your clipboard and allow you to paste it in a DM or email to a colleague. The share URL will enable the recipient to effortlessly install the sidekick for your project.

See the document Installing the AEM Sidekick for more information.

Customizing the Sidekick

If you are a developer, you can customize the sidekick for your project.

3rd Party Libraries

Library	License
webcomponents-ce v2.6.0	BSD
js-yaml v4.0.0	MIT