Creating Clarity’s Web Content

As we mentioned in the module introduction, Content Management is a broad term that can apply to a range of feature sets in the data lifecycle. We’re going to focus specifically on the bread-and-butter Liferay features used to create content for web pages.

Web Content

Liferay’s web content interface is a core part of the platform’s functionality. Using structures and templates, you can build and display articles of web content through content pages, display pages, widgets, or fragments, which you learned about in the previous module. Web content articles are dynamic, versatile assets, in large part because they are made up of web content structures.

Structures

Web content structures are the building blocks of Liferay content. They determine what kinds of information you need to provide for a given web content article. Structures allow you to enforce a format for your content using a straightforward drag-and-drop interface with several types of fields. A single structure can be reused in multiple places, reducing effort for writers, editors, and designers alike. Liferay includes a Basic Web Content structure out of the box, but you can tailor your own structures to your specific needs.

Templates

Web content templates provide an extra layer of configuration and customization to web content. Templates use the FreeMarker Template Language (FTL) to determine how content is rendered on a page. A template can be linked to a web content structure or even embedded in other templates.

Exercise One: Creating Web Content Structures

In this exercise, you’ll build several structures for specific types of web content that Clarity wants to publish. Later in the module, you’ll learn how to display these articles on Clarity’s FAQ page.

First, let’s create the web content structure for Announcements.

1. Navigate to Site Menu → Content & Data → Web Content.

2. Go to the Structures tab and click the New button to enter the structure builder.

3. Edit the title of the structure to “Announcements”.

4. From the Builder sidebar, drag and drop a Text field into the structure.

5. With the Text field selected, the sidebar displays configuration options for the field. In the Basic tab, update the Label to “Message”. Make sure Field Type is “Single Line” and Required Field is toggled on.

6. Navigate to the Advanced Tab and update Field Reference to “message”. With the configuration for the Message field complete, click the back arrow to return to the Builder sidebar menu.

7. Drag and drop another Text field just below the first one, following the visual indicators in the structure building interface. Update the Label to “Link Text” and the Field Reference to “linkText”. Click the back arrow to return to the Builder menu.

8. Drag and drop a Link to Page field on top of the Link Text field, following the visual indicators in the interface. This action should create a Fields Group that contains Link Text and Link to Page.

9. Update the Field Reference of Link to Page to “linkPage”. Click Save to publish the Announcements web content structure.

10. Repeat steps 2-9 to create the following web content structures with their respective fields:

Job Listing: | Field Type | Field Name | | :— | :— | | Rich Text | Role Overview | | Rich Text | Key Responsibilities | | Rich Text | Qualifications and Skills |

Leadership Profile: | Field Type | Field Name | | :— | :— | | Image | Image | | Text | Name | | Text | Title | | Rich Text | Bio |

Article: | Field Type | Field Name | | :— | :— | | Image | Image | | Rich Text | Headline | | Rich Text | Content |

FAQ: | Field Type | Field Name | | :— | :— | | Rich Text | Answer |

You now have five web content structures implemented in Clarity’s website.

Exercise Two: Creating Web Content Articles

1. Navigate to the Web Content tab. Navigate into the FAQs folder. Select New → FAQ to enter the New Web Content editor.

2. Update the title of the FAQ to “What is your return policy?”. Select the Answer field and add the following text: “We offer a 30-day return policy from the date of delivery. Items must be unused and in the same condition that you received them, including all original packaging.”

3. Click Publish to create the new FAQ web content article in the FAQs folder.

4. Repeat Steps 7-9 to add more FAQs with the following question/answer pairs. Note that the title of an FAQ web content article is the question itself.

   • “Can I become a retail partner?” / “Yes, we are always looking to expand our network of retail partners. If you are interested in stocking our eyewear, please contact our sales team for more information.”

   • “What payment methods do you accept?” / “We accept various payment methods including credit cards (Visa, Mastercard, American Express), PayPal, and bank transfers.”

   • “Do you offer eye exams?” / “Yes, we do. We have qualified optometrists who can conduct comprehensive eye exams to determine your prescription and check for any eye health issues.”

   • “Do I have to pay for return shipping?” / “Return shipping costs are the responsibility of the customer unless the item is defective or an error was made on our end.”

   • “How can I place an order?” / “You can place an order through our website. Simply choose the glasses you like, select your prescription and lens type, add the item to your cart, and proceed to checkout.”

   • “What types of eyewear do you offer?” / “We offer a wide range of eyewear including prescription glasses, sunglasses, and contact lenses. We also have a collection of designer frames to suit different styles and preferences.”

   • “Do you have retail partners where I can try on your eyewear?” / “Yes, we have partnered with various optical shops where you can try on our eyewear. Please visit our website to find the nearest location.”

You now have eight FAQ web content articles created from the FAQ web content structure.

Conclusion

This concludes Creating Clarity’s Web Content. Now let’s take a look at some of Liferay’s commerce-specific content features.

Next Up: Creating Clarity’s Commerce Content