Standardmäßig wird die Badget-Grafik am rechten unteren Bildschirmrand angezeigt. Per CSS wird die Grafik mit einem Abstand von 2px vom rechten Bildschirmrand und 5px vom unteren Bildschirmrand positioniert. Es kann manchmal vorkommen, dass die Grafik mit ihren Standardwerten andere Objekte innerhalb Ihrer Website überlagert oder von anderen Objekten überlagert wird. Deshalb haben Sie die Möglichkeit, die Positionierung zu beeinflussen.
Der im Händlerbereich bereitgestellte JavaScript-Code zur Einbindung des Badgets beinhaltet die Funktion:
createBadget(myShopID, myBadgetType, mySrc)
Die Funktion createBadget
kann mit zusätlichen vier Parametern SpaceX
, SpaceY
, AlignH
und AlignV
erweitert werden, um die Position der Grafik zu beeinflussen:
createBadget(myShopID, myBadgetType, mySrc,[[SpaceX, SpaceY, [AlignH , AlignV]], DisplayWidth])
– SpaceX
entspricht dem Abstand in Pixeln vom rechten/linken Bildschirmrand
– SpaceY
entspricht dem Abstand in Pixeln vom unteren/oberen Bildschirmrand
– wird SpaceX
nicht angegeben, entspricht der Standardwert hierfür "right/left: 2px;"
– SpaceX
darf nicht kleiner als 2 sein
– SpaceY
darf nicht kleiner als 5 sein
– AlignH
gibt die horizontale Ausrichtung an (gültige Werte sind 'left'
oder 'right'
)
– AlignV
gibt die vertikale Ausrichtung an (gültige Werte sind 'top'
oder 'bottom'
)
– DisplayWidth
gibt die Display-Breite in Pixeln an, bis zu der die Badget-Grafik ausgeblendet wird.
– soll DisplayWidth
angegeben werden, die Parameter SpaceX
, SpaceY
, AlignH
und AlignV
aber mit den Default-Werten geladen werden, müssen die Parameter mit 0 bzw. leeren Werten übergeben werden (siehe Bsp. 6)
– werden AlignH
und AlignV
angegeben, müssen auch die Parameter SpaceX
und SpaceY
angeben werden (Sollen die Seitenabstände unverändert bleiben, können SpaceX
und SpaceY
mit 0 angegeben werden).
Fügen Sie also der Funktion die gewünschten Parameter hinzu, um die Position der Grafik zu beeinflussen. Lassen Sie aber den übrigen JavaScript-Code unverändert.
Anwendungsbeispiele:
1. createBadget(myShopID, myBadgetType, mySrc)
Die Parameter wurden nicht gesetzt. D.h., die Grafik wird mit den Default-Werten in einem Abstand von 5 Pixeln vom unteren Bildschirmrand und 2 Pixeln vom rechten Bildschirmrand angezeigt.
2. createBadget(myShopID, myBadgetType, mySrc, 100)
Der Parameter SpaceX
wurde nicht angegeben. Es wird der Default-Wert "right: 2px;"
verwendet. SpaceY
hat den Wert „100“. D.h., die Grafik wird mit einem Abstand von 100 Pixeln vom unteren Bildschirmrand und 2 Pixeln vom rechten Bildschirmrand angezeigt.
3. createBadget(myShopID, myBadgetType, mySrc, 100, 100)
Die Parameter SpaceX
und SpaceY
haben den Wert „100“. D.h., die Grafik wird mit einem Abstand von 100 Pixeln vom unteren Bildschirmrand und 100 Pixeln vom rechten Bildschirmrand angezeigt.
4. createBadget(myShopID, myBadgetType, mySrc, 0, 0, 'right', 'top')
Die Grafik wird mit einem Abstand von 5 Pixeln vom oberen (‚top‘) Bildschirmrand und 2 Pixeln vom rechten (‚right‘) Bildschirmrand angezeigt.
5. createBadget(myShopID, myBadgetType, mySrc, 25, 10, 'left', 'bottom')
Die Grafik wird mit einem Abstand von 25 Pixeln vom linken (‚left‘) Bildschirmrand und 10 Pixeln vom unteren (‚bottom‘) Bildschirmrand angezeigt.
6. createBadget(myShopID, myBadgetType, mySrc, 0, 0, '', '', 480)
Die Grafik wird mit den Default-Werten (siehe Bsp. 1) auf Displays mit einer Display-Breite > 480 Pixeln angezeigt. Ist die Display-Breite kleiner / gleich 480 Pixeln, wird die Grafik nicht angezeigt.
Posted in: Bewertungsgrafiken (allg.)