SHOW:
|
|
- or go back to the newest paste.
| 1 | Create creative.html with content: | |
| 2 | ||
| 3 | <!DOCTYPE html> | |
| 4 | <html> | |
| 5 | <head> | |
| 6 | <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> | |
| 7 | <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" /> | |
| 8 | <meta name="robots" content="noindex"> | |
| 9 | <script> | |
| 10 | window.__lxG__ = {ampSplashMode: true};
| |
| 11 | </script> | |
| 12 | <script async src="https://securepubads.g.doubleclick.net/tag/js/gpt.js" crossorigin="anonymous"></script> | |
| 13 | <script async type="text/javascript" src="//s.clickiocdn.com/t/static/amp/splash/consent_light.js"></script> | |
| 14 | <script async type="text/javascript" src="//s.clickiocdn.com/t/215795/360_amp.js"></script> | |
| 15 | </head> | |
| 16 | <body topmargin="0" leftmargin="0" marginwidth="0" marginheight="0" style="overflow-y: hidden;"> | |
| 17 | <script class="__lxGc__" type="text/javascript"> | |
| 18 | ((__lxGc__=window.__lxGc__||{'s':{},'b':0})['s']['_215795']=__lxGc__['s']['_215795']||{'b':{}})['b']['_725816']={'i':__lxGc__.b++};
| |
| 19 | </script> | |
| 20 | </body> | |
| 21 | </html> | |
| 22 | ||
| 23 | - | Place the file on your domain at any URL for example: https://www.cronista.com/creative.html |
| 23 | + | Place the file on your domain at any URL for example: https://qa.cronista.com/creative.html |
| 24 | ||
| 25 | - | Make sure to fill in the URL where you uploaded the file before proceeding to the next step: https://www.cronista.com/creative.html |
| 25 | + | Make sure to fill in the URL where you uploaded the file before proceeding to the next step: https://qa.cronista.com/creative.html |
| 26 | ||
| 27 | Paste this code in the <head> section of the AMP page: | |
| 28 | ||
| 29 | <script async src="https://cdn.ampproject.org/v0/amp-list-0.1.js" custom-element="amp-list"></script> | |
| 30 | <script async src="https://cdn.ampproject.org/v0/amp-iframe-0.1.js" custom-element="amp-iframe"></script> | |
| 31 | <script async src="https://cdn.ampproject.org/v0/amp-mustache-0.2.js" custom-template="amp-mustache"></script> | |
| 32 | ||
| 33 | This code should only be added once. Ensure these elements are not already present before adding. In AMP, each library can only be included once, and duplicating the inclusion will result in an error, causing your AMP page to become invalid. | |
| 34 | ||
| 35 | Insert the following CSS styles in your tag <style amp-custom> on the AMP page: | |
| 36 | ||
| 37 | #clickio-splash-list{right:auto;left:0;min-height:1px;width:100%}#clickio-splash-iframe{margin:0;overflow:visible;min-width:100%;opacity:0}#clickio-splash-iframe,#clickio-splash-list{position:fixed;top:100vh;bottom:-100px;z-index:-1}#clickio-splash-iframe:not([height="100"]){top:0;bottom:0;max-height:100%;max-width:100%;opacity:1;z-index:2147483647}#clickio-splash-list:has(#clickio-splash-iframe:not([height="100"])){z-index:2147483647}#clickio-splash-list:has(#clickio-splash-iframe[height="100"][width="0"]){display:none}#clickio-splash-iframe[height="100"][width="0"]{display:none}
| |
| 38 | ||
| 39 | Add this code to the <body> of your AMP page: | |
| 40 | ||
| 41 | <amp-list id="clickio-splash-list" layout="fill" data-block-on-consent="_till_responded" src="https://cns.clickiocdn.com/splash?source_url=SOURCE_URL&canonical_url=CANONICAL_URL&counter=COUNTER&document_referrer=DOCUMENT_REFERRER&viewer=VIEWER&scr_w=AVAILABLE_SCREEN_WIDTH&scr_h=AVAILABLE_SCREEN_HEIGHT"> | |
| 42 | <template type="amp-mustache"> | |
| 43 | <div> | |
| 44 | - | <amp-iframe width="{{scr_w}}" height="100" layout="responsive" id="clickio-splash-iframe" sandbox="allow-scripts allow-same-origin allow-popups allow-popups-to-escape-sandbox allow-top-navigation allow-top-navigation-by-user-activation" resizable frameborder="0" src="{{iframeSrc}}?canon={{canonSrc}}&w={{scr_w}}&h={{scr_h}}&src=www.cronista.com/creative.html">
|
| 44 | + | <amp-iframe width="{{scr_w}}" height="100" layout="responsive" id="clickio-splash-iframe" sandbox="allow-scripts allow-same-origin allow-popups allow-popups-to-escape-sandbox allow-top-navigation allow-top-navigation-by-user-activation" resizable frameborder="0" src="{{iframeSrc}}?canon={{canonSrc}}&w={{scr_w}}&h={{scr_h}}&src=qa.cronista.com/creative.html">
|
| 45 | <div overflow></div> | |
| 46 | <div placeholder></div> | |
| 47 | </amp-iframe> | |
| 48 | </div> | |
| 49 | </template> | |
| 50 | </amp-list> | |
| 51 | ||
| 52 |
