[quote=“sschreier”][quote=“frank73”][quote] Geilo, das wars mit z-index: 501; passt es. Wieder etwas dazugelernt, danke! 
LG[/quote] Hallo, habe nun deinen Code unten an das “box-basic.tpl” angehängt und in meinem Theme hochgeladen. Wie gesagt ich bin ein blutiger Anfänger 
kann mir jemand mal den genauen Pfad nennen in den nun der CSS Code eingefügt werden muss und auch das Gif? Vielen Dank und Gruß Frank[/quote] Hallo Frank, Grafiken am Besten dort ablegen: themes/Frontend/DEINTHEME/frontend/_public/src/img LESS-Dateien am Besten dort ablegen: themes/Frontend/DEINTHEME/frontend/_public/src/less Bzgl. einer LESS-Datei: erstelle dazu am besten eine Datei “all.less”, welche alle anderen LESS-Datei importiert. Für deine eigenen Styles importierst du bspw. styles.css (Name frei wählbar): @import 'styles'; In der styles.less - Datei: div.ico\_sold { background: url("frontend/\_public/src/img/icon.png") repeat scroll 0 0; } Beste Grüße Sebastian[/quote] Ich werde noch verrückt! :wtf: Das sold.gif habe ich in den Ordner gelegt und in die main-navigation.less, die sich im Unterordner _modules befindet dann ganz unten das CSS eingefügt. Hier noch einmal den Code dazu: [quote]div.ico_sold { -moz-background-clip: border; -moz-background-origin: padding; -moz-background-size: auto auto; background-attachment: scroll; background-color: transparent; background-image: url(…/images/sold.gif); background-position: 0 0; background-repeat: no-repeat; display: block; height: 100px; left: 0; position: absolute; top: 0; width: 100px; z-index: 501; }[/quote] Aber das Gif wird nicht angezeigt! Warum??? Helft einem verzweifelten User!
[quote=“frank73”] Ich werde noch verrückt! :wtf: Das sold.gif habe ich in den Ordner gelegt und in die main-navigation.less, die sich im Unterordner _modules befindet dann ganz unten das CSS eingefügt. Hier noch einmal den Code dazu: [quote]div.ico_sold { -moz-background-clip: border; -moz-background-origin: padding; -moz-background-size: auto auto; background-attachment: scroll; background-color: transparent; background-image: url(…/images/sold.gif); background-position: 0 0; background-repeat: no-repeat; display: block; height: 100px; left: 0; position: absolute; top: 0; width: 100px; z-index: 501; }[/quote] Aber das Gif wird nicht angezeigt! Warum??? Helft einem verzweifelten User! :)[/quote] Nutze am besten die Struktur, die ich dir aufgelistet habe. Wozu die main-navigation.less nutzen? Erstell doch deine eigene LESS-Datei in dem nachfolgenden Pfad. Heisst dein Image-Ordner dort auch images und nicht img? Grafiken am Besten dort ablegen: themes/Frontend/DEINTHEME/frontend/_public/src/img LESS-Dateien am Besten dort ablegen: themes/Frontend/DEINTHEME/frontend/_public/src/less Bzgl. der LESS-Dateien: erstelle dazu am besten eine Datei “all.less”, welche alle anderen LESS-Datei importiert. Für deine eigenen Styles importierst du bspw. styles.css (Name frei wählbar): @import 'styles'; In der styles.less - Datei: div.ico\_sold { -moz-background-clip: border; -moz-background-origin: padding; -moz-background-size: auto auto; background-attachment: scroll; background-color: transparent; background-image: url("../img/icon.png"); background-position: 0 0; background-repeat: no-repeat; display: block; height: 100px; left: 0; position: absolute; top: 0; width: 100px; z-index: 501; } Beste Grüße Sebastian
[quote]Aber das Gif wird nicht angezeigt! Warum???[/quote] Schau dir mal das css an und die Datei, die angezeigt werden soll. Ich vermute, dass der Pfad schlichtweg falsch ist. Relativ zum less Ordner, sollte der Bilder Ordner so lauten: …/…/imgages/sold.gif Viele Grüße
[quote=„sschreier“][quote=„frank73“] Ich werde noch verrückt! :wtf: Das sold.gif habe ich in den Ordner gelegt und in die main-navigation.less, die sich im Unterordner _modules befindet dann ganz unten das CSS eingefügt. Hier noch einmal den Code dazu: [quote]div.ico_sold { -moz-background-clip: border; -moz-background-origin: padding; -moz-background-size: auto auto; background-attachment: scroll; background-color: transparent; background-image: url(…/images/sold.gif); background-position: 0 0; background-repeat: no-repeat; display: block; height: 100px; left: 0; position: absolute; top: 0; width: 100px; z-index: 501; }[/quote] Aber das Gif wird nicht angezeigt! Warum??? Helft einem verzweifelten User! :)[/quote] Nutze am besten die Struktur, die ich dir aufgelistet habe. Wozu die main-navigation.less nutzen? Erstell doch deine eigene LESS-Datei in dem nachfolgenden Pfad. Heisst dein Image-Ordner dort auch images und nicht img? Grafiken am Besten dort ablegen: themes/Frontend/DEINTHEME/frontend/_public/src/img LESS-Dateien am Besten dort ablegen: themes/Frontend/DEINTHEME/frontend/_public/src/less Bzgl. der LESS-Dateien: erstelle dazu am besten eine Datei „all.less“, welche alle anderen LESS-Datei importiert. Für deine eigenen Styles importierst du bspw. styles.css (Name frei wählbar): @import 'styles'; In der styles.less - Datei: div.ico\_sold { -moz-background-clip: border; -moz-background-origin: padding; -moz-background-size: auto auto; background-attachment: scroll; background-color: transparent; background-image: url("../img/icon.png"); background-position: 0 0; background-repeat: no-repeat; display: block; height: 100px; left: 0; position: absolute; top: 0; width: 100px; z-index: 501; } Beste Grüße Sebastian[/quote] Hallo Sebastian, lach… es funktioniert einfach nicht! Ich habe schon ein all.less Datei und ich habe dort, so wie geschrieben, den Code eingegeben. anschließend eine styles.less Datei erstellt deinen Code eingefügt und in das genannte Verzeichnis (gleiche Ebene wie die all.less) hochgeladen. Themes kompiliert und Cache geleert! Geht nicht! Ach ja, natürlich habe ich auch vorab die Grafik im Link in „sold.gif“ geändert. bei dir stand ja was von png. Noch ne Idee???
[quote=“frank73”] Hallo Sebastian, lach… es funktioniert einfach nicht! Ich habe schon ein all.less Datei und ich habe dort, so wie geschrieben, den Code eingegeben. anschließend eine styles.less Datei erstellt deinen Code eingefügt und in das genannte Verzeichnis (gleiche Ebene wie die all.less) hochgeladen. Themes kompiliert und Cache geleert! Geht nicht! Ach ja, natürlich habe ich auch vorab die Grafik im Link in “sold.gif” geändert. bei dir stand ja was von png. Noch ne Idee??? :)[/quote] Hallo Frank, schick mir bitte mal die Shop-URL per Nachricht, dann guck ich mir das mal live an, das geht schneller und einfacher. Beste Grüße Sebastian
Jetzt hat es endlich geklappt! Scheint die URL zum Bild gewesen zu sein! DANKE!!! Gruß Frank
[quote=“sschreier”][quote=“frank73”] Hallo Sebastian, lach… es funktioniert einfach nicht! Ich habe schon ein all.less Datei und ich habe dort, so wie geschrieben, den Code eingegeben. anschließend eine styles.less Datei erstellt deinen Code eingefügt und in das genannte Verzeichnis (gleiche Ebene wie die all.less) hochgeladen. Themes kompiliert und Cache geleert! Geht nicht! Ach ja, natürlich habe ich auch vorab die Grafik im Link in “sold.gif” geändert. bei dir stand ja was von png. Noch ne Idee??? :)[/quote] Hallo Frank, schick mir bitte mal die Shop-URL per Nachricht, dann guck ich mir das mal live an, das geht schneller und einfacher. Beste Grüße Sebastian[/quote] Noch eine letzte Frage! Was muss ich am Code verändern, damit die “ausverkauft” Grafik auch nur dann angezeigt wird, wenn der gesamte Artikel incl. Varianten auf 0 steht? Jetzt wird die Grafik auch angezeigt, wenn nur eine meiner Varianten auf 0 steht. Gruß Frank
[quote=„frank73“][quote=„sschreier“][quote=„frank73“] Hallo Sebastian, lach… es funktioniert einfach nicht! Ich habe schon ein all.less Datei und ich habe dort, so wie geschrieben, den Code eingegeben. anschließend eine styles.less Datei erstellt deinen Code eingefügt und in das genannte Verzeichnis (gleiche Ebene wie die all.less) hochgeladen. Themes kompiliert und Cache geleert! Geht nicht! Ach ja, natürlich habe ich auch vorab die Grafik im Link in „sold.gif“ geändert. bei dir stand ja was von png. Noch ne Idee??? :)[/quote] Hallo Frank, schick mir bitte mal die Shop-URL per Nachricht, dann guck ich mir das mal live an, das geht schneller und einfacher. Beste Grüße Sebastian[/quote] Noch eine letzte Frage! Was muss ich am Code verändern, damit die „ausverkauft“ Grafik auch nur dann angezeigt wird, wenn der gesamte Artikel incl. Varianten auf 0 steht? Jetzt wird die Grafik auch angezeigt, wenn nur eine meiner Varianten auf 0 steht. Gruß Frank[/quote] Genau das Problem habe ich auch noch. Sobald die Hauptvariante auf 0 fällt, wird der gesamte Artikel als ausverkauft gekennzeichnet, obwohl ja alle anderen Varianten noch auf Lager sind. An einer Lösung wäre ich auch interessiert.
Hallo, [quote=“frank73”] Noch eine letzte Frage! Was muss ich am Code verändern, damit die “ausverkauft” Grafik auch nur dann angezeigt wird, wenn der gesamte Artikel incl. Varianten auf 0 steht? Jetzt wird die Grafik auch angezeigt, wenn nur eine meiner Varianten auf 0 steht. Gruß Frank[/quote] Ich glaube da gibt es vom Standard her keine Möglichkeit, die Varianten auch mit einzubeziehen. [quote=“trixx”] Genau das Problem habe ich auch noch. Sobald die Hauptvariante auf 0 fällt, wird der gesamte Artikel als ausverkauft gekennzeichnet, obwohl ja alle anderen Varianten noch auf Lager sind. An einer Lösung wäre ich auch interessiert.[/quote] Erst einmal kann man ja in der Variantenverwaltung innerhalb des Artikels die Variante festlegen (Vorauswahl), die die Standard-Variante beim Artikelaufruf sein soll. Somit kann man ja bei einer “ausverkauften” Hauptartikelvariante eine andere Variante als Vorauswahl festlegen. Beste Grüße Sebastian
[quote=„sschreier“]Hallo, [quote=„frank73“] Noch eine letzte Frage! Was muss ich am Code verändern, damit die „ausverkauft“ Grafik auch nur dann angezeigt wird, wenn der gesamte Artikel incl. Varianten auf 0 steht? Jetzt wird die Grafik auch angezeigt, wenn nur eine meiner Varianten auf 0 steht. Gruß Frank[/quote] Ich glaube da gibt es vom Standard her keine Möglichkeit, die Varianten auch mit einzubeziehen. [quote=„trixx“] Genau das Problem habe ich auch noch. Sobald die Hauptvariante auf 0 fällt, wird der gesamte Artikel als ausverkauft gekennzeichnet, obwohl ja alle anderen Varianten noch auf Lager sind. An einer Lösung wäre ich auch interessiert.[/quote] Erst einmal kann man ja in der Variantenverwaltung innerhalb des Artikels die Variante festlegen (Vorauswahl), die die Standard-Variante beim Artikelaufruf sein soll. Somit kann man ja bei einer „ausverkauften“ Hauptartikelvariante eine andere Variante als Vorauswahl festlegen. Beste Grüße Sebastian[/quote] Ja schon klar, so mache ich es ja auch momentan. Ist aber ja auch irgendwie keine richtige Lösung. Wenn die Hauptvariante auf 0 fällt, bekommt man es ja nicht gleich sofort mit, sondern erst wenn der Cron wieder durchgelaufen ist. Für den Zeitraum, bis man das dann geändert hat, wird erstmal die Ausverkauft-Grafik angezeigt. Wäre super wenn man da etwas machen kann oder ist das nur mit hohem Programmieraufwand möglich?
[quote=“sschreier”] Erst einmal kann man ja in der Variantenverwaltung innerhalb des Artikels die Variante festlegen (Vorauswahl), die die Standard-Variante beim Artikelaufruf sein soll. Somit kann man ja bei einer “ausverkauften” Hauptartikelvariante eine andere Variante als Vorauswahl festlegen. Beste Grüße Sebastian[/quote] [quote=“trixx”] Ja schon klar, so mache ich es ja auch momentan. Ist aber ja auch irgendwie keine richtige Lösung. Wenn die Hauptvariante auf 0 fällt, bekommt man es ja nicht gleich sofort mit, sondern erst wenn der Cron wieder durchgelaufen ist. Für den Zeitraum, bis man das dann geändert hat, wird erstmal die Ausverkauft-Grafik angezeigt. Beste Grüße [/quote] Hallo, gibt es da mittlerweile vielleicht schon eine bessere Lösung? Lg
[quote=„Vitago GmbH“][quote=„sschreier“] Erst einmal kann man ja in der Variantenverwaltung innerhalb des Artikels die Variante festlegen (Vorauswahl), die die Standard-Variante beim Artikelaufruf sein soll. Somit kann man ja bei einer „ausverkauften“ Hauptartikelvariante eine andere Variante als Vorauswahl festlegen. Beste Grüße Sebastian[/quote] [quote=„trixx“] Ja schon klar, so mache ich es ja auch momentan. Ist aber ja auch irgendwie keine richtige Lösung. Wenn die Hauptvariante auf 0 fällt, bekommt man es ja nicht gleich sofort mit, sondern erst wenn der Cron wieder durchgelaufen ist. Für den Zeitraum, bis man das dann geändert hat, wird erstmal die Ausverkauft-Grafik angezeigt. Beste Grüße [/quote] Hallo, gibt es da mittlerweile vielleicht schon eine bessere Lösung? Lg[/quote] Hallo, leider nein, wäre ich aber auch nach wie vor dran interessiert. Gruß Gesendet von meinem MX4 mit Tapatalk
Hi @trixx, Schade, aber danke für die Info. Habt ihr das auch, dass wenn man “Artikel hervorheben” aktiviert oder bei Rabatt Artikeln sich das Bild “Ausverkauft” mit den anderen überschneidet? Lg
[quote=“Vitago GmbH”]Hi @trixx, Schade, aber danke für die Info. Habt ihr das auch, dass wenn man “Artikel hervorheben” aktiviert oder bei Rabatt Artikeln sich das Bild “Ausverkauft” mit den anderen überschneidet? Lg[/quote] Hi, das hatte ich Anfangs auch. Schau mal in diesem Thread auf Seite zwei. Das ganze lässt sich über den z-index in der .less steuern. Gruß Gesendet von meinem MX4 mit Tapatalk
[quote=“trixx”][quote=“Vitago GmbH”]Hi @trixx, Schade, aber danke für die Info. Habt ihr das auch, dass wenn man “Artikel hervorheben” aktiviert oder bei Rabatt Artikeln sich das Bild “Ausverkauft” mit den anderen überschneidet? Lg[/quote] Hi, das hatte ich Anfangs auch. Schau mal in diesem Thread auf Seite zwei. Das ganze lässt sich über den z-index in der .less steuern. Gruß Gesendet von meinem MX4 mit Tapatalk[/quote] Danke, aber das hatte ich schon versucht, damit verschiebe ich nur das Artikelbild. Und “TIPP!” überlagert immer noch das Bild “Ausverkauft” Lg
[quote=“Vitago GmbH”][quote=“trixx”][quote=“Vitago GmbH”]Hi @trixx, Schade, aber danke für die Info. Habt ihr das auch, dass wenn man “Artikel hervorheben” aktiviert oder bei Rabatt Artikeln sich das Bild “Ausverkauft” mit den anderen überschneidet? Lg[/quote] Hi, das hatte ich Anfangs auch. Schau mal in diesem Thread auf Seite zwei. Das ganze lässt sich über den z-index in der .less steuern. Gruß Gesendet von meinem MX4 mit Tapatalk[/quote] Danke, aber das hatte ich schon versucht, damit verschiebe ich nur das Artikelbild. Und “TIPP!” überlagert immer noch das Bild “Ausverkauft” Lg[/quote] Ach so, ja stimmt. Mit dem z-index hatte ich damals die Ausverkauftgrafik weiter nach vorne geholt, da die Grafik vom Artikelbild überlagert wurde. Denn Fall dass sich das ganze mit den Hervorhebungen überlagert hatte ich bisher noch nicht, also es ist noch nicht zu dieser Konstellation gekommen. Solange man aber die Ausverkauftgrafik auf der linken Seite ausgibt, wird sich wohl immer was überlagern. Dann müsste man die Grafik evtl. links unten oder auf der rechten Seite ausgeben lassen, da sollte sich dann ja eigentlich nichts in die Quere kommen!? Bzw. mittig würde auch gut passen, mit entsprechender Grafik. LG Gesendet von meinem MX4 mit Tapatalk
[quote=“trixx”] Ach so, ja stimmt. Mit dem z-index hatte ich damals die Ausverkauftgrafik weiter nach vorne geholt, da die Grafik vom Artikelbild überlagert wurde. [/quote] War bei mir das gleiche, und hab das Problem auch mit dem z-index behoben. [quote]Dann müsste man die Grafik evtl. links unten oder auf der rechten Seite ausgeben lassen, da sollte sich dann ja eigentlich nichts in die Quere kommen!? Bzw. mittig würde auch gut passen, mit entsprechender Grafik. LG [/quote] Darauf hätte ich auch selbst kommen können. :oops: Danke für deine Hilfe. Lg
So, habe die Grafik damit man die auch auf der rechten Seite verwenden kann angepasst. Falls es jemand braucht Grafik Ausverkauft Jetzt müsst ihr nur noch die Grafik tauschen und folgendes ändern: div.ico_sold { left: 0; ändern in right: 0; Durch die Änderung wird die Grafik “Ausverkauft” nicht mehr durch die Grafik “TIPP!” und “Prozent” überlagert. Lg
Statt das ganze mit einer Grafik zu machen und alles sehr umständlich anzupassen, würde ich das ganze einfach mit CSS umsetzen. Habe hier einmal ein Codepen Beispiel gemacht: http://codepen.io/kayyy/pen/jWwawv Bedenkt eben auch, das die Grafiken angepasst werden müssen bei Tablets, Mobile etc.
[quote=“kayyy”]Statt das ganze mit einer Grafik zu machen und alles sehr umständlich anzupassen, würde ich das ganze einfach mit CSS umsetzen. Habe hier einmal ein Codepen Beispiel gemacht: http://codepen.io/kayyy/pen/jWwawv Bedenkt eben auch, das die Grafiken angepasst werden müssen bei Tablets, Mobile etc.[/quote] Hab ich mal probiert, aber will nicht so ganz. Bei einem Artikel wird es korrekt dargestellt bei dem daneben nicht? Siehe Screen Mein Code der box-basic.tpl [code]{extends file=“parent:frontend/listing/product-box/box-basic.tpl”} {block name=‘frontend_listing_box_article_badges’ prepend} {if $sArticle.instock == 0}
AUSVERKAUFT
{/if} {/block}[/code] Und CSS: /\* Artikel ausverkauft Grafik \*/ .ico\_sold { top: 30px; right: -40px; position: absolute; z-index: 750; color: white; background: red; padding: 3px 40px; transform: rotate(45deg); } Wieso funzt das denn nur beim rechten Artikel? LG