Aem: Create A Internet Site In Cq5

In this academic, I will display you a way to create a internet site in CQ5 with little by little designated explanation of each step.

At the stop of this educational you’ll analyze:

  • How to create structure of Website in AEM.
  • How to create a Template in AEM.
  • How to create a Rendering Component.
  • How to create a Page in Site Admin in AEM.

Create Structure of Website in AEM (CQ5):

In this phase, we can create a directory shape  for the website. Follow below steps to create listing shape for internet site in AEM (CQ5):

  • Login into CRXDE Lite. In left panel, navigate to the apps folder.
  • Right click on apps folder. Select Create and Create Folder.
  • Enter the call as schooling(This might be your task call) and click on OK.

    Tip:- Always provide node name in lower case, because they grow to be a part of the URL.

  • click Save All.

  • Repeat the above manner to create a directory structure as follows:

  • Your fundamental structure of website is completed.

    Create a Template the usage of crxde to your website

    A template is used to create a web page. To create a web page, the templates’s content (apps/<utility call>/templates/<template name>) need to be copied to corresponding position in web page tree. This occurs routinely whilst we create a web page the use of AEM.

    When we create a template, following data receives saved at node repository:

    • Label: cq:Template – node name
    • Title: jcr:name – belongings
    • Resource Type: sling:resourceType  – assets
    • Ranking: ranking – belongings
    • Alowed Paths: allowedPaths – assets

    In this section, we are able to create a template in AEM:

  • Right click on the templates folder created in previous segment.
  • click on Create > Create Template
  • Enter following info and click Next:
  • NameValueLabelmyTemplateTitleContent Page TemplateDescriptionThis is Simply Cracked Content page templateResource Typetraining/components/myComponent( We want to create a element with identical call “myComponent“)Ranking1(rating indicates the order wherein the template seems at the introduction page. Setting rank to one guarantees that the template seems first in the list.When we create a web page from website admin)

    4. Click the + image prided with Allowed Path belongings. The Allowed Path property defines the route in which this template is to be used to create pages. Add the following price : /content(/.*)? 

    five. click on Next on the Allowed Parent display screen.

    6. click OK on the Allowed youngsters display.

    7. click Save All.

    Note: Test the template created.

    Create a Page Rendering Component:

  • Right click the /apps/education/components folder and click Create -> Create Component.
  • Enter following information.

    Note: The Label name should be identical because the useful resource kind that we have supply on the time of making Template.NameValueLabelmyComponentTitleMy Custom ComponentDescriptionThis is Simply Cracked Content Page Component
  • Click Next till you reach till last display. Click OK  and click Save All modifications.
  • Notice that the myComponent issue is created with a default  jsp with the equal call as thing call myComponent .jsp
  • Double click on myComponent .jsp and replace the jsp code with under code.

    <%@include file="/libs/basis/worldwide.jsp" %>

    <cq:encompass script="/libs/wcm/center/components/init/init.jsp"/>

    <head><identify>Welcome to Simply Cracked </identify></head>


    <h1>Welcome to Simply Cracked</h1>

    <h2>I am your rendering script!!</h2>

    <cq:encompass path="par" resourceType="foundation/additives/parsys" />



  • You have correctly created a web page-rendering aspect.

    Note:- international.jsp is used to include default scripts and libraries whereas init.jsp is used to display sidekick in authoring.
  • Create Pages in AEM :

    A page is a place in which creator create and edit content, so that you can be considered by way of web page visitors in put up mode.

    In this phase we are going to create a basic shape of website and pages in aem.

  • Log in to AEM SiteAdmin.
  • Click Websites inside the left panel.
  • Create a folder Click -> New -> New Folder -> Enter name as Simply Cracked.

  • Click New -> New Page.

  • Enter the identify of the page as Home page( This can be our jcr:title ) .

  • Enter Name as homepage

    Tip: Always provide name in lower case as this could be part of url.
  • Select Content Page Templateas Template and click Create.
  • As soon as we create a web page siteadmin will push our new page to content material folder in crxde.
  • Double click on Home Page to open it. By default it will open in Touch UI. Move to classic UI by way of changing editor.html with cf# in url.
  • The page will appear like a underneath.
  • You have successfully rendered the thing on Template.

    Related Posts

    Leave a Reply

    Your email address will not be published. Required fields are marked *