Locator- und Pages-Attribute
Widget-Vorlage, die alle Locator-Funktionen enthält – bereit zum Versand mit ein paar Bearbeitungen.
Inhaltsverzeichnis
Locator Widget Attributliste Allgemeine Einstellungen für Locator Einstellungen für Locator-Listenansicht Allgemeine Seiteneinstellungen Einstellungen für Seitenkomponenten Einstellungen für Seiteninhaltslist Farbeinstellungen Locator Widget Beispiel Code Beispiel
Das Standard-Locator Widget enthält die minimalen HTML-Elemente, die zur Ausführung des Locator Widget erforderlich sind. Um das Aussehen des Locator Widget an die Anforderungen und das Design der Website anzupassen, kannst du HTML-Attribute im <div> HTML-Element hinzufügen, um die angezeigten Komponenten zu konfigurieren.
Locator Widget
<script src="https://uberall.com/assets/storeFinderWidget-v2.js" type="text/javascript"></script>
<div
id="store-finder-widget"
data-key="{{locator-data-key}}"
></div>Erforderliche Elemente und Attribute
| Element | Attribute |
|---|---|
| <script> | des Locator Widget JavaScript |
| <div> | <id> definiert die Content Division des Locator Widget <data-key> identifiziert die spezifische Konfiguration des angezeigten Inhalts |
Attributliste
Umfassende Liste der verfügbaren Einstellungen.
Allgemeine Einstellungen für Locator
| Attribute | Beschreibung |
|---|---|
| data-baseurl |
URL-Pfad Definiere die Production oder Sandbox Datenbank |
| data-widgetoriginurl |
URL-Pfad Definiere die Production oder Sandbox Datenbank |
| data-title |
Texteingabe Definiere den Titel des Locator Widget |
| data-logourl |
URL-Pfad öffentlich zugängliches Bild im .png oder .jpg Format |
| data-locationpinurl |
URL-Pfad öffentlich zugängliches Bild im .png oder .jpg Format |
| data-locationpinurl-business |
Texteingabe "$business_id1=URL_PATH1, $business_id2=URL_PATH2, ..." - öffentlich zugängliches Bild im .png oder .jpg Format erforderlich Konfiguration von „data-locationpinurl" |
| data-locationpincolor |
Texteingabe Akzeptiert eine Farbe in Text-, RGB-Code oder Hex-Code („red", „rgb(255,0,0)", „#EB4034") |
| data-locationpinhovercolor |
Texteingabe Akzeptiert eine Farbe in Text-, RGB-Code oder Hex-Code („red", „rgb(255,0,0)", „#EB4034") |
| data-clustericoncolor |
Texteingabe Akzeptiert eine Farbe in Text-, RGB-Code oder Hex-Code („red", „rgb(255,0,0)", „#EB4034") |
| data-clustericonhovercolor |
Texteingabe Akzeptiert eine Farbe in Text-, RGB-Code oder Hex-Code („red", „rgb(255,0,0)", „#EB4034") |
| data-footertext |
Texteingabe Definiere die Fußzeile des Locator Widget |
| data-language |
Texteingabe Werte: „en"/„de" Definiere die angezeigte Sprache des Locator Widget mit zwei-buchstabigem Sprachcode |
| data-countries |
Texteingabe Werte: „US"/„DE" Definiere die angezeigten Standorte nach Land mit zwei-buchstabigem Ländercode |
| data-askforlocationonload |
boolean Werte: „true"/„false" |
| data-businessidlistwithoutdetailpage |
Texteingabe „Nur Pin"-Standorte – Standorte ohne lokale Seite, indem du die Business-IDs des Standorts zu diesem Attribut hinzufügst; Geschäfts-IDs durch Komma getrennt auflisten, z. B.: „businessId_1,businessId_2,..." |
| data-trackevents |
boolean Werte: „true"/„false" |
| data-gapikey |
Texteingabe Der Google Maps API-Schlüssel – wenn nicht hinzugefügt, wird der reguläre Schlüssel vom System als Standard verwendet. |
| data-mapcentercoordinates |
Texteingabe Definiere Breitengrad und Längengrad („lat:40,4;lng:-3,7"), auf die die Karte zentriert werden soll. |
Locator Meta-Tags
Texteingabe
| Attribute | Beschreibung |
| data-mainpagetitle |
Texteingabe Definiere den Seitentitel der Seite, auf der der Locator eingebettet ist. |
| data-mainpagedescription |
Texteingabe Definiere die Beschreibung der Seite, auf der der Locator eingebettet ist. |
| data-localpagetitle |
Texteingabe
|
| data-localpagedescription |
Texteingabe
|
|
data-sitemaptitle |
|
| data-sitemapdescription | Texteingabe |
Einstellungen für Locator-Listenansicht
| Attribute | Beschreibung |
|---|---|
| data-hideopennowfilter |
boolean Werte: „true"/„false" |
| data-imperialunits |
boolean Werte: „true"/„false" |
| data-filters |
Texteingabe Wählt die Felder aus, die die Filterdaten steuern. Dies kann das Services-Feld oder ein erweitertes Filterfeld sein. |
| data-filter-services |
Texteingabe Auswahl der angezeigten Filter in der Locator-Listenansicht. Die Texteingabe der Filter muss mit den Services der Standortdaten übereinstimmen. erforderlich Konfiguration von data-filters; durch Kommas getrennt |
| data-showaddressextra |
boolean Werte: „true"/„false" |
| data-showactionbuttons |
boolean Werte: „true"/„false" Zeige/Verberge CTAs für Richtungen und Anrufe in der Standortliste |
| data-showctabuttoninlocationlist | boolean Werte: „true"/„false" Zeige/Verberge benutzerdefinierte CTAs in der Standortliste |
| data-showfullwidth |
boolean Werte: „true"/„false" Dehnt die Karte auf die volle Breite ihres übergeordneten Containers aus. |
| data-hidefilterbar |
boolean Werte: „true"/„false" Verbirgt die Dropdown-Filterleiste, wenn auf true gesetzt. |
Allgemeine Seiteneinstellungen
| Attribute | Beschreibung |
|---|---|
| data-locationpageheader |
Texteingabe Werte: „map"/„hero" Auswahl der angezeigten Standortseitenkopfzeile – entweder eine Kartenansicht oder ein Panoramabild der Standortdaten mit einer Größe von 2266 x 480 Pixeln Standard „map" |
| data-showfooter |
boolean Werte: „true"/„false" |
| data-showheader |
boolean Werte: „true"/„false" |
| data-showattribution |
boolean Werte: „true"/„false" |
| data-showaddressextra |
boolean Werte: „true"/„false" |
| data-noindexlocationsmap |
boolean Werte: „true"/„false" Sitemapseiten werden von Google nicht indiziert. |
Einstellungen für Seitenkomponenten
| Attribute | Beschreibung |
|---|---|
| data-minimumreviewratingtoshow |
Texteingabe Definiert die Mindestbewertung in Sternen, die eine Rezension haben muss, um angezeigt zu werden. Muss zusammen mit data-showreviews="true" verwendet werden Werte: „1"/„2"/„3"/„4"/„5" |
| data-showkeywords |
boolean Werte: „true"/„false" |
| data-showcategories |
boolean Werte: „true"/„false" |
| data-showlanguages |
boolean Werte: „true"/„false" |
| data-showwebsite |
boolean Werte: „true"/„false" |
| data-showlogo |
boolean Werte: „true"/„false" |
| data-showsimilarlocations |
boolean Werte: „true"/„false" |
| data-showservices |
boolean Werte: „true"/„false" |
| data-showbrands |
boolean Werte: „true"/„false" |
| data-showbacklink |
boolean Definiere, ob die Schaltfläche „Zurück zur Kartenansicht" angezeigt werden soll Werte: „true"/„false" |
| data-showreviews |
boolean Definiere, ob Kundenfeedback angezeigt werden soll – Google Business Profile nur Werte: „true"/„false" |
| data-showpaymentmethods |
boolean Werte: „true"/„false" |
| data-useidentifier |
boolean Werte: „true"/„false" |
| data-uselatinencodedurls |
boolean Werte: „true"/„false" Wird für Adressen mit nicht-lateinischen Zeichen verwendet, um diese zu berücksichtigen |
| data-showzipcity |
boolean Werte: „true"/„false" |
| data-showsocialprofiles |
boolean Werte: „true"/„false" |
| data-showimprint |
boolean Werte: „true"/„false" |
| data-primarycolumn-snippetcustomfieldkey | Texteingabe Wert: Name deines benutzerdefinierten Feldes, das das HTML enthält |
| data-secondarycolumn-snippetcustomfieldkey | Texteingabe Wert: Name deines benutzerdefinierten Feldes, das das HTML enthält |
Einstellungen für Seiteninhaltslist
| Attribute | Beschreibung |
|---|---|
| data-showProductContentList |
boolean Werte: „true"/„false" |
| data-showMenuContentList |
boolean Werte: „true"/„false" |
| data-showEventContentList |
boolean Werte: „true"/„false" |
| data-showCustomContentList |
boolean Werte: „true"/„false" |
| data-showPeopleContentList |
boolean Werte: „true"/„false" |
Farbeinstellungen
| Attribute | Beschreibung |
|---|---|
| data-buttonbgcolor |
Texteingabe Definiere die Farbe dieses Elements durch Verwendung von Text-, RGB-Code oder Hex-Code („red", „rgb(255,0,0)", „#EB4034") |
| data-buttontextcolor |
Texteingabe Definiere die Farbe dieses Elements durch Verwendung von Text-, RGB-Code oder Hex-Code („red", „rgb(255,0,0)", „#EB4034") |
| data-linkcolor |
Texteingabe Definiere die Farbe dieses Elements durch Verwendung von Text-, RGB-Code oder Hex-Code („red", „rgb(255,0,0)", „#EB4034") |
| data-primarytextcolor |
Texteingabe Definiere die Farbe dieses Elements durch Verwendung von Text-, RGB-Code oder Hex-Code („red", „rgb(255,0,0)", „#EB4034") |
| data-bgprimarycolor |
Texteingabe Definiere die Farbe dieses Elements durch Verwendung von Text-, RGB-Code oder Hex-Code („red", „rgb(255,0,0)", „#EB4034") |
| data-bgsecondarycolor |
Texteingabe Definiere die Farbe dieses Elements durch Verwendung von Text-, RGB-Code oder Hex-Code („red", „rgb(255,0,0)", „#EB4034") |
| data-bordercolor |
Texteingabe Definiere die Farbe dieses Elements durch Verwendung von Text-, RGB-Code oder Hex-Code („red", „rgb(255,0,0)", „#EB4034") |
| data-listitemhovercolor |
Texteingabe Definiere die Farbe dieses Elements durch Verwendung von Text-, RGB-Code oder Hex-Code („red", „rgb(255,0,0)", „#EB4034") |
| data-secondarytextcolor |
Texteingabe Definiere die Farbe dieses Elements durch Verwendung von Text-, RGB-Code oder Hex-Code („red", „rgb(255,0,0)", „#EB4034") |
Wenn du uns gerne Feedback geben möchtest (z. B. wenn etwas fehlt oder du einen Vorschlag hast), kontaktiere uns bitte!
Locator Widget Beispiel
Der folgende Locator Widget Code ist ein Beispiel, das alle verfügbaren Attribute enthält, obwohl nicht alle verwendet werden.
Code
<script src="https://uberall.com/assets/storeFinderWidget-v2.js" type="text/javascript"></script>
<div
id="store-finder-widget"
data-key="{{locator-data-key}}"
data-baseurl="https://uberall.com"
data-title="Locator + Pages"
data-logourl="{{logo-url}}"
data-locationpinurl="{{pin-url}}"
data-locationpinurl-business=""
data-locationpincolor=""
data-locationpinhovercolor=""
data-clustericoncolor=""
data-clustericonhovercolor=""
data-footertext="copyright (2020 Uberall)"
data-locationpageheader="map"
data-showfullwidth="false"
data-language=""
data-countries=""
data-askforlocationonload="true"
data-trackevents="true"
data-hideopennowfilter="false"
data-imperialunits="false"
data-filters="services"
data-filter-services=""
data-hidefilterbar="false"
data-showkeywords="false"
data-showcategories="true"
data-showlanguages="true"
data-showwebsite="true"
data-showlogo="true"
data-showsimilarlocations="true"
data-showservices="true"
data-showbrands="false"
data-showbacklink="true"
data-showreviews="true"
data-showpaymentmethods="false"
data-useidentifier="false"
data-showzipcity="true"
data-showfooter="true"
data-showheader="true"
data-showattribution="true"
data-showProductContentList="true"
data-showMenuContentList="true"
data-showEventContentList="true"
data-showCustomContentList="true"
data-showPeopleContentList="true"
data-buttonbgcolor="#3096DE"
data-buttontextcolor="white"
data-linkcolor="#3096DE"
data-primarytextcolor="#3C77B2"
data-bgprimarycolor="#FFFFFF"
data-bgsecondarycolor="#FFFFFF"
data-bordercolor="#FFFFFF"
data-listitemhovercolor="#FFFFFF"
data-secondarytextcolor="#FFFFFF"
data-primarycolumn-snippetcustomfieldkey="custom-primary"
data-secondarycolumn-snippetcustomfieldkey="custom-secondary"
></div>