HTML ad tag preview - Powered by Ad Reform

Live Preview

Tag didn’t load? Click here and let us know!
300x250
10.2 KB
Share this result

Previews are deleted daily. Get a permanent share link sent to your inbox:
Script

Open in browser
<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="generator" content="Google Web Designer 15.3.0.0828">
  <meta name="template" content="Banner 3.0.0">
  <meta name="environment" content="gwd-googleads">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link href="gwdpage_style.css" rel="stylesheet" data-version="13" data-exports-type="gwd-page">
  <link href="gwdpagedeck_style.css" rel="stylesheet" data-version="14" data-exports-type="gwd-pagedeck">
  <link href="gwdgooglead_style.css" rel="stylesheet" data-version="9" data-exports-type="gwd-google-ad">
  <style id="gwd-lightbox-style">
    .gwd-lightbox {
      overflow: hidden;
    }
  </style>
  <style id="gwd-text-style">
    p {
      margin: 0px;
    }
    h1 {
      margin: 0px;
    }
    h2 {
      margin: 0px;
    }
    h3 {
      margin: 0px;
    }
  </style>
  <style>
    html, body {
      width: 100%;
      height: 100%;
      margin: 0px;
    }
    .gwd-page-container {
      position: relative;
      width: 100%;
      height: 100%;
    }
    .gwd-page-content {
      background-color: transparent;
      transform: perspective(1400px) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
      position: absolute;
      transform-style: preserve-3d;
    }
    .gwd-page-content * {
      transform-style: preserve-3d;
    }
    .gwd-page-wrapper {
      background-color: rgb(255, 255, 255);
      position: absolute;
      transform: translateZ(0px);
    }
    .gwd-page-size {
      width: 300px;
      height: 250px;
    }
    .content_container {
      display: flex;
      height: inherit;
      flex-direction: column;
      align-items: center;
      justify-content: center;
    }
    .text_container {
      width: 80%;
      border: 2px solid rgb(1, 98, 139);
      background-color: rgb(255, 255, 255);
      color: rgb(1, 98, 139);
      border-radius: 5px;
      padding: 10px 5px;
      margin: 5px 0px;
      font-size: 15px;
      text-align: center;
    }
    .text_container_anim_first_text {
      animation: 1s ease 0s 1 normal forwards running text_container_anim_first_text_gwd-keyframes;
    }
    .text_container_anim_second_text {
      animation: 1s ease 1s 1 normal forwards running text_container_anim_second_text_gwd-keyframes;
    }
    .text_container_anim_third_text {
      animation: 1s ease 2s 1 normal forwards running text_container_anim_third_text_gwd-keyframes, 1s ease 3s 10 normal forwards running anim_scale;
    }
    .bold {
      font-weight: 500;
    }
    .button_container {
      opacity: 0;
      animation: 2s ease 2s 1 normal forwards running anim_button;
    }
    .button {
      margin: 5px 0px;
      padding: 10px 24px;
      font-size: 14px;
      box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 10px;
      font-weight: bold;
      border-radius: 4px;
      background-color: rgb(255, 255, 255);
      border: 2px solid rgb(1, 98, 139);
      color: rgb(1, 98, 139);
      cursor: pointer;
    }
    .disclaimer {
      animation: 3s ease 3.5s 1 normal forwards running anim_disclaimer;
      opacity: 0;
      position: absolute;
      bottom: 0px;
      width: 100%;
      text-align: center;
      font-size: 11px;
      color: rgb(146, 146, 146);
      padding-bottom: 2px;
    }
    .text_font {
      font-family: Roboto;
    }
    @keyframes text_container_anim_first_text_gwd-keyframes {
      0% {
        border-width: 2px;
        border-color: rgb(1, 98, 139);
        background-color: rgb(255, 255, 255);
        color: rgb(1, 98, 139);
      }
      100% {
        background-color: rgb(1, 98, 139);
        color: rgb(255, 255, 255);
      }
    }
    @keyframes text_container_anim_second_text_gwd-keyframes {
      0% {
        border-width: 2px;
        border-color: rgb(1, 98, 139);
        background-color: rgb(255, 255, 255);
        color: rgb(1, 98, 139);
      }
      100% {
        background-color: rgb(1, 98, 139);
        color: rgb(255, 255, 255);
      }
    }
    @keyframes text_container_anim_third_text_gwd-keyframes {
      0% {
        border-width: 2px;
        border-color: rgb(1, 98, 139);
        background-color: rgb(255, 255, 255);
        color: rgb(1, 98, 139);
      }
      100% {
        background-color: rgb(1, 98, 139);
        color: rgb(255, 255, 255);
      }
    }
    @keyframes anim_scale {
      0% {
        transform: scale(1);
      }
      50% {
        transform: scale(1.1);
      }
      100% {
        transform: scale(1);
      }
    }
    @keyframes anim_disclaimer {
      0% {
        opacity: 0;
      }
      100% {
        opacity: 1;
      }
    }
    @keyframes anim_button {
      0% {
        opacity: 0;
        transform: translateY(250px);
      }
      100% {
        opacity: 1;
        transform: translateY(0px);
      }
    }
  </style>
  <link href="https://fonts.googleapis.com/css?family=Roboto:100,100italic,300,300italic,regular,italic,500,500italic,700,700italic,900,900italic" rel="stylesheet" type="text/css">
  <script data-source="gwd_webcomponents_v1_min.js" data-version="2" data-exports-type="gwd_webcomponents_v1" src="gwd_webcomponents_v1_min.js"></script>
  <script data-source="gwdpage_min.js" data-version="13" data-exports-type="gwd-page" src="gwdpage_min.js"></script>
  <script data-source="gwdpagedeck_min.js" data-version="14" data-exports-type="gwd-pagedeck" src="gwdpagedeck_min.js"></script>
  <script data-source="https://s0.2mdn.net/ads/studio/Enabler.js" data-exports-type="gwd-google-ad" src="https://s0.2mdn.net/ads/studio/Enabler.js"></script>
  <script data-source="gwdgooglead_min.js" data-version="9" data-exports-type="gwd-google-ad" src="gwdgooglead_min.js"></script>
