Shopauskunft Widget: Einbauanleitung

Shopauskunft Widget Einbauanleitung: Lightspeed Shop

Erzeuge dein Widget im Händlercenter von Shopauskunft und kopiere den erzeugten Code.

<div id="shopauskunft-widget_wrapper">
    <script src="https://apps.shopauskunft.de/seal_defer/69ec05be54aecfd694121a6b8d59d0d9.js" defer="defer"></script>
</div>

Kopiere aus diesem Code den Link heraus und rufe diesen in einem Browserfenster auf.

https://apps.shopauskunft.de/seal_defer/69ec05be54aecfd694121a6b8d59d0d9.js

Da findest du dann einen Code in dieser Art. Jeder Widget-Code ist individuell für genau das von dir konfigurierte Widget.

var snippet = '<!-- Shopauskunft Widget --><div id="shopauskunft_widget"><a href="https://www.shopauskunft.de/review/www.redbar.de" target="_blank"><img src="https://apps.shopauskunft.de/widget/v5/seal.php?token=34b25b643754ce175ce4177b39e1bc92&w=160&cut_headline=0&cut_text=0&cut_count=0&cut_date=0" border="0" alt="ShopAuskunft.de Siegel" width="160" height="200" /></a></div>var snippet = '<!-- Shopauskunft Widget --><div id="shopauskunft_widget"><a href="https://www.shopauskunft.de/review/www.redbar.de" target="_blank"><img src="https://apps.shopauskunft.de/widget/v5/seal.php?token=34b25b643754ce175ce4177b39e1bc92&w=160&cut_headline=0&cut_text=0&cut_count=0&cut_date=0" border="0" alt="ShopAuskunft.de Siegel" width="160" height="200" /></a></div><!-- Shopauskunft Widget End -->';if (document.getElementById("shopauskunft-widget_wrapper")) {document.getElementById("shopauskunft-widget_wrapper").innerHTML = snippet}';if (document.getElementById("shopauskunft-widget_wrapper")) {document.getElementById("shopauskunft-widget_wrapper").innerHTML = snippet}

Daraus benötigst du den Code zwischen den beiden Kommentaren <!-- Shopauskunft Widget --> und <!-- Shopauskunft Widget End -->

Es bleibt also ein Code in dieser Form, den du gleich verwenden wirst:

<!-- Shopauskunft Widget --><div id="shopauskunft_widget"><a href="https://www.shopauskunft.de/review/www.redbar.de" target="_blank"><img src="https://apps.shopauskunft.de/widget/v5/seal.php?token=34b25b643754ce175ce4177b39e1bc92&w=160&cut_headline=0&cut_text=0&cut_count=0&cut_date=0" border="0" alt="ShopAuskunft.de Siegel" width="160" height="200" /></a></div><!-- Shopauskunft Widget End -->

Damit das Widget immer unten rechts in dem Browserfenster angezeigt wird, benötigst du noch CSS Style-Definitionen

<style scoped>
@media only screen and (min-width: 768px)  {
    div#shopauskunft_widget{
        display: block;
        position: fixed;
        right: 10px;
        bottom: 10px;
    }
}
</style>

Gehen nun in deinem Backend unter Einstellungen > Web Extras

Da kann man Javascript-Code einbinden.

Füge  hier nun beide Teile zusammen ein. Erst den CSS, dann den Javascript-Code.

<style scoped>
@media only screen and (min-width: 768px)  {
    div#shopauskunft_widget{
        display: block;
        position: fixed;
        right: 10px;
        bottom: 10px;
    }
}
</style>
<!-- Shopauskunft Widget --><div id="shopauskunft_widget"><a href="https://www.shopauskunft.de/review/www.redbar.de" target="_blank"><img src="https://apps.shopauskunft.de/widget/v5/seal.php?token=34b25b643754ce175ce4177b39e1bc92&w=160&cut_headline=0&cut_text=0&cut_count=0&cut_date=0" border="0" alt="ShopAuskunft.de Siegel" width="160" height="200" /></a></div><!-- Shopauskunft Widget End -->

Jetzt wird in deinem Shop das Shopauskunft-Widget angezeigt.

 


Hast du noch weitere Fragen? Wir stehen bereit zu helfen.