Neu Shop5 Plugin: Dezente Meldung statt großer Dialog "Artikel wurde dem Warenkorb hinzugefügt"

[fibergirl]

Nicht für jeden Shop und jede Branche ist die große modale Anzeige passend, dass der Artikel dem Warenkorb hinzugefügt wurde.
Vielleicht möchte man stattdessen ein flüssiges Kauferlebnis bieten, das dem Kunden nicht nach jedem Klick eine Entscheidung aufnötigt, ob er weiter einkaufen oder zum Warenkorb geleitet möchte.

Dieses kleine kostenlose Plugin ersetzt den Dialog auf der Produktdetailseite, den Produktlisten und in der Wunschliste durch eine "Snackbar", eine dezente Meldung am Bildschirmrand, die von allein wieder verschwindet und keine Aufmerksamkeit oder Reaktion erfordert.

Die Meldung richtet sich farblich nach dem Template.
Erscheinungsbild, Text, Ort und Dauer der Anzeige können aber noch weiter angepasst werden:




Die Idee zu diesem Plugin wurde inspiriert durch den "Snackbar"-Vorschlag von @FPrüfer von 2016.
Diese Version des Snackbar wurde mit dem Bootstrap4-Element "Toast" erstellt, und ist daher nur für ein NOVA (-Child) Template bestimmt, nicht für das EVO-Template.

Ich möchte mich an dieser Stelle für die Hilfe aus dem Forum, und insbesondere auch für alle Tipps und Anregungen bedanken!

Viele Grüße,
fibergirl

 

[ascsoft]

Hallo, Wie wird das Plugin Installiert ?

Wenn ich es in den Ordner /includes/plugins kopiere, bekomme ich die Meldung das das Plugin fehlerhaft ist.

lg
Micha

 

[NETZdinge.de]

Shop5 Plugins werden nur in /Pugins kopiert…

 

[ascsoft]

Danke, funktioniert jetzt.

Vielen Dank für das Plugin !!!!

 

[jürgenk]

Ich habe das Plug In mit dem Admorris Pro Template getestet und es funktioniert in dem Sinne das gar keine Anzeige mehr dargestellt wird. Gibt es eine Lösung für Templates von Fremd Anbietern?

 

[fibergirl]

Hallo @jürgenk ,

Templates von Fremdanbietern können ganz unterschiedlich sein.
Ich weiß rein gar nichts über das Admorris Pro Template. Habe auch keinen Zugriff darauf. Verwendet es auch Bootstrap4? Das wäre in diesem Fall Voraussetzung.

Am besten wäre es wohl, den Template-Hersteller zu bitten, das Plugin für Dich anzupassen (liegt ja im Klartext vor).
Beziehungsweise eine eigene entsprechende Option in sein Template einzubauen.

Gruß,
fibergirl

 

[2009Butch]

Hallo,
ich habe das Plugin installiert, aber leider wird jetzt gar kein Popup mehr angezeigt.
Das Plugin habe ich im Admin unter Plugins hochgeladen, ich bekomme auch keine Fehlermeldung und die Einstellung sind soweit ich das sehen kann richtig , also nicht Transparent und Anzeigedauer steht nicht auf 0. Irgendeine Idee was ich falsch gemacht haben könnte?

 

[SHAAN]

Nicht für jeden Shop und jede Branche ist die große modale Anzeige passend, dass der Artikel dem Warenkorb hinzugefügt wurde.
Vielleicht möchte man stattdessen ein flüssiges Kauferlebnis bieten, das dem Kunden nicht nach jedem Klick eine Entscheidung aufnötigt, ob er weiter einkaufen oder zum Warenkorb geleitet möchte.

Dieses kleine kostenlose Plugin ersetzt den Dialog auf der Produktdetailseite, den Produktlisten und in der Wunschliste durch eine "Snackbar", eine dezente Meldung am Bildschirmrand, die von allein wieder verschwindet und keine Aufmerksamkeit oder Reaktion erfordert.

Die Meldung richtet sich farblich nach dem Template.
Erscheinungsbild, Text, Ort und Dauer der Anzeige können aber noch weiter angepasst werden:

