Link copied!

Iframe Page

When your application lives in an iframe inside the Emarsys Platform, you have to build the whole layout inside your iframe. You'll need to declare the full header, and include our CSS and JavaScript libraries:

<!DOCTYPE html>
<html>
<head>
  <meta charset='utf-8' />
  <title></title>
  <link rel='stylesheet' href='https://client-version.cf.emarsys.net/ui/latest/css/app.css'>
  <script src='https://client-version.cf.emarsys.net/ui/latest/js/app.js'></script>
</head>
<body>
<!-- Layout Goes Here -->
</body>
</html>

For the layout itself, since there is no main navigation in your application, you have to use a special modifier on the element with the e-layout class called e-layout-without_navigation.

<div class="e-layout e-layout-without_navigation">
  <header class="e-layout__header">
    <h1 class="e-layout__title">Sample Application</h1>
  </header>

  <main class="e-layout__content">
    <section class="e-layout__section">
      <!-- Section content -->
    </section>
  </main>
</div>

The outer frame is already taken care in the Suite like this:

<div class="e-layout">
  <iframe src="https://ui.static.emarsys.net" class="e-layout__iframe"></iframe>
</div>