Using the AEM Sidekick
The AEM Sidekick provides content authors with a toolbar offering context-aware options so that you can edit, preview, and publish your content directly from the pages of your website.
Installation
The AEM Sidekick is available for Chrome-based browsers (that includes Microsoft Edge). You can install it from the Chrome web store.
First use of the Sidekick
Once installed, the Sidekick appears as a toolbar hovering over the bottom portion of your content in the browser. If it is not showing, click the Sidekick icon in the browser toolbar. The Sidekick provides you with various tools and actions for navigating and publishing your content.
If your site has authentication for authors enabled, you will first need to click Sign in to authenticate before you can use the Sidekick.
Signing in is not required to use the Sidekick to switch between environments and preview or publish content. However if you wish to unpublish and delete pages, you must sign in.
Adding your project
The Sidekick is able to auto-detect if a URL belongs to your project. If you want the Sidekick to also recognize custom domains, such as your project’s production domain, custom preview domain, or custom live domain, you must add the project to the Sidekick.
This can be done in two ways:
From your source documents
Navigate to any source document associated with your project. Then click the context (≡
) menu on the Sidekick and select Add this project.
From your project URL
Navigate to a project URL (similar to https://main--repo--owner.aem.page/
) and click the context (≡
) menu on the Sidekick and select Add this project.
Removing projects and migration
You can remove projects from the Sidekick by following the same steps, but select Remove this project from the context menu instead.
If you have used a previous version of the Sidekick, you can migrate your previously-configured projects.
- Enable both the previous version of the Sidekick and the new version in your browser.
- Right-click the Sidekick plugin icon in your browser’s menu bar.
- Select Import projects from AEM Sidekick v6 from the context menu.
Using the Sidekick
The Sidekick can be invoked in the following contexts:
- Within project environments
- Within online editors (depending on your project setup)
- 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 Microsoft SharePoint or Google document (desktop only)
- A preview URL (the domain name ending in
.aem.page
) - A live URL (the domain name ending in
.aem.live
) - A production URL (the domain name being your project’s public host name), custom preview URL, or custom live URL
- 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 in your browser.
Source mode
When using document-based authoring to create content, content moves from the editor through different environments. The environment switcher allows you to easily jump between them.
When editing your document and first using the Sidekick, you default to Source mode. Click the Source button to reveal the additional environments available.
The environment switcher on a Sidekick in Google Docs.
In Source mode, you have the following action available.
- Preview (re)generates the preview page based on the current document and opens it in a separate tab.
Preview mode
The preview environment reflects the latest changes of the page rendered from the source document. Preview environments are indicated by a blue label. You can 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--site--org.aem.page/path
.
branch
,site
andorg
identify the content source and code base to use/path
corresponds to the location of the content in Google Drive or Microsoft SharePoint, starting from the root folder.- A
/
at the end of a path refers to the index document in a folder.
In Preview mode, the following actions are available:
- Edit is used to open the content source for editing.
- Update is used to force a content refresh.
- For example if you have Source and Preview open in side-by-side tabs while working on the content.
- The effect is identical to the Preview action in the editor.
- Publish makes the current preview version of the page available in the live and production environments.
- Visitors to your public-facing website will not be able to see changes until they are published.
Live mode
Live mode is only available if there is no production environment yet. It shows the published content and serves as a stand-in for your project’s production environment. Live environments are indicated by a green label. 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--site--org.aem.live/path
In Live mode, the following actions are available:
- Edit is used to open the content source for editing.
- Publish makes the current preview version of the page available in the live and production environments.
- Visitors to your public-facing website will not be able to see changes until they are published.
Production mode
Production mode takes you to the production environment, which is your project’s public-facing website. Production environments are indicated by a green label.
- This option may not be available during the development stage of your project or because no production environment has been configured yet.
- This environment can be a 3rd-party or “bring your own” CDN.
If your public-facing domain name is yourproject.com
, the production URL would be https://yourproject.com/path
The following action is available in Production mode:
- Publish makes the current preview version of the page available in the live and production environments.
- Visitors to your public-facing website will not be able to see changes until they are published.
Source
If you are using the Sidekick in the preview, live, or production environments, the source switcher will also offer an Open in option, which opens the online editor of the current page’s source (either a document or the AEM editor) in a separate window.
At a minimum read access to the document in Google Drive or Microsoft SharePoint is required to use this action.
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. The Sidekick counts the number of selected files and prompts you to confirm any bulk actions.
The Sidekick provides a status of ongoing bulk actions.
When the bulk actions are completed successfully, the Sidekick turns green and allows you to copy the URLs of the affected files via the Copy x URLs button or preview them via the Open x URLs button.
If a bulk action fails, it turns red and provides feedback on the failure via the Details button.
You can also use the bulk action feature to preview and publish media files. Adobe continues to extend the support for file formats that can be published directly from your content source (Microsoft SharePoint or Google Drive) based on popular use and security considerations. Currently the supported formats are MP4
, PDF
, SVG
, JPG
, PNG
. You can learn more about file size limits here.
Limitation: in Microsoft SharePoint, large selections of more than 60 files may not be available to the Sidekick and may therefore need to be split into smaller badges.
Bulk Preview
Selecting multiple documents in Microsoft SharePoint or GDrive allows you to preview multiple documents en masse.
Bulk Publish
Selecting multiple documents in Microsoft SharePoint or GDrive allows you to publish multiple documents en masse. The Sidekick prompts you to confirm before performing bulk actions.
Copy URLs
Use this feature to copy the preview, live or production URLs of one or multiple files.
Unpublishing and Deleting Content
If you no longer require content to be published, you can unpublish it and/or delete it.
- Unpublishing content will remove the page from your live and production environments, but still keep it in the preview environment for reference or future republication.
- Deleting permanently removes the content from all environments, implicitly unpublishing it.
Unpublishing and deleting content require you to be signed into the Sidekick. You must also have the appropriate roles assigned to your user.
- To unpublish you must have the role
publish
. - To delete you must have either the role publish or
author
.
Because unpublishing and deleting are not as common as previewing and publishing content, these options are kept behind an ellipsis menu, shown only when appropriate. Navigate to a published page or its preview and click the ellipsis button on the Sidekick to show the Unpublish option.
You can only delete pages from the preview environment. Deletion implicitly unpublishes the page if it has been published before.
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.
Due to the finality of deleting pages, you must confirm your deleting by entering DELETE in a dialog.
Customizing the Sidekick
If you are a developer, you can customize the Sidekick for your project.
Privacy and Security
Review AEM Sidekick Security for detailed information about how privacy and security are being handled in the Sidekick.
3rd Party Libraries
Library | License |
---|---|
Custom Elements Polyfill | BSD |
Lit | BSD 3-Clause |
MobX | MIT |
Spectrum Web Components | Apache 2.0 |
Up Next