Den Anhang 58207 betrachten


Die Idee zu diesem Plugin wurde inspiriert durch den "Snackbar"-Vorschlag von @FPrüfer von 2016.
Diese Version des Snackbar wurde mit dem Bootstrap4-Element "Toast" erstellt, und ist daher nur für ein NOVA (-Child) Template bestimmt, nicht für das EVO-Template.

Ich möchte mich an dieser Stelle für die Hilfe aus dem Forum, und insbesondere auch für alle Tipps und Anregungen bedanken!

Viele Grüße,
fibergirl

MEGA MEGA MEGA !!! Danke @fibergirl

 

[net97]

Das Plugin ist ja echt klasse! Vielen Dank, genau das was ich gesucht habe.
Einen kleinen Schöhnheitsfehler gibt es bei mir allerdings: Wenn ich in der Galerieansicht einen Artikel in den Warenkorb hinzugefügt habe (mit Warenkorb-Button Plus), dann wird der Artikel ausgegraut und es erscheint ein rotierender Kreis über dem Artikel. Dieser geht auch nicht mehr weg. Ausser man lädt die Seite neu.
Hat jemand einen Tip?

 

[roots]

Hallo, vielen Dank für das Plugin! Richtig gut! Kaum zu glauben dass es so was dezentes nicht von Haus aus von JTL gibt.

Eine Nachfrage: kann es auch unterbunden werden, dass beim Klick auf "in den Warenkorb" auf einer Artikeldetailseite diese Seite neu geladen wird? Oder müssen wir da warten, bis JTL das Neuladen an der Stelle anders gestaltet?
In der Artikelübersicht (Liste) funktioniert es wunderbar.

 

[roots]

Einen kleinen Schöhnheitsfehler gibt es bei mir allerdings: Wenn ich in der Galerieansicht einen Artikel in den Warenkorb hinzugefügt habe (mit Warenkorb-Button Plus), dann wird der Artikel ausgegraut und es erscheint ein rotierender Kreis über dem Artikel. Dieser geht auch nicht mehr weg. Ausser man lädt die Seite neu.

Wir versuchen, das Warenkorb-Button Plus Plugin zum laufen zu bringen, das klappt allerdings bisher noch nicht. Daher kann ich (noch) nicht sagen, ob wir dieses Problem auch haben.

 

[SHAAN]

Wir versuchen, das Warenkorb-Button Plus Plugin zum laufen zu bringen, das klappt allerdings bisher noch nicht. Daher kann ich (noch) nicht sagen, ob wir dieses Problem auch haben.

Kann ich nicht bestätigen. Bei uns funktioniert es auch in der Galerieansicht. JTL Shop 5.1.5

 

[fibergirl]

Liebe Leute,

da hier verschiedene Fragen und Wünsche zum Plugin aufgelaufen sind:
ich habe derzeit keinen Zugriff auf einen JTL- Shop, und sehe daher momentan keine Möglichkeit, Änderungen und Anpassungen an dem Plugin vorzunehmen.

Das Plugin steht hier aber im Quelltext zum Herunterladen bereit.
Ich hätte kein Problem damit, wenn jemand, ob Servicepartner oder nicht, das Plugin nimmt, überarbeitet und unter eigenem Namen wieder veröffentlicht!
Ob es jetzt um das Funktionieren in der Galerieansicht geht ("zu meiner Zeit" gabs da gar keinen Kaufbutton) oder eine verbesserte Kompatibilität zu anderen Plugins oder Templates.
Ich würde mich freuen, wenn es auf diese Weise noch etwas nützlicher wird.

Viele Grüße,
fibergirl

 

[recent.digital]

Liebe Leute,

da hier verschiedene Fragen und Wünsche zum Plugin aufgelaufen sind:
ich habe derzeit keinen Zugriff auf einen JTL- Shop, und sehe daher momentan keine Möglichkeit, Änderungen und Anpassungen an dem Plugin vorzunehmen.

Das Plugin steht hier aber im Quelltext zum Herunterladen bereit.
Ich hätte kein Problem damit, wenn jemand, ob Servicepartner oder nicht, das Plugin nimmt, überarbeitet und unter eigenem Namen wieder veröffentlicht!


