Annonsenheter

Anpassa en responsiv multiplex-annonsenhet

Nästa: Om AMP (Accelerated Mobile Pages)

Obs! Dessa alternativ är utfasade. Du kan fortfarande använda dessa alternativ för att anpassa dina multiplex-annonser, men vi kan inte garantera att de fungerar i alla situationer.

Om du har specifika krav på dina responsiva multiplex-annonsenheter kan du anpassa deras utseende genom att lägga till parametrar i annonskoden. Du kan till exempel ändra layouten på multiplex-annonsenheterna och ange hur du vill ordna raderna och kolumnerna med annonser.

Du kan dessutom använda parametrar för att ange olika inställningar för mobila enheter respektive datorer. Om du till exempel ger layoutparametern ett enda värde får multiplex-annonsenheten samma layout på både mobila enheter och datorer. Om du ger layoutparametern två värden får multiplex-annonsenheten en layout på mobila enheter (det första värdet) och en annan layout på datorer (det andra värdet).

Observera att dessa alternativ endast är tillgängliga för responsiva multiplex-annonsenheter och att alla parametrar måste anges för att anpassningarna ska fungera. När du har modifierat annonskoden bör du testa dina multiplex-annonsenheter på olika typer av enheter och skärmar och kontrollera att de fungerar som de ska.

Obs! Exemplen i denna artikel visar godkända modifieringar av AdSense-annonskoden. Du bryter inte mot programpolicyerna för AdSense om du ändrar din annonskod för multiplex-annonser på dessa sätt.

Utöka allt Komprimera allt

Ändra layouten för en multiplex-annonsenhet

Med layoutparametern (data-matched-content-ui-type) kan du styra placeringen av text och bilder i dina multiplex-annonsenheter. Du kan till exempel välja att visa bilder och text sida vid sida eller att visa bilder ovanför texten.

Välj bland följande layoutalternativ:

Bild och text sida vid sida

Layout med bild och text placerade bredvid varandra. Välj den här layouten genom att lägga till parametern data-matched-content-ui-type="image_sidebyside" i annonskoden.

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>

      <!-- pbad -->

      <ins class="adsbygoogle"

           style="display:block"

           data-ad-client="ca-pub-1234567890123456"

           data-ad-slot="1234567890"

           data-matched-content-ui-type="image_sidebyside"

           data-matched-content-rows-num="4"

           data-matched-content-columns-num="1"

           data-ad-format="autorelaxed"></ins>

      <script>

      (adsbygoogle = window.adsbygoogle || []).push({});

      </script>

Exempel på annonser med layouten bilder och text sida vid sida.

Bild och text sida vid sida med kort

Layout med bild och text bredvid varandra på ett kort. Välj den här layouten genom att lägga till parametern data-matched-content-ui-type="image_card_sidebyside" i annonskoden.

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>

      <!-- pbad -->

      <ins class="adsbygoogle"

           style="display:block"

           data-ad-client="ca-pub-1234567890123456"

           data-ad-slot="1234567890"

           data-matched-content-ui-type="image_card_sidebyside"

           data-matched-content-rows-num="4"

           data-matched-content-columns-num="1"

           data-ad-format="autorelaxed"></ins>

      <script>

      (adsbygoogle = window.adsbygoogle || []).push({});

      </script>

Example of an ad with Image and text side-by-side with card layout.

Bild staplad ovanför text

Layout med bild och text placerade ovanpå varandra. Välj den här layouten genom att lägga till parametern data-matched-content-ui-type="image_stacked" i annonskoden.

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>

      <!-- pbad -->

      <ins class="adsbygoogle"

           style="display:block"

           data-ad-client="ca-pub-1234567890123456"

           data-ad-slot="1234567890"

           data-matched-content-ui-type="image_stacked"

           data-matched-content-rows-num="3"

           data-matched-content-columns-num="1"

           data-ad-format="autorelaxed"></ins>

      <script>

      (adsbygoogle = window.adsbygoogle || []).push({});

      </script>

Exempel på annonser med layouten Bild staplad ovanför text.

Bild staplad ovanför text med kort

