examples/inline-content-mod/inline-content-mod.html

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Personalization Example</title>
  <script type="text/javascript" src="http://c.lytics.io/static/pathfora.min.js"></script>
  <link rel="stylesheet" href="assets/styles.css">
</head>
<body>
  <!-- Relevant code example begins here-->

    <!-- High Momentum block-->
    <div class="feature-block" data-pfgroup="right_hero_feature" data-pftrigger="high_momentum">
      <div class="block-head">
        Get new coupons <span>every month</span>
      </div>
      <div class="block-inner">
        <img class="feature-image" src="assets/money.png" alt="Save Money">
        <p>Want to get monthly coupons for up to 30% off your order every month? Sign up below to subscribe to our coupon mailing list.</p>
        <a class="btn" href="signup.html">Sign Up</a>
      </div>
    </div>

    <!--First Time Visitors block-->
    <div class="feature-block" data-pfgroup="right_hero_feature" data-pftrigger="first_time_visitor">
      <div class="block-head">
        Thanks <span>for visiting</span>
      </div>
      <div class="block-inner">
        <img class="feature-image" src="assets/iphone.png" alt="iPhone">
        <p>Check out our new products. We provide the highest quality in everything from the newest smart phones to your favorite brand of shoes.</p>
        <a class="btn" href="shop.html">Shop Now</a>
      </div>
    </div>

    <!--Cart Abandoners block-->
    <div class="feature-block" data-pfgroup="right_hero_feature" data-pftrigger="cart_abandoners">
      <div class="block-head">
        Get your order with <span>free shipping</span>
      </div>
      <div class="block-inner">
        <img class="feature-image" src="assets/basket.png" alt="Shopping Basket">
        <p>Looks like you were interested in purchasing a product on our site recently. We'd like to offer you free shipping on your current order. You're welcome!</p>
        <a class="btn" href="checkout.html">Apply Discount</a>
      </div>
    </div>

    <!--Default block-->
    <div data-pfgroup="right_hero_feature" data-pftrigger="default">
      <!-- Default content here-->
    </div>
  
  <!-- End of code example -->

  <script type="text/javascript">
    // Mock the Lytics JStag. You won't need this code, instead just
    // load the actual Lytics JStag for your account:
    // https://activate.getlytics.com/connect
    window.lio = {
      data: {
        // mock the user segment membership
        segments: ["first_time_visitor"] // change this to view the other content pieces
      },
      loaded: true,
      account: {
        id: "notreal"
      }
    };
  </script>
</body>
</html>