Titlev3

Title can be used to create headings for a page or page sections.

Examples

Standard

Default title without any configuration. The title is then taken from the current page, taking the Page Title if it has been set, and taking the main page Title otherwise. The default heading level is H1, which can be configured at page template level.

Title

    
    

    
  1. 
        sling:resourceType:
        core-components-examples/components/title
    
    2. 



    
        

    



    
Title




    




    

    


    JSON

Title Text

The title text can be provided rather than the default of taking the title from the current page.

Lorem Ipsum

    
    

    
  1. 
        jcr:title:
        Lorem Ipsum
    
    2. 

    
  2. 
        sling:resourceType:
        core-components-examples/components/title
    
    3. 



    
        

    



    
Lorem Ipsum




    




    

    


    JSON

Heading Type

The heading size can be configured (H1-H6).

Heading 3

    
    

    
  1. 
        jcr:title:
        Heading 3
    
    2. 

    
  2. 
        type:
        h3
    
    3. 

    
  3. 
        sling:resourceType:
        core-components-examples/components/title
    
    4. 



    
        

    



    
Heading 3




    




    

    


    JSON

Linked

Titles can be linked to internal relative AEM resources, external absolute URLs or page anchors.

    
    

    
  1. 
        linkURL:
        /content/core-components-examples/library/core-content/title
    
    2. 

    
  2. 
        linkTarget:
        _blank
    
    3. 

    
  3. 
        sling:resourceType:
        core-components-examples/components/title
    
    4. 



    
        

    



    




    

    


    JSON

Link Label and Title

When linked, there's the additional possibility to provide a Title Attribute and/or a Accessibility Label to the link.

    
    

    
  1. 
        linkTitleAttribute:
        This is the title attribute
    
    2. 

    
  2. 
        linkURL:
        /content/core-components-examples/library/core-content/title
    
    3. 

    
  3. 
        linkAccessibilityLabel:
        This is the accessibility label
    
    4. 

    
  4. 
        sling:resourceType:
        core-components-examples/components/title
    
    5. 



    
        

    



    




    

    


    JSON

Built with Core Components 2.27.0.