Layout med bild och text placerade ovanpå varandra på ett kort. Välj den här layouten genom att lägga till parametern data-matched-content-ui-type="image_card_stacked" i annonskoden.

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>

      <!-- pbad -->

      <ins class="adsbygoogle"

           style="display:block"

           data-ad-client="ca-pub-1234567890123456"

           data-ad-slot="1234567890"

           data-matched-content-ui-type="image_card_stacked"

           data-matched-content-rows-num="3"

           data-matched-content-columns-num="1"

           data-ad-format="autorelaxed"></ins>

      <script>

      (adsbygoogle = window.adsbygoogle || []).push({});

      </script>

Exempel på annonser med layouten Bild staplad ovanför text med kort.

Endast text

Textbaserad layout utan bild. Välj den här layouten genom att lägga till parametern data-matched-content-ui-type="text" i annonskoden.

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>

      <!-- pbad -->

      <ins class="adsbygoogle"

           style="display:block"

           data-ad-client="ca-pub-1234567890123456"

           data-ad-slot="1234567890"

           data-matched-content-ui-type="text"

           data-matched-content-rows-num="4"

           data-matched-content-columns-num="1"

           data-ad-format="autorelaxed"></ins>

      <script>

      (adsbygoogle = window.adsbygoogle || []).push({});

      </script>

Exempel på textbaserad annonslayout.

Text med kort

Textbaserad layout på ett kort. Välj den här layouten genom att lägga till parametern data-matched-content-ui-type="text_card" i annonskoden.

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>

      <!-- pbad -->

      <ins class="adsbygoogle"

           style="display:block"

           data-ad-client="ca-pub-1234567890123456"

           data-ad-slot="1234567890"

           data-matched-content-ui-type="text_card"

           data-matched-content-rows-num="4"

           data-matched-content-columns-num="1"

           data-ad-format="autorelaxed"></ins>

      <script>

      (adsbygoogle = window.adsbygoogle || []).push({});

      </script>

Exempel på en annons med layouten Text med kort.

Ange antal rader och kolumner i en multiplex-annonsenhet

Annonserna i en multiplex-annonsenhet är ordnade i ett rutnät. Du kan ange antalet rader och kolumner i rutnätet. Du kan till exempel ange att multiplex-annonsenheten ska vara en 2 × 2-kvadrat, en 4 × 1-kolumn eller annat.

Du anger antalet rader med parametern data-matched-content-rows-num och antalet kolumner med parametern data-matched-content-columns-num. Du måste ange båda parametrarna och data-matched-content-ui-type tillsammans.

Obs!

Det finns vissa restriktioner när det gäller hur många rader och kolumner du kan ange. Det totala antalet annonser i en multiplex-annonsenhet måste vara mellan 1 och 30. Om du försöker visa färre än 1 eller fler än 30 annonser visas multiplex-annonsenheten tom.
Ibland kanske vi inte kan visa exakt det antal rader och/eller kolumner som du har angett. Du kan till exempel ha angett ett stort antal kolumner men multiplex-annonsenheten är inte tillräckligt bred för att rymma dem alla. I sådana fall justerar vi antalet rader och/eller kolumner så att annonserna får plats i det tillgängliga utrymmet och ger en god användarupplevelse.

Exempel på rader och kolumner

4 × 1 (mobila enheter och datorer)

Denna exempelkod visar hur du skapar en multiplex-annonsenhet med fyra rader och en enda kolumn som visar totalt fyra annonser.

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>

        <!-- pbad -->

        <ins class="adsbygoogle"

             style="display:block"

             data-ad-client="ca-pub-1234567890123456"

             data-ad-slot="1234567890"

             data-matched-content-rows-num="4"

             data-matched-content-columns-num="1"

             data-matched-content-ui-type="image_stacked"

             data-ad-format="autorelaxed"></ins>

        <script>

        (adsbygoogle = window.adsbygoogle || []).push({});

        </script>

Exempel på bild och text placerade ovanpå varandra i AdSense.

2 × 2 (mobila enheter och datorer)

Denna exempelkod visar hur du skapar en multiplex-annonsenhet med två rader och två kolumner som visar totalt fyra annonser.

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>

        <!-- pbad -->

        <ins class="adsbygoogle"

             style="display:block"

             data-ad-client="ca-pub-1234567890123456"

             data-ad-slot="1234567890"

             data-matched-content-rows-num="2"

             data-matched-content-columns-num="2"

             data-matched-content-ui-type="image_stacked"

             data-ad-format="autorelaxed"></ins>

        <script>

        (adsbygoogle = window.adsbygoogle || []).push({});

        </script>

