Content Fragmentv1

Content Fragment allows a content fragment asset, its elements and variations to be presented on a page.

Using Core Components

Adobe Help Center

Examples

Simple Content Fragment

Content fragment component with an associated content fragment asset. The asset uses the Simple Fragment template and displays some dummy article content, including a header and paragraph. It has one Main element.

Main

Lorem Ipsum

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eu mi bibendum neque egestas congue quisque egestas. Varius morbi enim nunc faucibus a pellentesque. Scelerisque eleifend donec pretium vulputate sapien nec sagittis.

  1. jcr:primaryType: nt:unstructured
  2. jcr:createdBy: admin
  3. paragraphScope: all
  4. jcr:lastModifiedBy: admin
  5. jcr:created:
  6. text: Main Lorem Ipsum Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eu mi bibendum neque egestas congue quisque egestas. Varius morbi enim nunc faucibus a pellentesque. Scelerisque eleifend donec pretium vulputate sapien nec sagittis.
  7. variationName: master
  8. jcr:lastModified:
  9. sling:resourceType: core/wcm/extension/components/contentfragment/v1/contentfragment
  10. displayMode: multi
  11. fragmentPath: /content/dam/core-components-examples/library/sample-assets/simple-fragment
    
        

    

    
    
        
    
Main

Lorem Ipsum

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Eu mi bibendum neque egestas congue quisque egestas. Varius morbi enim nunc faucibus a pellentesque. Scelerisque eleifend donec pretium vulputate sapien nec sagittis.

Variations

It is possible to output alternative variations on the page. Here we use the same simple content fragment asset, but instead display its Short variation. Short variations are more suited to mobile apps, for example.

Main

Lorem Ipsum

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

  1. jcr:primaryType: nt:unstructured
  2. jcr:createdBy: admin
  3. paragraphScope: all
  4. jcr:lastModifiedBy: admin
  5. jcr:created:
  6. text: Main Lorem Ipsum Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  7. variationName: short
  8. jcr:lastModified:
  9. sling:resourceType: core/wcm/extension/components/contentfragment/v1/contentfragment
  10. displayMode: multi
  11. fragmentPath: /content/dam/core-components-examples/library/sample-assets/simple-fragment
    
        

    

    
    
        
    
Main

Lorem Ipsum

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Structured Content Fragment

In this example, the asset is based on a bespoke Core Component Model template which allows the output of structured data associated with a Core Component. The asset contains data for the image component.

  1. jcr:primaryType: nt:unstructured
  2. jcr:createdBy: admin
  3. paragraphScope: all
  4. jcr:lastModifiedBy: admin
  5. jcr:created:
  6. text: Title Image Description Image allows a single image asset to be displayed on the page. Images are adaptive; the relevant image width is selected for the screen size and lazy loading is available. Latest Version 2.0 Type core-components-examples:component-type/atom
  7. variationName: master
  8. jcr:lastModified:
  9. sling:resourceType: core/wcm/extension/components/contentfragment/v1/contentfragment
  10. displayMode: multi
  11. fragmentPath: /content/dam/core-components-examples/library/sample-assets/structured-fragment
    
        

    

    
    
        
    

    


    


    

    

Elements

For structured content fragments, it is possible to limit the output to certain elements in the data. In this example we again show the component data for the image component, but only its title and type.

  1. jcr:primaryType: nt:unstructured
  2. jcr:createdBy: admin
  3. paragraphScope: all
  4. jcr:lastModifiedBy: admin
  5. elementNames: component-title,component-type
  6. jcr:created:
  7. text: Title Image Type core-components-examples:component-type/atom
  8. variationName: master
  9. jcr:lastModified:
  10. sling:resourceType: core/wcm/extension/components/contentfragment/v1/contentfragment
  11. displayMode: multi
  12. fragmentPath: /content/dam/core-components-examples/library/sample-assets/structured-fragment