Mehrere Elemente in einer Galerie in dynamischen Anzeigen für Google Ads anzeigen - Google Web Designer-Hilfe [gg-webdesigner-de]

Zeigen Sie mehrere Elemente innerhalb einer Galerie in dynamischen Anzeigen für Google Ads an

Auf dieser Seite wird beschrieben, wie Sie mithilfe einer Galerie Elemente aus Ihrem dynamischen Feed für Google Ads anzeigen. Die Galerie lädt nacheinander automatisch jedes Element und verfolgt auch das aktive Element, sodass die Ausgangs-URL auf eine für dieses Element spezifische Webseite verweist.

Verwendung einer Vorlage

Wenn Sie eine Vorlage aus der Kategorie Dynamic Remarketing for Google Ads " der Vorlagengalerie verwenden (mit Ausnahme der Vorlage „Leeres Blatt für dynamisches Remarketing"), implementiert Ihr Creative bereits Tracking, solange Sie das Standardlayout verwenden.

Befolgen Sie die Anweisungen auf dieser Seite, wenn Sie zusätzliche dynamische Elemente hinzufügen oder Ihr Creative mithilfe der Vorlage "Dynamic Remarketing Blank Slate" von Grund auf neu entwerfen.

Schritt 1. Richten Sie die Artikelgruppe ein

Um das Tracking zu vereinfachen, sollten Sie mehrere Elemente gruppieren , die Sie für ein einzelnes Feedelement anzeigen möchten, z. B. den Titel, das Bild und den Preis für denselben Artikel. Durch die Verwendung einer Gruppe kann Ihr Creative die Interaktion mit der Gruppe verfolgen, anstatt die Interaktion mit jedem einzelnen Element zu verfolgen.

1. Erstellen Sie Platzhalterelemente für ein einzelnes Element. Dies kann beispielsweise den Artikelnamen und ein Bild des Artikels beinhalten.

   

2. Erstellen Sie eine neue Gruppe mit diesen Elementen, indem Sie die Elemente auswählen, mit der rechten Maustaste auf die Auswahl klicken und dann auf Gruppe erstellen... klicken.

   

3. Geben Sie einen Gruppennamen ein und klicken Sie auf OK .

Die Gruppe wird zur zukünftigen Verwendung automatisch zur Bibliothek hinzugefügt, aber löschen Sie die Gruppeninstanz noch nicht auf der Bühne. Sie können es jetzt zur Seite verschieben.

Schritt 2. Zeigen Sie Elemente in einer Galerie an

Sie können entweder die Swipeable-Galerie oder die Karussell-Galerie- Komponente verwenden, um Ihre Feed-Elemente anzuzeigen.

1. Fügen Sie die Galerie der Bühne hinzu.

2. Legen Sie im Bedienfeld „Eigenschaften" für die Galerie eine ID fest (z. B. gwd-swipegallery_1 ).

3. Geben Sie im Eigenschaftsfeld Gruppen den Namen der Gruppe ein, die Sie zuvor erstellt haben (z. B. Group1 ).

   

Schritt 3. Fügen Sie dynamische Bindungen hinzu

Verbinden Sie die Creative-Elemente über dynamische Datenbindungen mit Ihrem Feed.

1. Klicken Sie im dynamischen Bereich auf Dynamische Bindungen hinzufügen Schaltfläche, um das Dialogfeld "Dynamische Eigenschaften" zu öffnen.

2. Wenn Sie noch kein Datenschema ausgewählt haben, wählen Sie das Schema aus.

3. Binden Sie für jedes Element innerhalb der Gruppe das Attribut des einzelnen Elements an das entsprechende Datenschemaobjekt.

   

4. Fügen Sie eine Bindung für die Gruppe in der Galerie hinzu und wählen Sie dann das Elementattribut Wiederholen für jedes Element in der Sammlung aus. Legen Sie das Datenschemaobjekt auf das Element der obersten Ebene fest, das Ihrem Datenschema entspricht (z. B. Einzelhandel oder Reisen ).

   

5. Klicken Sie zum Speichern auf OK .

Sie können die Gruppeninstanz jetzt aus der Phase löschen.

Schritt 4. Fügen Sie der Galerie Benutzerinteraktionsereignisse hinzu

Alle Elemente müssen mouseover und mouseout Ereignisse enthalten, damit das Creative das aktive Element verfolgen kann.

1. Klicken Sie mit der rechten Maustaste auf die Galerie und wählen Sie Ereignis hinzufügen... aus, um ein neues Maus > mouseover Ereignis hinzuzufügen.

   

2. Wählen Sie die Aktion Benutzerdefiniert > gwd.itemMouseover aus und klicken Sie dann auf OK .

   

3. Fügen Sie der Galerie die folgenden zusätzlichen Ereignisse hinzu, für insgesamt 5 Ereignisse mit der Galerie als Ziel:

   Fall	Aktion
   Maus > mouseover (in den vorherigen Schritten hinzugefügt)	Benutzerdefiniert > gwd.ItemMouseover
   Maus > mouseout	Benutzerdefiniert > gwd.ItemMouseout
   Maus > click	Benutzerdefiniert > gwd.exitToItem
   Wischbare Galerie oder Karussell-Galerie > Rahmen aktiviert	Benutzerdefiniert > gwd.galleryFrameActivated
   Swipe-Galerie oder Karussell-Galerie > Rahmen angezeigt	Benutzerdefiniert > gwd.galleryFrameShown

Schritt 5. Nehmen Sie Änderungen in der Codeansicht vor

Wechseln Sie zur Codeansicht , um Codeänderungen vorzunehmen, um die Funktionalität der Galerie mit Ihrem dynamischen Feed abzuschließen.

1. Suchen Sie in der Codeansicht das im Katalogelement verschachtelte Gruppenelement. Fügen Sie dem Gruppenelement die Klasse js-item hinzu.

     < gwd-swipegallery id = "gwd-swipegallery_1" scaling = "contain" pause-front-media = "" resume-next-media = "" class = "gwd-swipegallery-19o0" groups = "Group1" >    < div class ="js-item" data-gwd-group = "Group1" id = "Group1_1" style = "height: 100%; width: 100%;" bind-each-item = "Product" ></ div >  </ gwd-swipegallery >

2. Suchen Sie in der Codeansicht nach der Funktion handleWebComponentsReady . Entkommentieren Sie die Zeile, die die Funktion common.setGallery aufruft, indem Sie die Zeichen // entfernen, und ersetzen Sie dann swipegallery-items durch die ID Ihrer Galerie (z. B. gwd-swipegallery_1 ).

     /**    * Handles the WebComponentsReady event. This event is fired when all    * custom elements have been registered and upgraded.    */  function handleWebComponentsReady ( event ) {    // Start the Ad lifecycle.    setTimeout( function () {      // add reference to your swipegallery to access via custom JS, passing in its ID:      //common.setGallery('swipegallery-items');        gwdAd .initAd();    }, 0);  }

Andere Schritte

• Falls Sie dies noch nicht getan haben, erfahren Sie hier, wie Sie einen dynamischen Datenfeed erstellen .
• Sehen Sie sich Ihr Creative mit Beispieldaten in der Vorschau an , um zu sehen, wie es aussehen wird.