</head>

<body>
  <gwd-google-ad id="gwd-ad" polite-load="">
    <gwd-metric-configuration></gwd-metric-configuration>
    <gwd-pagedeck class="gwd-page-container" id="pagedeck">
      <gwd-page id="page1" class="gwd-page-wrapper gwd-page-size gwd-lightbox" data-gwd-width="300px" data-gwd-height="250px">
        <div class="gwd-page-content gwd-page-size">
          <div class="content_container" onclick="window.open(window.clickTag)">
            <div class="text_container text_container_anim_first_text">
              <p class="text_font">CARTÕES DE CRÉDITO</p>
            </div>
            <div class="text_container text_container_anim_second_text">
              <p class="text_font">SEM ANUIDADE</p>
            </div>
            <div class="text_container text_container_anim_third_text">
              <p class="text_font bold">LIMITES A PARTIR DE R$ 5.000,00</p>
            </div>
            <div class="button_container">
              <p class="button text_font bold">VER AGORA</p>
            </div>
          </div>
          <p class="disclaimer text_font">* SUJEITO À ANÁLISE DE CRÉDITO</p>
        </div>
      </gwd-page>
    </gwd-pagedeck>
  </gwd-google-ad>
  <script type="text/javascript" id="gwd-init-code">
    (function() {
      var gwdAd = document.getElementById('gwd-ad');

      /**
       * Handles the DOMContentLoaded event. The DOMContentLoaded event is
       * fired when the document has been completely loaded and parsed.
       */
      function handleDomContentLoaded(event) {

      }

      /**
       * Handles the WebComponentsReady event. This event is fired when all
       * custom elements have been registered and upgraded.
       */
      function handleWebComponentsReady(event) {
        // Start the Ad lifecycle.
        requestAnimationFrame(function() {
          setTimeout(function() {
            gwdAd.initAd();
          }, 1);
        });
      }

      /**
       * Handles the event that is dispatched after the Ad has been
       * initialized and before the default page of the Ad is shown.
       */
      function handleAdInitialized(event) {}

      window.addEventListener('DOMContentLoaded',
        handleDomContentLoaded, false);
      window.addEventListener('WebComponentsReady',
        handleWebComponentsReady, false);
      window.addEventListener('adinitialized',
        handleAdInitialized, false);
    })();
  </script>
  <script type="text/javascript">
    var clickTag = "https://play.google.com/store/apps/details?id=com.melhordinheiro.melhordinheiroapp"; 
  </script>
</body>

</html>
Landing Page

Open in browser
URL

https://play.google.com/store/apps/details?id=com.melhordinheiro.melhordinheiroapp
Query Parameters

id: com.melhordinheiro.melhordinheiroapp
Network Timeline

Performance Summary

Requests
Domains
99KB
Transfer Size
219KB
Content Size
242.0ms
Dom Content Loaded
309.0ms
First Paint
399.0ms
Load Time
Domain Breakdown

Transfer Size (bytes)
Content Size (bytes)
Header Size (bytes)
Requests
Timings (ms)
Total Time
Content Breakdown

Transfer Size (bytes)
Content Size (bytes)
Header Size (bytes)
Requests