Category: Adobe CQ
-
Get data from a dialog using Sightly (Get a custom URL for the YouTube component)
In this session, you will see how to update the YouTube component to capture the URL entered by an author in the dialog. (I have uploaded the sample code in GitHub.) We have accomplished the following so far. Created a YouTube component that will add a specific YouTube video to the page. Created a dialog…
-
Create Adobe Experience Manager dialogs (Add a dialog to the YouTube component)
In this short session, we will see how to create AEM dialogs. This is primarily an overview session about AEM dialogs. I have shared the package in GitHub. AEM dialogs are used to enter information to a component. For example, if you open a page that I showed here and double-click the Title element, a…
-
Create your first Sightly component (YouTube component !!!)
In this session, you will learn how to create an AEM component. You have learned that an AEM component is used to display an information in a certain way. You will use Sightly to create the component. We will call the component as YouTube component. When you drag and drop the component to a web page,…
-
Summary: Your first Sightly template
This post provides a summary of what you learnt in the previous posts. Before going to the next step, creating components, let us first take a quick recap of all that we learned so far. AEM users generally belong to one of the following roles: Authors: create web pages. They use templates which provides the layout…
-
Apply a design to the AEM Sightly template
In this session, you will learn about adding a design to the template. You will use Sightly, because it’s HTML5 and very easy to use. This is in continuation of my previous blog posts. As usual, I have provided the video and transcripts below. Video can be watched in the Full screen mode. The sample design and…
-
Enable components in the Components tab
In the last session, we have added a space in the template that allows us to drag and drop a component to the web page. One of the shortcomings in the template was that it didn’t have any components in the Components tab. In this session, we will add components to the Components tab. Open the…
-
Add the Parsys component to template
In this session, let us try to modify the template we created earlier. We will add a parsys component in the template to provide a space in the web page to drag and drop components. Let us once again see how a page created using this template looks like. Log into to SiteAdmin. (http://localhost:4502/siteadmin) Double-click…
-
Summary – Create templates and use packages
In this session, let us summarize what we learned in the previous session: Create the first template. We created a template in three steps: Step 1: Created the company folder inside apps. Created a folder for components and templates. Step 2: Created a template inside the templates folder. Provided allowed paths as /content(/.*)?. And, we provided resourseType…
-
Create the first AEM template
In the last session, we have explored templates using CRXDE Lite. If you have not yet gone through the last session, go through it. In this session, we will create a sample template using CRXDE Lite. Let us first get into the shoes of authors to see where exactly authors use a template in their content…
-
Introduction to AEM developers, and their templates and components
In this post, we will see the very basic responsibilities of developers. Developers create templates and components. Let us first take a recap: a template defines the layout of a web page. Authors select a specific template before they create a page. A component allows authors to display a specific information in a certain format. For example,…