Adobe Edge Animation doesn't show on whmcs

Question

I have an edge animation. I am using whmcs header template.

<!--Adobe Edge Runtime-->
      <meta http-equiv="X-UA-Compatible" content="IE=Edge">
      <script type="text/javascript" charset="utf-8" src="templates/{$template}/edge.5.0.1.min.js"></script>

      <style>
          .edgeLoad-navalti { visibility:hidden; }
      </style>
      <script>
          AdobeEdge.loadComposition("Untitled-1", "navalti",{
              scaleToFit: "none",
              centerStage: "vertical",
              minW: "1024px",
              maxW: "undefined",
              width: "1920px",
              height: "250px"
          }, {"dom":{}}, {"dom":{}});
      </script>
<!--Adobe Edge Runtime End-->

And editing animation area <div>:

<div id="Stage" class="navalti">                 
    <div id="Stage_Rectangle" class="edgeLoad-navalti"></div>
</div>

But when opening the site in Chrome, I get this error:

Answer 1

You can not use { or } in whmcs templates. Try

          <meta http-equiv="X-UA-Compatible" content="IE=Edge">
      <script type="text/javascript" charset="utf-8" src="templates/{$template}/edge.5.0.1.min.js"></script>
{literal} 
      <style>
          .edgeLoad-navalti { visibility:hidden; }
      </style>
      <script>
          AdobeEdge.loadComposition("Untitled-1", "navalti",{
              scaleToFit: "none",
              centerStage: "vertical",
              minW: "1024px",
              maxW: "undefined",
              width: "1920px",
              height: "250px"
          }, {"dom":{}}, {"dom":{}});
      </script>
{/literal}
<!--Adobe Edge Runtime End-->