Multiplex-annonsenhet i AdSense med två rader och två kolumner som visar totalt fyra annonser.

3 × 3 (mobila enheter och datorer)

Denna exempelkod visar hur du skapar en multiplex-annonsenhet med tre rader och tre kolumner som visar totalt nio annonser.

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>

        <!-- pbad -->

        <ins class="adsbygoogle"

             style="display:block"

             data-ad-client="ca-pub-1234567890123456"

             data-ad-slot="1234567890"

             data-matched-content-rows-num="3"

             data-matched-content-columns-num="3"

             data-matched-content-ui-type="image_stacked"

             data-ad-format="autorelaxed"></ins>

        <script>

        (adsbygoogle = window.adsbygoogle || []).push({});

        </script>

En multiplex-annonsenhet i AdSense med tre rader och tre kolumner som visar totalt nio annonser.

4 × 1 (mobila enheter) och 2 × 2 (datorer) för responsiva webbplatser

Denna exempelkod visar hur du skapar en multiplex-annonsenhet med ett 4 × 1-rutnät på mobila enheter och ett 2 × 2-rutnät på datorer. Den här varianten är lämplig om du har en responsiv webbplats.

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>

        <!-- pbad -->

        <ins class="adsbygoogle"

             style="display:block"

             data-ad-client="ca-pub-1234567890123456"

             data-ad-slot="1234567890"

             data-matched-content-rows-num="4,2"

             data-matched-content-columns-num="1,2"

             data-matched-content-ui-type="image_stacked,image_stacked"

             data-ad-format="autorelaxed"></ins>

        <script>

        (adsbygoogle = window.adsbygoogle || []).push({});

        </script>

Exempel på bild och text placerade ovanpå varandra i AdSense.

Multiplex-annonsenhet i AdSense med två rader och två kolumner som visar totalt fyra annonser.

Felsökning

När du har anpassat multiplex-annonsenheten kan det hända att den inte ser ut som förväntat. Här är några vanliga problem med multiplex-annonsenheter och hur du åtgärdar dem:

Multiplex-annonsenheten är tom

Det finns två orsaker till att detta kan hända:

Det totala antalet annonser i multiplex-annonsenheten är färre än 1 eller fler än 30. Ändra antalet rader och/eller kolumner i multiplex-annonsenheten så att det totala antalet annonser ligger inom gränsen.
Multiplex-annonsenheten är för bred för det angivna antalet annonser. I detta fall bör du försöka minska multiplex-annonsenhetens storlek.

Multiplex-annonsenheten har färre annonser än förväntat

Detta kan inträffa när det inte finns tillräckligt med utrymme för att visa det exakta antalet annonser du angett. Du kan till exempel ha angett ett stort antal annonser och multiplex-annonsenheten är för smal eller visas på en liten skärm. I sådana fall justerar vi antalet rader och/eller kolumner så att annonserna passar i det tillgängliga utrymmet. Överväg att ändra multiplex-annonsenhetens bredd eller ange olika antal rader och kolumner för mobila enheter respektive datorer.

Annonserna visas med endast text

Detta kan inträffa om multiplex-annonsenheten är för smal för det angivna antalet annonser. I detta fall bör du försöka öka multiplex-annonsenhetens storlek.

Använda konsolen för att hitta fel i multiplex-annonsenheter

Du kan använda konsolen i webbläsaren om du vill kontrollera att du har modifierat annonskoden för multiplex-annonser på rätt sätt. Där kan du till exempel se om annonskoden saknar en obligatorisk parameter eller om en parameter innehåller ett ogiltigt värde.

Om du använder Chrome kan du följa dessa anvisningar för att testa annonskoden i DevTools Console:

Gå till sidan med dina multiplex-annonsenheter.
Tryck på Ctrl+Skift+J (Windows/Linux) eller Kommando+Alt+J (Mac).
Läs eventuella felmeddelanden i konsolpanelen.

Var det här till hjälp?

Hur kan vi förbättra den?