IMMERSE 2016 Introducing content fragments

© 2016 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.© 2016 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

A virtual developer conference for Adobe Experience Manager

Introducing Content FragmentsStefan Grimm | Senior Developer

© 2016 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.© 2016 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 3

Theory


Building blocks

© 2016 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. 5

Overview, part 1


Semantic content structure Defined by template Multiple formats supported Rich text Plain text Markdown (limited)

Elements


Variants of element content Global – shared by all elements For example: Channel-specific Defined by author Multiple formats Same as supported for elements

Variations


Example


Overview, part 2


Tags for classification Standard asset metadata Uses metadata schemas

Metadata


Associate media with a fragment Work as suggestion for the author of the final page No concept of semantic association (no “title image”, etc.)

Based on DAM collections

Associated content


Structure of a Content Fragment Elements Predefined Variations (optional) Initial associated content (optional)

Copied to the fragment Template changes not reflected in fragment after creation

Use Granite’s ConfMgr feature

Fragment Templates


Renders a Content Fragment on an AEM page Options for rendering Element to display Variation to use Paragraph ranges

Component


DAM integration


A Content Fragment is an Asset (hierarchy)


Elements are assets/sub-assets Content is stored in the original rendition

Variations are renditions Variations are tied to elements

Metadata stored on main asset Additional structural data (“fragment model”) MIME type specified on rendition

A Content Fragment is an Asset (hierarchy)


“Use the API, young padawan!”

com.adobe.cq.dam.cfm


A real world example


Introducing:The Adobe Times

(An imaginary news site)


Our goal …


Out of the box …


Simple fragment template Single element

Generic component for page authoring provides “in-between” content feature

AEM 6.2


Hands on …Using Content Fragments

23


Too much work, huh?


Create article. Enter title. Teaser. Text. Classify. Save. Create page. (*) Add Content Fragment. (*) Reference article. (*) Publish. (*)

(*) We’ll get rid of these steps in the “Efficient Publishing with Content Fragments” session later today

Efficiency!


Articles


Articles

Section

Title

Teaser

Text


Fragment Elements Title Teaser Text

Metadata Section

Articles


A real world implementation


Create an article template Create an article component Create a page component

TODOs ...


No production-ready codein this session!

Disclaimer

31


Article template


Hands on …Article template

/apps/settings/dam/cfm/templates/article

33


Article component


Access the elements Title, Teaser, Text

Access metadata Section

Bring everything together Rendering

We need to …


Creating a fragment:Resource fragmentResource = resolver.getResource(“/path/to/fragment”);ContentFragment fragment = fragmentResource.adaptTo(ContentFragment.class);

Accessing elements:Iterator<ContentElement> elements = fragment.getElements();while (elements.hasNext()) {

ContentElement element = elements.next();// …

}

API – Basic patterns, part 1


Accessing variation:Iterator<ContentVariation> variations = element.getVariations();while (variations.hasNext()) {

ContentVariations variation = variations.next();// …

}

Accessing elements/variations by name:ContentElement titleElement = fragment.getElement(“title”);ContentVariation twitterVariation = titleElement.getVariation(“twitter”);



Accessing content:String content = element.getContent();String contentType = element.getContentType();

Changing content:element.setContent(“Content”, “text/plain”);

… works similar for variations!



Map<String, Object> getMetaData();void setMetaData(String name, Object value) throws ContentFragmentException;

Just a wrapper for DAM metadata methods! - Same rules & restrictions apply.

API – Accessing metadata


Currently no API to get HTML for plain text or Markdown Need to use a internal include

(Missing) API – Getting HTML


Hands on …Article component

/apps/cfm-efficient-publishing/components/article

41


Page component


“Just a simple page template” Header (”The Adobe Times”) hardcoded Single paragraph system holding the article

/apps/cfm-efficient-publishing/components/page No design No ”fancy stuff” like responsiveness, etc. Remember? - No production-ready code in this session!

JASPT


And … Action!The new article creation process

44


Recap

Workflow designed for efficiency Template defining three elements Title Teaser Text

Article component Fixed layout Tags for classification Image taken from collection

Page component Basic page layout


Epilogue


Decide if creating a customized component makes sense Sufficiency of the OOTB component Flexibility vs. efficiency

Use OOTB component as a starting point Use tagging and metadata to classify your content Use API, don’t access the content structure directly Adobe might need to change it

Recommendations


Security: Publish considerations

Provide read-access to everyone wherever required Ensure that everything required is available on publish Common mishap: Application Content Package not replicated to publish

Collection can not/should not be accessed on publish References need to be resolved before publishing – manually (OOTB component) or ”on save” (*)

(*) Details will be revealed in the “Efficient Publishing with Content Fragments” session later today


Not mentioned in this session …

Variations/channel-specific publishing would rectify a separate session may be a focus for 6.3

Translation services neatly integrated

Metadata schemas


Resources

Content Package with example code available from the “Resources” pod in Adobe Connect

Documentation Overview/Authoring Editor - https://docs.adobe.com/docs/en/aem/6-2/author/assets/content-fragments.html Page Authoring - https://docs.adobe.com/docs/en/aem/6-2/author/page-authoring/content-

fragments.html Development Templates - https://docs.adobe.com/docs/en/aem/6-2/develop/templates/content-fragment-

templates.html Extending (WIP) - https://docs.adobe.com/docs/en/aem/6-2/develop/extending/content-fragments.html


Q&A51

Stefan [email protected]

IMMERSE 2016 Introducing content fragments

Technology

Transcript of IMMERSE 2016 Introducing content fragments