← Back to Documentation

Embedding player - Basic HTML

Minimal Example

Below is a minimal HTML5 page structure required to embed the player. Ensure that icplayer.nocache.js points to the correct location of your built player. 

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>icPlayer Embed Test</title>

    <!-- 1. Load jQuery (Required) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

    <!-- 2. Load icPlayer -->
    <script type="text/javascript" src="icplayer/icplayer.nocache.js"></script>

    <!-- 3. Initialize Player -->
    <script>
        var player;
        function icOnAppLoaded() {
            // Create player instance attached to the div with id '_icplayer'
            player = icCreatePlayer('_icplayer');
            
            // Load content (XML file)
            player.load('content/default.ic.xml');
        }
    </script>

    <!-- 4. MathJax Configuration (Optional, for Math support) -->
    <script type="text/javascript" 
        src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
    </script>
  </head>

  <body>
    <!-- Player Container -->
    <div id="_icplayer"></div>
  </body>
</html>

Key Requirements

  • jQuery 1.7+ is required for the player to function.
  • The icOnAppLoaded function is automatically called when the player core is ready.
  • The _icplayer div must exist in the body before creating the player instance.