Viele Grüße,
fibergirl

Wir schauen uns das morgen im Team mal an und helfen gerne, sofern (zeitlich) machbar. Das 5.2 Update steht ja auch vor der Tür.

Richtig guter Community-Ansatz. ❤️

 

[roots]

Kann ich nicht bestätigen. Bei uns funktioniert es auch in der Galerieansicht. JTL Shop 5.1.5

Ich muss hier noch etwas klar stellen:

Uns ging es um das Funktionieren von diesen zwei Plugins miteinander:

• Warenkorb-Mitteilung als Snackbar (aus diesem Thread) und
• Warenkorb-Button Plus von knowmates.de
  • https://www.jtl-software.de/extensi...us-minus-einklick-warenkorb-button-jtl-shop-5
  • https://forum.jtl-software.de/threa...n-plus-fuer-jtl-shop-4-und-jtl-shop-5.168138/

Leider sind diese noch nicht kompatibel. Jeweils für sich funktionieren sie, doch wenn beide aktiv sind verschwinden die Buttons aus der Galerieansicht, es steht nur noch "In den Warenkorb", nicht klickbar. Die Snackbar popups funktionieren weiter.
Ich war in Kontakt mit dem support von knowmates diesbezüglich und dieser war sehr freundlich und hilfsbereit, konnte in dem Rahmen aber das Problem nicht lösen, da die Verbesserung eher am snackbar Plugin geschehen sollten.

Einen teilweise hilfreichen Vorschlag hatten sie dennoch: unten stehende Veränderung am Code. Das führt dazu, dass "In den Warenkorb" klickbar geworden ist, die Mengen Schaltflächen fehlen aber weiter und der Button wird weiter nicht korrekt dargestellt (nur als Text).
Wenn sich @RECENTmarketing oder andere das Plugin genauer anschauen, ist das vielleicht ein guter Start. Unser Entwickler schafft es vermutlich nicht mehr vor unserem Shop Upgrade diese Sache genauer anzuschauen.

in der Datei ....../aha_basket_snackbar/frontend/js/snackbar.js
zwischen

