Setup Google Drive as a Content Source

This is a follow-up step for sites that would like to use google drive (docs and spreadsheets) as a content source. It assumes that the Developer Tutorial has already been completed

Prerequisites:

  1. Completed the Developer Tutorial
  2. You have a Google account.

In your fork of the aem-boilerplate GitHub repository, the site by default points to Document Authoring. To replicate the default content in Google Drive we recommend to use this folder for some example content.


This content is read-only, but it can be copied into your Google Drive folder to serve as a starting point.

To author your own content, create a folder in your own Google Drive and share the folder with the Adobe Experience Manager user (helix@adobe.com).

A good way to start authoring your own content is to copy index, nav and footer from the sample content and familiarize yourself with the content structure. nav and footer are not changed frequently in a project and have a special structure. Most of the files in a project look more similar to index.

Open the files and copy/paste the entire content into corresponding files in your own Google Drive. You can also download the files via Download All or download individual files. However, remember to convert the downloaded .docx files back into native Google Docs, when you upload them to your folder in your Google Drive.

Now that you have your content, you need to connect that content to your GitHub repo. You do this by changing the reference in Site Configuration in the configuration service.

(see: https://www.aem.live/docs/admin.html#schema/SiteConfig for more detail)

An easy way to make this change is to use https://labs.aem.live/tools/site-admin/index.html to either create or update a site configuration.

Be aware that after you make that change, you will see 404 not found errors as your content has not been previewed yet. Please refer to the next section to see how to start authoring and previewing your content. If you copied over index, nav and footer all three of those are separate documents with their own preview and publish cycles, so make sure you preview (and publish) all of them if needed.

Preview and publish your content

After completing the last step, your new content source is not empty, but no content has been promoted to the preview or live stages, which means your website serves 404s.

To preview content, an author has to install the Sidekick Chrome extension. Find the Chrome extension in the Chrome Web Store.

After adding the extension to Chrome, don’t forget to pin it, this will make it easier to find it.

To set up the Chrome extension, go to your previously shared Google Drive folder and click the extension icon in the browser toolbar and select Add this project.

As soon as the extension is installed and your project is added, you are ready to preview and publish your content from your Google Drive.

Select all three docs and activate the AEM Sidekick by clicking on your pinned extension. A new toolbar will appear. Clicking the preview or publish buttons will trigger the corresponding operation.


Open the index doc and make some changes. Activate the Sidekick by clicking on your pinned extension and then click the Preview button which will trigger the preview operation and open a new tab with the preview rendition of the content.