INSTALLATION / CDN

Installation via CDN

Use this guide when you want to load P2LRN directly from HTML using published browser files. Player and Studio have separate entry points.

1. Load the Player

Add the loader only once on the page. Then you can use the element <p2lrn-player> as many times as you need.

HTML
<script src="https://p2lrn.org/player/current/dist/p2lrn.js"></script>

<p2lrn-player src="./course.p2lrn"></p2lrn-player>

The channel current points to the version published for regular use.

2. Set a Player version

When you need a reproducible integration, replace the channel current for a specific version to keep the file that loads your application stable.

HTML
<script src="https://p2lrn.org/player/0.5.0-alpha.11/dist/p2lrn.js"></script>

A versioned URL maintains the same version of the file as long as that publication is available.

3. Load Studio

Studio has its own web loader. The specific guide explains the assembly, opening courses and connecting with saving and import services.

4. What happens when uploading the file

The loader registers the component <p2lrn-player> in the browser. From that moment on you can use it in the HTML and assign a package to it using src. You do not need to copy the Player files to your project if you are going to use the published resource.

5. Open the page from a local server

Open the project folder in your regular text or code editor and serve it over HTTP. The browser needs a real web origin to correctly resolve the package and its resources; open index.html directamente mediante file:// It does not represent the normal operation of a web application.

  1. Locate index.html and the files used by the page.
  2. Start the preview or the local HTTP server that you normally use in your editor or development environment.
  3. Open the local address provided by that server in the browser.

You don't need an editor, an extension, or a specific tool for this step.

6. Load a course

The attribute src It can point to a file on the same site or to a URL allowed by the server hosting the content. If the course is on another source, configure CORS to allow it to be read.

7. Check the integration

Open the page from the web server, confirm that the Player appears, and check the browser console if the package does not load. The most common failures are an incorrect URL, a server that does not deliver the file, or a CORS policy that prevents reading it.

To learn about attributes, events, and integration with your platform, continue with Player.

Analytics via CDN

To add the tracking dashboard without installing dependencies, load the Analytics bundle and connect an authorized Host endpoint.

HTML
<script src="https://p2lrn.org/analytics/current/dist/p2lrn-analytics.js"></script>
<p2lrn-analytics src="/api/p2lrn/analytics/snapshot"></p2lrn-analytics>

Query P2LRN Analytics for data contract, authoritative notes and API.