Mastering Liferay Design Elements

Course Overview

Managing Clarity's Distributor Assets

Asset libraries centralize design assets, enabling reusability across Liferay sites. This accelerates development and facilitates brand consistency. During their initial site implementation, Clarity created several asset libraries for their general public pages. Now Clarity needs a dedicated library for storing distributor-specific assets that they'll use in restricted pages and distributor-targeted content.

In this article, you'll create and configure this library for Clarity's distributors.

Exercise: Creating an Asset Library for Distributor Assets

Here, you'll create an asset library to centralize Clarity's distributor-specific assets.

  1. In your running Liferay instance, sign in as the Clarity Admin user.

    • Username: admin@clarityvisionsolutions.com
    • Password: learn
  2. Open the Global Menu (Global Menu), go to the Applications tab, and click Asset Libraries.

  3. Click New to create an asset library.

  4. Enter Distributors for name.

    Create the Distributors asset library.

  5. Click Save.
    This creates the library and redirects you to its settings page.

  6. Enter this text for description:

    This asset library contains marketing assets for distributors.
    
  7. Click Save.

Great! Now that you've created the library, you can start adding assets to it.

Exercise: Adding Assets to the Asset Library

Here, you'll add distributor assets to the new library.

  1. Go to the Asset Libraries application in the Global Menu (Global Menu).

  2. Click Distributors to access its applications and begin adding content.

  3. Click Documents and Media.

  4. Click New and select Folder.

  5. Enter Banners for name and click Save.

  6. Navigate into the Banners folder.

  7. Click New and select Multiple Files Upload.

  8. Click Select Files, navigate to the exercises/module-2/banners/ folder in your course workspace, and select all files.

  9. Click Publish.

    Upload the banner images.

  10. Return to the Documents and Media root folder.

  11. Repeat steps 4-9 to create a Product Photos folder and upload the exercises/module-2/product-photos/ images.

Great! You've populated the Distributors asset library. Next, you'll configure the library's permissions and connect it to Clarity's site.

Exercise: Configuring the Distributors Asset Library

Here, you'll configure access to Clarity's new asset library and connect it to their marketing website.

  1. In the Distributors asset library menu, click Memberships under the People section.

  2. Go to the User Groups tab.

  3. Click New, select the Distributors user group, and click Done.

    Select the Distributors user group.

    This assigns all users in the Distributors user group as members of the asset library.

  4. Return to the Distributors menu and click Asset Library Settings under Configuration.

  5. Go to Sites in the left panel.

  6. Click Add and select Clarity Public Enterprise Website.

    Select Clarity Public Enterprise Website.

Great! You've configured the asset library's permissions and connected it to Clarity's website. With the appropriate permissions, site members can access and manage the library's content. Next, you'll use the assets in Clarity's Tickets page.

Exercise: Adding Assets to the Tickets Page

Here, you'll use the Distributors asset library to add a banner image to the Tickets page.

  1. Open the Global Menu (Global Menu) and go to Clarity Public Enterprise Website.

  2. Navigate to the Tickets page and start editing it.
    This page is only visible to distributor and administrator users.

  3. Select the Clarity Distributor Banner container.

  4. In the right configuration panel, go to the Styles tab.

  5. Under Background, click Select Image (Select Image) for the Background Image field.

    Under Background, click Select Image for the Background Image field.

  6. Click Sites and Libraries in the breadcrumb menu.

    Click Sites and Libraries in the breadcrumb menu.

  7. Go to the Asset Library tab.
    This displays all asset libraries connected to this site.

  8. Select the Distributors library.

    Select the Distributors library.

  9. Go to the Banners folder and select the distributor-banner-left image.
    This sets the image as the banner's background.

  10. Click Publish.

    Publish the page to see the final result.

With this, Clarity can leverage the Distributors asset library to consistently populate their distributor-specific pages.

Conclusion

Great! Asset libraries enable content creators to reuse design media across multiple Liferay pages and sites. This is crucial for delivering a cohesive and unified experience within Clarity's future distributor solutions.

Next, you'll continue exploring asset libraries and learn the fundamentals of design asset management.

  • Exercise: Creating an Asset Library for Distributor Assets

  • Exercise: Adding Assets to the Asset Library

  • Exercise: Configuring the Distributors Asset Library

  • Exercise: Adding Assets to the Tickets Page

  • Conclusion

Loading Knowledge

Capabilities

Product

Education

Contact Us

Connect

Powered by Liferay
© 2024 Liferay Inc. All Rights Reserved • Privacy Policy