$(document).bind('evo:loaded.io.request', function(data, status) {

und

if ((status.req.name == 'pushToBasket') && (status.status == 'success')) {

folgende Zeile einzufügen.

$('.product-wrapper').removeClass('loading');

Und noch screenshots: einmal mit deaktivierter snackbar, einmal mit aktivierter snackbar.
Wichtig: aktuell muss in den Warenkorb-Button Plus Einstellungen die Option "Nur bei mouse-over anzeigen" deaktiviert sein, wird im nächsten Update des Plugins verbessert.

 

[SHAAN]

Moin @roots ,

hier eine mögliche Lösung um es in der Galerieansicht ausgeben zu lassen.

Im Anhang habe ich dir die Datei item_box.tpl angehängt. Die Datei einfach unter /templates/MEINS/productlist einfügen und dann die gewünschten css Anpassungen über den JTL Theme Editor machen.

Das sind unsere Anpassungen in der my-nova.scss die du vermutlich nur zum Teil benötigst:

// Produkt List
  
    .productbox-inner .item-list-basket-details {
        margin-top: 0;
    }
  
    #product-list .product-wrapper {
        //border: 7px solid #f7f5f0;
        //margin-bottom: 0rem !important;
        //background: white;
    }
  
    #product-list .product-wrapper:not(:last-child) {
        margin-bottom: 1rem;
    }
  
    .productbox-inner .productbox-options {
        min-height: 10rem;
    }
 
  
    .productbox.productbox-hover:hover .productbox-inner::before {
        bottom: 0rem;
        //left: -1.3rem;
       // right: -1.3rem;
       // top: -1.3rem;
        box-shadow: 0 0 1.5rem rgba(0, 0, 0, 0.4);
    } 
  
    .productbox.productbox-hover:hover .productbox-ribbon.ribbon {
        //top: 0.5rem;
       // left: -1.8rem;
        //transition: all 0.0s ease-in-out;
    }
 
    .productbox-inner .productbox-title {
        height: 4.2rem;
    }
  
    .productbox-inner .item-delivery-status {
        margin-bottom: 0;
    }
 
    .productbox-inner .rating {
        position: absolute;
        margin-top: -1.2rem;
    }
 
    .productbox-title a {
        text-decoration: none;
        font-weight: 900;
        font-size: 1rem;
        margin-top: 5px;
        margin-bottom: 5px;
        color: $secondary;
    }
  
    .productbox-ribbon.ribbon {
        left: -1.5rem;
    }
  
    .productbox.productbox-hover .productbox-inner::before {
       // transition: 0.1s cubic-bezier(.68,-0.55,.27,1.55);
    }
   
    .productbox-options .delivery-status .status-0::before {
        background: #b90000;
        border-radius: 35%;
        content: "•••";
        font-size: 0.7rem;
        color: #b90000;
        margin-right: 5px;
    }
  
    .productbox-options .delivery-status .status-0 {
        font-size: 0.7rem;
        text-transform: uppercase;
    }
 
    .productbox-options .delivery-status .status-1::before {
        background: #f39932;
        border-radius: 35%;
        content: "•••";
        font-size: 0.7rem;
        color: #f39932;
        margin-right: 5px;
    }
  
    .productbox-options .delivery-status .status-1 {
        font-size: 0.7rem;
        text-transform: uppercase;
    }
  
    .productbox-options .delivery-status .status-2::before {
        background: #1C871E;
        border-radius: 35%;
        content: "•••";
        font-size: 0.7rem;
        color: #1C871E;
        margin-right: 5px;
    }
  
    .productbox-options .delivery-status .status-2 {
        font-size: 0.7rem;
        text-transform: uppercase;
    }
  
  
    .base_price {
        font-size: 0.7rem;
        font-weight: 400;
        font-family: "Comfortaa", "Open Sans", sans-serif;
        line-height: 0.7rem;
    }
  
  
    .basket-details-add-to-cart {
        margin-bottom: 1rem;
    }

 

[roots]

Vielen Dank, Shaan!

Wir haben die Änderungen für die Galerieansicht übernommen. So kommen wir allein mit dem snackbar Plugin zurecht, das glücklicherweise auch mit PHP 8.0 funktioniert.
Das Warenkorb Button Plus benötigen wir so nicht, war auch nicht kompatibel.

Ein paar weitere Anpassungen bei diesem Themenbereich werden wir noch angehen, die haben wir vor dem Upgrade auf Shop 5 nicht mehr geschafft.

• Höhenverschiebungen in der Galerieansicht, vor allem in der mobilen Ansicht (wenn Artikelname und Infos unterschiedlich viele Zeilen ergeben; Unterschied ob Variationen verfügbar)
• Hinzufügen der Funktion zu den "Product slidern"
• Button Animation: nach Klick zu Häckchen, wie es in der Artikeldetailansicht passiert
• Neuladen der Artikeldetailseite bei Klick auf in Warenkorb umgehen

Gerne könnt ihr euch an uns wenden, wenn ihr unsere Anpassungen übernehmen wollt (sobald sie fertig sind).

Hier der Link zum Shop zur Ansicht: https://www.rootsofcompassion.org/

 

[wawi-dl]

wenn das noch mit Snacky Template kompatibel wäre

@eRock Marketing wäre super wenn ihr das implementieren würdet

 

[eRock Marketing]

@wawi-dl Wie meinst du das?
Im Snackys arbeitet das ja bewusst schon seit eh und je anders.
Wir arbeiten mit einem Sidebasket der dann aufklappt (und simpel per Klick auf X oder restliche Fläche direkt wieder geschlossen wird).

Die "Übergroßen Meldungen" haben wir demnach gar nicht

 

[fibergirl]

@roots
Hach, ein "Zur Kasse" Link direkt im Snackbar! 😊 Ist das schön!

Darauf war ich damals nicht gekommen.
Als weitere Einstellung im Plugin: Optional ein Link "Zur Kasse", "Zum Warenkorb", oder gar keiner.
Naja, vielleicht bauts ja noch mal jemand ein 😉

LG, fibergirl