Adobe-Plug-in: getResponsiveLayout

Mit dem getResponsiveLayout-Plug-in können Sie verfolgen, welche Version Ihrer auf einem responsiven Design basierenden Website aktuell von einem Besucher angesehen wird. Adobe empfiehlt die Verwendung dieses Plug-ins, wenn Ihre Website ein responsives Design verwendet und Sie die Version der von einem Besucher angezeigten Website verfolgen möchten. Dieses Plug-in ist nicht erforderlich, wenn Ihre Website kein responsives Design verwendet.

Installieren des Plug-ins mit der Web SDK- oder Web SDK-Erweiterung

Dieses Plug-in wird noch nicht für die Verwendung im Web SDK unterstützt.

Installieren des Plug-ins mit der Adobe Analytics-Erweiterung

Adobe bietet eine Erweiterung, mit der Sie die am häufigsten verwendeten Plug-ins mit Adobe Analytics verwenden können.

1. Melden Sie sich bei der Adobe Experience Platform-Datenerfassung mit Ihren Adobe ID-Anmeldeinformationen an.
2. Klicken Sie auf die gewünschte Tag-Eigenschaft.
3. Gehen Sie zur Registerkarte Erweiterungen und klicken Sie dann auf die Schaltfläche Katalog.
4. Installieren und Veröffentlichen der Erweiterung Common Analytics Plugins.
5. Wenn Sie dies noch nicht getan haben, erstellen Sie eine Regel mit der Bezeichnung „Plug-ins initialisieren“ mit der folgenden Konfiguration:
   • Bedingung: Keine
   • Ereignis: Core – Bibliothek geladen (Seitenanfang)
6. Fügen Sie der obenstehenden Regel eine Aktion mit der folgenden Konfiguration hinzu:
   • Erweiterung: Common Analytics Plugins
   • Aktionstyp: getResponsiveLayout initialisieren
7. Speichern und veröffentlichen Sie die Änderungen an der Regel.

Installieren des Plug-ins mit dem benutzerdefinierten Code-Editor

Wenn Sie die Plug-in-Erweiterung "Common Analytics Plugins"nicht verwenden möchten, können Sie den Editor für benutzerdefinierten Code verwenden.

1. Melden Sie sich bei der Adobe Experience Platform-Datenerfassung mit Ihren Adobe ID-Anmeldeinformationen an.
2. Klicken Sie auf die gewünschte Eigenschaft.
3. Gehen Sie zur Registerkarte Erweiterungen und klicken Sie dann unter der Erweiterung „Adobe Analytics“ auf die Schaltfläche Konfigurieren.
4. Erweitern Sie das Akkordeon Tracking mit benutzerdefiniertem Code konfigurieren, wodurch die Schaltfläche Editor öffnen angezeigt wird.
5. Öffnen Sie den Editor für benutzerdefinierten Code und fügen Sie den unten angegebenen Plug-in-Code in das Bearbeitungsfenster ein.
6. Speichern und veröffentlichen Sie die Änderungen an der Analytics-Erweiterung.

Installieren des Plug-ins mit AppMeasurement

Kopieren Sie den folgenden Code und fügen Sie ihn an beliebiger Stelle in der AppMeasurement Datei ein, nachdem das Analytics-Tracking-Objekt instanziiert wurde (unter Verwendung von s_gi). Die Beibehaltung von Kommentaren und Versionsnummern des Codes in Ihrer Implementierung hilft Adobe bei der Fehlerbehebung potenzieller Probleme.

/******************************************* BEGIN CODE TO DEPLOY *******************************************/
/* Adobe Consulting Plugin: getResponsiveLayout v1.1 (Requires AppMeasurement) */
var getResponsiveLayout=function(ppw,plw,tw){var c=ppw,b=plw,e=tw;if("-v"===c)return{plugin:"getResponsiveLayout",version:"1.1"};a:{if("undefined"!==typeof window.s_c_il){var a=0;for(var d;a<window.s_c_il.length;a++)if(d=window.s_c_il[a],d._c&&"s_c"===d._c){a=d;break a}}a=void 0}"undefined"!==typeof a&&(a.contextData.getResponsiveLayout="1.1");if(!(isNaN(c)||isNaN(b)||isNaN(e)||b<c||e<b))return a=window.innerWidth||document.documentElement.clientWidth||document.body.clientWidth,(c<b&&a<=b?a<=c?"phone portrait layout":"phone landscape layout":a<=b?"phone layout":a<=e?"tablet layout":"desktop layout")+":"+a+"x"+(window.innerHeight||document.documentElement.clientHeight||document.body.clientHeight)};
/******************************************** END CODE TO DEPLOY ********************************************/

Verwenden des Plug-ins

Die getResponsiveLayout-Funktion verwendet die folgenden Argumente:

• ppw (erforderlich, Ganzzahl): Die maximale Breite von Pixeln, die ein Browser-Fenster haben kann, bevor die Seite von einem Smartphone-Hochformat-Layout zu einem Smartphone-Querformat-Layout wechselt
• plw (Erforderlich, Ganzzahl): Die maximale Breite von Pixeln, die ein Browser-Fenster haben kann, bevor die Seite von einem Smartphone-Querformat-Layout zu einem Tablet-Layout wechselt
• tw (erforderlich, Ganzzahl): Die maximale Breite in Pixeln, die ein Browser-Fenster haben kann, bevor die Seite von einem Tablet-Layout zu einem Desktop-Layout wechselt

Der Aufruf dieser Funktion gibt eine Zeichenfolge zurück, die zwei durch einen Doppelpunkt (:) getrennte Teile enthält. Der erste Teil der Zeichenfolge enthält einen der folgenden Werte, je nach Browser-Breite und den obigen Argumenten:

• "phone portrait layout"
• "phone landscape layout"
• "phone layout" (für Websites ohne Layouts im Hoch- und Querformat)
• "tablet layout"
• "desktop layout"

Der zweite Teil der zurückgegebenen Zeichenfolge ist die Breite und Höhe des Browsers. Beispiel: "desktop layout:1243x700".

Beispiele

// A visitor accesses your site on their laptop. The browser window is maximized.
// * Your site switches from phone portrait mode to phone landscape mode when the browser width is greater than 500 pixels
// * Your site switches from phone landscape mode to tablet mode when the browser width is greater than 700 pixels
// * Your site switches from tablet mode to desktop mode when the browser width is greater than 1000 pixels
// Sets eVar10 to "desktop layout:1920x937".
s.eVar10 = getResponsiveLayout(500, 700, 1000);

// A visitor accesses your site on their phone.
// * Your site has only a phone mode, a tablet mode, and a desktop mode
// * Your site switches from phone mode to tablet mode when the browser width is greater than 800 pixels
// * Your site switches from tablet mode to desktop mode when the browser width is greater than 1,100 pixels
// Sets eVar10 to "phone portrait layout:720x1280"
s.eVar10 = getResponsiveLayout(800, 800, 1100);

Versionsverlauf

1.1 (19. März 2021)

• Versionsnummer als Kontextdaten hinzugefügt.

1.0 (2. Mai 2018)

• Erste Version.

Ressourcen für Business.Adobe.com

Third Party Data Customer Profiles Data Management Platform Customer Segmentation Data Warehouse Data Analytics