Submit Feedback
Legacy Knowledge Base
Published Jun. 30, 2025

Including External JavaScript Libraries in Fragments from Documents and Media

Written By

Madhusudan Sharma

How To articles are not official guidelines or officially supported documentation. They are community-contributed content and may not always reflect the latest updates to Liferay DXP. We welcome your feedback to improve How To articles!

While we make every effort to ensure this Knowledge Base is accurate, it may not always reflect the most recent updates or official guidelines.We appreciate your understanding and encourage you to reach out with any feedback or concerns.

Legacy Article

You are viewing an article from our legacy "FastTrack" publication program, made available for informational purposes. Articles in this program were published without a requirement for independent editing or verification and are provided"as is" without guarantee.

Before using any information from this article, independently verify its suitability for your situation and project.

Issue

  • Need to use external JavaScript libraries that are uploaded to Documents and Media in fragments.

Environment

  • Liferay DXP 7.4

Resolution

To include external JavaScript libraries stored in Documents and Media within a fragment:

  1. Upload your JavaScript (.js) and CSS (.css) files to Documents and Media.
  2. In your fragment's HTML or Javascript, add <script> and <link> tags to reference the files, using the full URL to the latest version as the src or href attribute.
    • To obtain the correct URL of the files:
      1. Go to Site Menu > Content & Data > Documents and Media.
      2. Click the file's name to open the preview.
      3. In the file preview, click the Info button (i icon).
      4. Copy the URL displayed next to "Latest Version URL".

Additional Information

For more robust JavaScript library management, particularly in production environments, consider using JavaScript import maps. This approach offers better organization, version control, and caching capabilities. Refer to these resources for more information:

Did this article resolve your issue ?
Legacy Knowledge Base
Did this article resolve your issue ?