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.