---
title: Current content authoring process
slug: tv-emea-brand-visibility-bootcamp/current-content-authoring-process
image: https://archbee-image-uploads.s3.amazonaws.com/1Jp0iolWv35Z_mkI7oUiT/d6h40yGiaWIexoGsBZPqp_untitled-2-1.png
docTags: 
createdAt: 2026-05-07T19:08:16.263Z
---

## Introduction

In this exercise, you'll manually add and configure a teaser block on your homepage
using the Universal Editor — Adobe CX Enterprise's WYSIWYG authoring interface for
content authors.

## Open your page in Universal Editor

1. Open **[Adobe Experience Manager Sites](https://author-p135360-e1341441.adobeaemcloud.com/ui#/aem/sites.html/content/frescopa/en/bootcamp)** in a new tab.
2. Navigate to **Frescopa > English > bootcamp > User XX**, replacing XX with your
   user number from the log in email.
3. Select the **Home** page by checking its checkbox.
4. Click **Edit** in the top menu. This will open your homepage in the Universal Editor.



![](https://api.archbee.com/api/optimize/1Jp0iolWv35Z_mkI7oUiT/0JyhCjVopnTVfb-IuvcYW_screenshot-2026-05-08-at-180706.png)

## Add a teaser block

Now lets add a teaser block at the bottom of the page. 

1. Scroll down to the bottom of the page.
2. Click on **Content Tree** icon on the right side menu.
3. Select **Main** Content section from the content tree.

![](https://api.archbee.com/api/optimize/1Jp0iolWv35Z_mkI7oUiT/G9ekiFkiiuMM0iG_zH5qp_screenshot-2026-05-08-at-181016.png)

1. Click the **+** icon inside the main block to add a new section at the bottom.
2. Click on the section block in the content tree to show options for the section. You will see it highlighted with a blue outline and a **Section** label at the top.

![](https://api.archbee.com/api/optimize/1Jp0iolWv35Z_mkI7oUiT/juK5roCijqKthSXqueMM7_screenshot-2026-05-08-at-181346.png)

1. Click the **+** icon inside the section to add a new component. This will open
   the component picker.
2. Select **Teaser** from the component list. A new teaser block will be added to
   the section with default placeholder content — **Teaser Title** — visible on the canvas.

![](https://api.archbee.com/api/optimize/1Jp0iolWv35Z_mkI7oUiT/FWtEiazTXWWycveYHc9ZW_screenshot-2026-05-08-at-181924.png)

## Configure the teaser block

Now lets configure content inside the teaser block.

1. Expand and select Teaser block in the content tree.

   ![](https://api.archbee.com/api/optimize/1Jp0iolWv35Z_mkI7oUiT/5--VI9bwPmQabVv7CF8X--20260508-172300.png)
2. Switch to properties view by clicking on **properties** icon on the right side menu.

   ![](https://api.archbee.com/api/optimize/1Jp0iolWv35Z_mkI7oUiT/N_PCIs34yNdKnrw8Av4Ad-20260508-172356.png)
3. Click the **+Add** in the image field at the top of the **Teaser** properties panel. This will
   open the **Content Advisor** asset picker.
4. Ensure you select **DEMO POT EMEA Program 1 - CSC EMEA Bootcamp dev author **repository

   ![](https://api.archbee.com/api/optimize/1Jp0iolWv35Z_mkI7oUiT/QbtCjdLssyTpb9J80_5xe-20260508-172606.png)
5. In the left panel, navigate to **frescopa > en** to browse the Frescopa asset folder. Search for `coffee`
6. Select your desired image asset and click Select. This image will update immediately on the canvas.

   ![](https://api.archbee.com/api/optimize/1Jp0iolWv35Z_mkI7oUiT/di_-7qUhtxij2DxRCJtX9-20260508-172812.png)

The image will update immediately on the canvas.

![](https://api.archbee.com/api/optimize/1Jp0iolWv35Z_mkI7oUiT/Z7_8qEyozbnH4Ybq8auwF_screenshot-2026-05-08-at-182913.png)

## Configure the teaser content

Now fill in the teaser text fields in the properties panel on the right.

1. Enter the **Eyebrow** text. This is the small pre-title displayed above the heading.
   For example: `Coffee Lovers`
2. Enter the **Heading** text. This is the main title of the teaser.
   For example: `The best of the coffee world at your doorstep`
3. Click the **Long Description** field to open the rich text editor. Enter your
   description text and click **Done** when finished.
   For example: `You have everything you need at your Frescopa shop`

Your teaser should now display the eyebrow, heading, and description live on the canvas.

## Configure the CTA

Scroll down in the properties panel to configure the call-to-action button.

1. Set the **First CTA Type** to **Primary**. This renders the button as a filled
   button style.
2. Enter the **First CTA Text**. This is the label shown inside the button.
   For example: `Find out more`
3. Enter the **First CTA Link**. This is the URL the button will link to.
   For example: `/coffee`

The teaser block on the canvas will update in real time as you fill in each field.

![](https://api.archbee.com/api/optimize/1Jp0iolWv35Z_mkI7oUiT/WzvnRk-dCPV7e1cALxYoo_screenshot-2026-05-08-at-183133.png)

## Publish the page

Once you are happy with the teaser content and layout, publish your changes to
make them live.

1. Click the **Publish** button at the top right of the Universal Editor.
2. Select **Live** and click **Publish**. This will publish your changes to the
   live website URL.

:::hint{type="success"}
You have successfully added and configured a teaser block in the Universal Editor.
The teaser is now live on your homepage with a hero image, eyebrow, heading,
description, and CTA button.
:::