The quick site creation features showcased here will be released in the second half of 2021. The related documentation is available for preview purposes.
It is important to understand how a user will update content for the website. In this chapter we will adopt the persona of a Content Author and make some editorial updates to the site generated in the previous chapter. At the end of the chapter, we will publish the changes to understand how the live site gets updated.
This is a multi-part tutorial and it is assumed that the steps outlined in the Create a site chapter have been completed.
A website is typically broken into pages to form a multi-page experience. AEM structures content in the same way. Next, create a new page for the site.
Log in to the AEM Author Service used in the previous chapter.
From the AEM Start screen click Sites > WKND Site > English > Article
In the upper right-hand corner click Create > Page.
This will bring up the Create Page wizard.
Choose the Article Page template and click Next.
Pages in AEM are created based off of a Page Template. Page Templates will be explored in greater detail in the Page Templates chapter.
Under Properties enter a Title of “Hello World”.
Set the Name to be
hello-world and click Create.
In the dialog pop-up click Open to open the newly created page.
AEM Components can be thought of as small modular building blocks of a web page. By breaking the UI into logical chunks or Components, it makes it much easier to manage. In order to re-use components, the components must be configurable. This is accomplished via the author dialog.
Next, let’s author a few components using AEM’s Page Editor.
Navigate to the Hello World page created in the previous exercise.
Ensure that you are in Edit mode and in the left side-rail click the Components icon.
This will open up the Component library and list the available Components that can be used on the page.
Scroll down and Drag+Drop a Text (v2) component on to the main editable region of the page.
Click the Text component to highlight and then click the wrench icon to open the Component’s dialog. Enter some text and save the changes to the dialog.
The Text component should now display the rich text on the page.
Repeat the above steps, except drag an instance of the Image(v2) component on to the page. Open the Image component’s dialog.
In the left rail, switch to the Asset finder by clicking the Assets icon .
Drag+Drop an image into the Component’s dialog and click Done to save the changes.
Observe that there are components on the page, like the Title, Navigation, Search that are fixed. These areas are configured as part of the Page Template and cannot be modified on an individual page. This will be explored more in the next chapter.
AEM environments are split between an Author Service and a Publish Service. In this chapter we have made several modifications to the site on the Author Service. In order for site visitors to view the changes we need to publish them to the Publish Service.
High level flow of content from Author to Publish
1. Content authors make updates to the site content. The updates can be previewed, reviewed and approved to be pushed live.
2. Content is published. Publication can be performed on-demand or scheduled for a future date.
3. Site visitors will see the changes reflected on the Publish service.
Next, let’s publish the changes.
From the AEM Start screen navigate to Sites and select the WKND Site.
Click the Manage Publication in the menu bar.
Since this a brand new site, we want to publish all of the pages and can use the Manage Publication wizard to define exactly what needs to be published.
Under Options leave the default settings to Publish and schedule it for Now. Click Next.
Under Scope, select the WKND Site and click Include Children. In the dialog, un-check all of the boxes. We want to publish the full site.
Click the Published References button. In the dialog, verify that everything is checked. This will include the Basic AEM Site Template and several configurations generated by the Site Template. Click Done to update.
Finally, click Publish in the upper right-hand corner to publish the content.
Next, navigate to the Publish service to view the changes.
An easy way to get the URL of the Publish Service is to copy the Author url and replace the
author word with
publish. For example:
/content/wknd.html to the Publish URL so that the final URL looks like:
wknd.html to match the name of your site, if you provided a unique name during site creation.
Navigating to the Publish URL you should see the site, without any of the AEM authoring functionality.
Using the Navigation menu click Article > Hello World to navigate to the Hello World page created earlier.
Return to the AEM Author Service and make some additional content changes in the Page Editor.
Publish these changes directly from within the page editor by clicking the Page Properties icon > Publish Page
Return to the AEM Publish Service to view the changes. Most likely you will not immediately see the updates. This is because the AEM Publish Service includes caching via an Apache web server and CDN. By default HTML content is cached for ~5 minutes.
To bypass the cache for testing/debugging purposes simply add a query parameter like
?nocache=true. The URL would look like
https://publish-pYYYY-eXXXX.adobeaemcloud.com/content/wknd/en/article/hello-world.html?nocache=true. More details about the caching strategy and configurations available can be found here.
You can also find the URL to the Publish Service in Cloud Manager. Navigate to the Cloud Manager Program > Environments > Environment.
Under Environment Segments you can find links to the Author and Publish services.
Congratulations, you have just authored and published changes to your AEM Site!
Learn how to create and modify Page Templates. Understand the relationship between a Page Template and a Page. Learn how to configure policies of a Page Template to provide granular governance and brand consistency for content. A well-structured Magazine Article template will be created based on a mockup from Adobe XD.