New oder Sale Overlay über Artikelbilder

Wenn man im normalen Produktlisting bei xt:commerce VEYTON einzelne Artikel hervorheben will kann man die mit kleinen Overlay Bilder (Ribbons) markieren und Sie fallen besser auf.
Dazu erstellt man erst einmal passen Bilder (Ribbons) mit dem Text New, Sale, Neu, Angebote oder Special.
Danach kann man in der Datei product_listing_v1.html folgenden Code an gewünschter Stelle einfügen:

{if $module_data.flag_has_specials} <img src="{$tpl_url_path}/img/ribbon-special.png" alt="" />; {/if} {if $module_data.date_available!=''} <img src="{$tpl_url_path}/img/ribbon-new.png" alt="" /> {/if}

Das ganze sollte innerhalb eine relativ positionierten Div Layer geschen. Danach kann man die Grafiken in der stylesheet.css absolute positionieren.

z.B.:

.ribbon { position:absolute; z-index:2; right:0px; top:0px; }

Das Ganze kann dann so aussehen:

ribbon

0 Kommentare

Dein Kommentar

Want to join the discussion?
Feel free to contribute!

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.