View difference between Paste ID: x3KRTaFW and idPkLRrf
SHOW: | | - or go back to the newest paste.
1-
template_AMP_top_Sticky
1+
guerinsportivo.it_AMP_top_Sticky
2
3-
1. Paste this code in the <head> section of the AMP page:
3+
4
1. Paste this code into the section of the page above all other content:
5-
Important: 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.
5+
6
<amp-ad 
7-
<script async src="https://cdn.ampproject.org/v0/amp-list-0.1.js" custom-element="amp-list"></script>
7+
sticky="top" 
8-
<script async src="https://cdn.ampproject.org/v0/amp-iframe-0.1.js" custom-element="amp-iframe"></script>
8+
data-block-on-consent 
9-
<script async src="https://cdn.ampproject.org/v0/amp-mustache-0.2.js" custom-template="amp-mustache"></script>
9+
width="320" 
10-
<script async src="https://cdn.ampproject.org/v0/amp-bind-0.1.js" custom-element="amp-bind"></script>
10+
height="100" 
11
type="clickio" 
12
data-site-id="243342"
13
data-unit-id="723801"
14-
2. Insert the following CSS styles in your tag <style amp-custom> on the AMP page:
14+
15
</amp-ad>
16-
#cl-top-sticky{position:fixed;top:0;left:0;width:100%;height:100px;z-index:2147483646;box-shadow:0 2px 5px rgba(0,0,0,.3);background-color:#fff}.cl-ts-hidden{display:none}.cl-ts-visible{display:block}.cl-ts-close-button{position:absolute;bottom:-28px;width:28px;height:28px;right:0;background:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="341 8 13 13"><path fill="%234F4F4F" fill-rule="evenodd" d="M354 9.31 352.69 8l-5.19 5.19L342.31 8 341 9.31l5.19 5.19-5.19 5.19 1.31 1.31 5.19-5.19 5.19 5.19 1.31-1.31-5.19-5.19z"/></svg>') 9px 9px no-repeat #fff;box-shadow:-1px 2px 1px 0 rgba(0,0,0,.2);border:none;border-radius:0 0 0 12px}#clickio-ts-list:has(#clickio-ts-creative[height="100"][width="0"]){display:none}#clickio-ts-list:has(#clickio-ts-creative[style*="width:"][style*="0px"]){display:none;}#clickio-ts-list{height:100px}
16+
17
-----------
18
19-
3. Add this code at the beginning of the <body> of your AMP page before all other elements:
19+
guerinsportivo.it_AMP_Bottom_Sticky
20
21
1.Paste this code into the <body> section of the page where you want the ads to be shown.
22
23
<amp-sticky-ad layout="nodisplay">
24
<amp-ad
25-
template_AMP_Bottom_Sticky
25+
26
    height="100"
27-
1. Paste this code in the <head> section of the AMP page. This code should be placed on the site only once as it is the same for all site's and ad units
27+
28
    data-site-id="243342"
29-
<script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>
29+
    data-unit-id="734467"
30-
<script async custom-element="amp-sticky-ad" src="https://cdn.ampproject.org/v0/amp-sticky-ad-1.0.js"></script>
30+
31
>
32
</amp-ad>
33-
2. Paste this code into the <body> section of the page where you want the ads to be shown.
33+
34
35
36
Note:
37
38
Please bear in mind it is mandatory to remove the legacy AMP top/bottom sticky ad tags before the new tags are implemented.
39
Check below:
40-
    data-site-id="xxxxxxx"
40+
https://clickio.gyazo.com/ed804a5cc95d6e146597f941dbf8b545
41-
    data-unit-id="xxxxxxx"
41+
https://clickio.gyazo.com/f1d5ea1933875fc0646e6246893b90ae
42