AMP Anzeigenkennzeichnung: Unterschied zwischen den Versionen

Aus Dokumentation
Zur Navigation springen Zur Suche springen
Keine Bearbeitungszusammenfassung
Markierung: visualeditor-switched
Keine Bearbeitungszusammenfassung
Markierung: visualeditor-switched
Zeile 18: Zeile 18:
order: -1;display:none;
order: -1;display:none;
</syntaxhighlight>
</syntaxhighlight>
Dadurch rutscht es vor das amp-ad und ist erst mal nicht sichtbar.
:Dadurch rutscht es vor das amp-ad und ist erst mal nicht sichtbar.
*Wenn eine Werbung gebucht, ausgeliefert und das amp-ad dadurch angezeigt wird, so erscheint mit folgendem Code auch die Anzeigenkennzeichnung:
*Wenn eine Werbung gebucht, ausgeliefert und das amp-ad dadurch angezeigt wird, so erscheint mit folgendem Code auch die Anzeigenkennzeichnung:
<syntaxhighlight lang="css">
<syntaxhighlight lang="css">
Zeile 26: Zeile 26:
</syntaxhighlight>
</syntaxhighlight>
   
   
iqampcenter und iqadmarker sind natürlich nur Beispielnamen, die Ihr gerne durch bessere Bezeichnungen ersetzen könnt.
'''iqampcenter''' und '''iqadmarker''' sind natürlich nur Beispielnamen, die gerne durch bessere Bezeichnungen ersetzt werden können.

Version vom 7. Juni 2021, 06:45 Uhr

Da in AMP-Seiten der Adcontroller nicht verbaut ist, muss eine Anzeigenkennzeichnung durch den Publisher erfolgen. Diese Anleitung ist ein Beispiel, wie die Werbekennzeichnung auf einer AMP-Seite „ausgeblendet“ werden kann, sofern kein Ad auf einer Platzierung ausgespielt wurde.

Beispiel-Aufbau einer Anzeigenkennzeichnung

<div class="iqampcenter" >
    <amp-ad  </amp-ad>
    <div class="iqadmarker">Anzeige</div>
</div>
  • Das "iqadmarker"-div kommt im HTML-Code hinter das amp-ad-Tag
  • Der umliegende div-Container "iqampcenter" bekommt zusätzlich das CSS-Styling:
display: flex; flex-direction: column;
  • Das "iqadmarker"-div bekommt das CSS-Styling:
order: -1;display:none;
Dadurch rutscht es vor das amp-ad und ist erst mal nicht sichtbar.
  • Wenn eine Werbung gebucht, ausgeliefert und das amp-ad dadurch angezeigt wird, so erscheint mit folgendem Code auch die Anzeigenkennzeichnung:
.iqampcenter > amp-ad:not([hidden]) + .iqadmarker { 
    display: table; 
}

iqampcenter und iqadmarker sind natürlich nur Beispielnamen, die gerne durch bessere Bezeichnungen ersetzt werden können.