Neu Shop5: klick auf leeren Warenkorb ist etwas verwirrend

Conny

Sehr aktives Mitglied
7. September 2009
571
61
Wenn man auf den leeren Warenkorb oben rechts klickt, wird der Content ausgegraut und es erscheint eine Meldung dass sich nichts im Warenkorb befindet.
Je nach Template Anpassung fällt diese Meldung überhaupt nicht auf und der Kunde weiß nicht was er tun soll.

Ich würde es schöner finden wenn die Meldung in einem sep. Fenster zentriert in der Mitte mit einen Bestätigungsbutton wäre.

Vielleich hat auch jemand eine Idee wie man das so umsetzen könnte.

YtKnVZRfld.png
 

felix.bauerschaefer

Sehr aktives Mitglied
15. November 2019
235
34
Per Icon wäre das am besten umzusetzen, statt eines Vollen Warenkorbes einen leeren. Daneben den Text, beim leeren Warenkorb Leer anzuzeigen, dabei bleiben dem Kunden keine fragen mehr offen.

Beispielsweiße mit FontAwesome 6 könnte das so aussehen:
Leer: https://fontawesome.com/v6.0/icons/cart-xmark?s=solid natürlich kann man daran noch feilen und entsprechend Farblich die Icons markieren rot für Leer.
Enthält Dinge: https://fontawesome.com/v6.0/icons/cart-circle-exclamation?s=solid Grün, blau, Signalfarbe für vollen Warenkorb.

Dafür müsste man einfach ne {if} Smarty Abfrage für den Block hinterlegen, falls du nicht genau weißt wie das geht würde ich mich an einen Servicepartner wenden. Upps. nicht das Alter des Accountes bemerkt, schau mal in den Layout. tpl Daten.
Ich würde es schöner finden wenn die Meldung in einem sep. Fenster zentriert in der Mitte mit einen Bestätigungsbutton wäre.
Pop-ups und zentrierte Meldungen sind zwar toll um die Aufmerksamtkeit auf etwas zu lenken, doch stören meist die UX. Zwar weniger verhasst wie zum Anfang, doch trotzdem jetzt nicht förderlich dafür das die Leute auf der Seite bleiben. Diese Meldungen sind mMn. eher selten einzusetzen, bei Bedarf nicht ständig im normalen Gebrauch.
 
Zuletzt bearbeitet:

Conny

Sehr aktives Mitglied
7. September 2009
571
61
Hi,
danke für deine tolle Unterstützung.
Habe das auch soweit hinbekomen in /basket/cart_dropdown_label,tpl kann man die "IF" Abfrage einbauen und ein anderes Icon anzeigen.
In cart_dropdown.tpl kann man die Meldung rausnehmen.
Nur was ich nicht geschafft habe ist, den ausgegrauten Content weg zu nehmen.
Hast du dafür eine Idee ?
 

felix.bauerschaefer

Sehr aktives Mitglied
15. November 2019
235
34
Ich glaube das ist eine CSS/JS Änderung notwendig, da hier entweder ein CSS Filter gesetzt wird Standardmäßig vom Nova-Template. Inzspiziere mal das Element, schau mal wie genau der Effekt von statten geht entweder es wie o.b. über einen Filter-Effekt, oder ist eine CSS pseudoklasse ::active. Dann müsste über den Template Editor ein SCSS änderung vorgenommen werden. Andernfalls müsste man die Standardmäßige jtl.nova.js befragen und schauen wo genau da die verdunkelung stattfindet. Bin mir zu 70% Sicher das ist eine CSS änderung, solltest du die vornehmen auch die Critical CSS überprüfen ansonsten wird diese nachgeladen.
 
Zuletzt bearbeitet:

Conny

Sehr aktives Mitglied
7. September 2009
571
61
Hi,
da ich das nicht sauber lösen konnte, habe ich es etwas herkömmlich gelöst. Schön wäre es, wenn JTL da was in Zukunft ändern könnte.
Denke, dass das vielleicht noch mehrere Menschen nicht so richtig gefällt.
Vielleicht hat ja auch noch jeamand eine bessere Idee!


Ich habe jetzt wie folgt modifiziert:
Datei: /nova/basket/cart_dropdown_label.tpl
Block: basket-cart-dropdown-label-link

Original:
HTML:
{block name='basket-cart-dropdown-label-link'}
            {link class='nav-link' aria=['expanded' => 'false', 'label' => {lang key='basket'}] data=['toggle' => 'dropdown']}
                {block name='basket-cart-dropdown-label-count'}
                    <i class='fas fa-shopping-cart cart-icon-dropdown-icon'>
                        {if $WarenkorbArtikelPositionenanzahl >= 1}
                        <span class="fa-sup" title="{$WarenkorbArtikelPositionenanzahl}">
                            {$WarenkorbArtikelPositionenanzahl}
                        </span>
                        {/if}
                    </i>
                {/block}
                {block name='basket-cart-dropdown-labelprice'}
                    <span class="cart-icon-dropdown-price">{$WarensummeLocalized[0]}</span>
                {/block}
            {/link}
        {/block}


Neu:
HTML:
{block name='basket-cart-dropdown-label-link'}
            {if $WarenkorbArtikelPositionenanzahl >= 1}
                {link class='nav-link' aria=['expanded' => 'false', 'label' => {lang key='basket'}] data=['toggle' => 'dropdown']}
                    {block name='basket-cart-dropdown-label-count'}
                        <i class='fas fa-shopping-cart cart-icon-dropdown-icon'>
                            {if $WarenkorbArtikelPositionenanzahl >= 1}
                            <span class="fa-sup" title="{$WarenkorbArtikelPositionenanzahl}">
                                {$WarenkorbArtikelPositionenanzahl}
                            </span>
                            {/if}
                        </i>
                    {/block}
                    {block name='basket-cart-dropdown-labelprice'}
                        <span class="cart-icon-dropdown-price">{$WarensummeLocalized[0]}</span>
                    {/block}
                {/link}
            {else}
               {link  href="Warenkorb" class='nav-link' aria=['expanded' => 'false', 'label' => {lang key='basket'}] }
                    {block name='basket-cart-dropdown-label-count'}
                    <i class='fas fa-cart-plus cart-icon-dropdown-icon'></i>
                    {/block}
                    {block name='basket-cart-dropdown-labelprice'}
                        <span class="cart-icon-dropdown-price">{$WarensummeLocalized[0]}</span>
                    {/block}
                {/link}
            {/if}
{/block}
 

felix.bauerschaefer

Sehr aktives Mitglied
15. November 2019
235
34
Um den Schwarzen Hintergrund heim hovern über das Megamenü zu ändern musst du die CSS-Klasse: .modal-backdrop ansprechen. Die hat den background-color: #333 steht in der clear.css könntest hier auch sagen backgroud-color: none; mit .modal-backdrop.show kannst du die Intensität des Backgrounds einstellen mittels opacity: .8; Standardmäßig auf 80%. Ist ein wenig viel für die meisten 15%-30% dürften denke mal ausreichen.

Kannst natürlich auch hier direkt auf 0% stellen.
Andernfalls direkt das div unter dem header-top-bar in dem Nova-Child Template überschreiben, entfernen.
 

Conny

Sehr aktives Mitglied
7. September 2009
571
61
Das Problem sehe ich eher, dass die Meldung (wie im Beitrag 1 markiert) kaum wahr genommen wird.
Ein Meldefenster in der Mitte wäre wahrscheinlich die Kunden freundlichste Möglichkeit.
 

felix.bauerschaefer

Sehr aktives Mitglied
15. November 2019
235
34
Das Problem sehe ich eher, dass die Meldung (wie im Beitrag 1 markiert) kaum wahr genommen wird.
Ein Meldefenster in der Mitte wäre wahrscheinlich die Kunden freundlichste Möglichkeit.
Wieso? Macht das Amazon, Otto.de, machen das irgendwelche großen eCommerce Händler, egal ob jetzt B2B/B2C? Wie kommst du darauf, dass dies die Kundenfreundlichste möglichkeit ist? User Friendly ist nicht == guten User Experince.

Also das annehmen immer vom größten DAU ezielt nicht unbedingt direkt gut und die beste Erfahrung und Nutzbarkeit von Programmen noch für künftige Nutzer. Das ist schließlich das Popup, die zentralste und größtmögliche Nachricht in FETT am besten geschrieben damit es bloß keiner übersieht. Diejenigen glaube wollen die wenigsten Ansprechen, wohl eher die Leute, die sich unsicher bewegen mit gezielten Federstrichen wie Animationen, es passiert was die Seite ist nicht statisch das ist wichtig.

Nur ob ich da, unbedingt immer für Popups brauche bezweifele ich.
 
Zuletzt bearbeitet:

Conny

Sehr aktives Mitglied
7. September 2009
571
61
Hi,
sorry - ich wollte damit niemanden etwas negatives andichten.
Ich habe etwas gesehen, womit (nach meiner Meinung) viel User verunsichert werden. Das kann man diskutieren oder auch nicht.

Vom Shop4 zu Shop5 wurde die Meldung (wörtlich) "in den Schatten gestellt".
Die optische Fixierung wird durch das Abdunkeln des Bereiches nicht mehr auf das Infofeld gelenkt. Und um die Meldung und das Abdunkeln wieder weg zu bekommen muss man auf das Infofeld klicken.

Es handelt sich hierbei um meine persönliche Meinung und da JTL bestrebt ist immer einen tollen Online Shop zu haben, hatte ich es nur gut gemeint und darauf hingewiesen.

Ich bin selbst programmiere auch schon seit fast 40 Jahren und bin immer froh, wenn ich Feedback bekomme.

Nochmals - ich will damit keinem auf den Schlips treten.
 

felix.bauerschaefer

Sehr aktives Mitglied
15. November 2019
235
34
danke für die Antwort, ja tatsächlich hab ich das persönlich genommen. Da ich komisch finde wieso Popup so beliebt sind. Möchte ungern, dass eines eine überragende Nutzung über das andere findet benutze die leider zu oft für meinen Geschmack. Oftmals nur noch beim Thema Shops - Popup bei mir in Gedanken ringt. Ich meine da sind die meisten Nutzer eigentlich von weg vor allem ist es mittlerweile zum Pseudonym eShop Geworden, ist einer der Hauptründe warum ich z.B. Adblocker einsetze. Dies Werbung bitte im Popup mit Animation, verlangsamt alles, sie ist weder Performant noch ist Sie hilfreich, ob Coupon, Aktion wie auch immer das rechtfertigt nicht meinen Seitenaufbau darüber hinweg zu schmeißen weil nur dafür wird es meistens genutzt. Meldungen der Wartung Popup. Der Shop wird geschlossen Popup, man könne ja auch überlegen ob man Browsermeldungen benutzt für den Warenkorb, oder den Warenkorb direkt nur über Dinge wie den Seitentitel darstellt.

Nein Popup, das bringt uns irgendwie weiter weg vom Gedanken Shops als eine Art native Applikationen/Web Apps zu betreiben. Das sind Sie ja schließlich mittlerweile. Eigene Anwendungen, mit ganz eigener Logik. Teils komplexer, teils weniger komplex.
Das Popup ist doch nicht die einzige Funktion der Mitteliung über den Shop. Kleine DIV-Module wo darauf steht sie haben in den Warenkorb getan, XY wie bei Snacky und co. Darauf achten viele Leute auch unbewusst, man muss nur mittels Boardmittel entsprechend darauf hinweisen.

Zwar finde ich ist das in Programmen ne tolle Lösung für Erfolgsnachrichten, wenn ein langwierieger Prozess wie bei einem Render fertig ist doch ob dieselbe Logik auch für eine Webseite zutrifft, finde ich sehr schwierig gleich zusetzen. Vor allem da wir damit den selben Standard vorsetzen wie es teils bei vielen Programmen leider, vor allem von Microsoft mittlerweile Standard findet. So einfach wie möglich, was zwar bei einem Screenshot-Tool funktioniert, funktioniert nicht bei Office, auch nicht bei der umgestaltung der Systemsteuerung.

Da bin ich irgendwo auf Seiten, never ever sowas.
Naja die Umsetzung, nach wünschen das es gebeten ist und umgesetzt werden sollte von JTL bin ich vollkommen bei dir. Mehr Kundenindividualisierungen sind immer gut. Nur bitte halt nicht Einseitig.
 
Zuletzt bearbeitet:
  • Gefällt mir
Reaktionen: hula1499
Ähnliche Themen
Titel Forum Antworten Datum
Shop4 Aufträge in Shop5-Datenbank importieren? Upgrade JTL-Shop4 auf JTL-Shop5 1
QR-Code auf der Rechnung gibt 100-fachen Betrag des eigentlichen Rechnungsbetrages aus JTL-Wawi 2.0 5
Seit dem Update meines JTL-Shops auf Version 5.7.1 funktioniert die Verbindung zwischen JTL-Wawi 2.0.4.0 und dem Shop nicht mehr. JTL-Wawi 2.0 5
Neu Dringend: USA DHL Versand Umstellung ab 24.07. auf HTSUS Zolltarifnummern JTL-ShippingLabels - Ideen, Lob und Kritik 6
Neu Update auf 5.7.2 - kein DB Update Installation / Updates von JTL-Shop 10
Neu Feld "Informationen" auf Smartphone immer ausklappen Allgemeine Fragen zu JTL-Shop 2
Neu Update von 1.8.12.4 auf 2.0.5 - Kostenfreie Version - Registrierung erforderlich? User helfen Usern - Fragen zu JTL-Wawi 1
JTL Update auf 1.9 , danach Import Kundenspezifrische Preise velerhaft JTL-Wawi 1.9 0
Neu Rechte-Fehler im J10n Modul und Auswirkung auf base.mo.php in div. Plugins (Shop 5.7.1) JTL-Shop - Fehler und Bugs 0
nach Update von 5.3 auf 5.7 neue Position im Warenkorb "Gebühr" die auch in den Auftrag übernommen werden Einrichtung JTL-Shop5 2
Beantwortet Shop Abgleich nach Update auf 5.7.2 nicht mehr möglich JTL-Shop - Fehler und Bugs 4
Neu Amazon: Artikel-Highlight / Produkttitel auf 75 Zeichen begrenzt Amazon-Anbindung - Fehler und Bugs 8
Neu Produktionsaufträge tauchen nicht in der Workbench auf JTL-Plan&Produce - Fehler und Bugs 2
Bei Update auf 2.05 kam folgende Meldung JTL-Wawi 2.0 2
Ameise - Importvorlage auf 80 Spalten begrenzt? JTL-Wawi 2.0 0
Login Wawi nicht möglich nach Update auf 1.11.11 JTL-Wawi 1.11 1
Neu Anpassung Kundendaten auf XRechnung User helfen Usern - Fragen zu JTL-Wawi 6
Neu Absenderadresse auf Versandlabel ändern User helfen Usern - Fragen zu JTL-Wawi 1
Ameise (1.11.11.0) Export auf Clients nicht möglich - Das Dezimaltrennzeichen kann nicht die leere Zeichenfolge sein JTL-Wawi 1.11 5
Neu Hinweis zum Auftrag wird seit Update auf die 1.11 nicht mehr angezeigt JTL-WMS / JTL-Packtisch+ - Fehler und Bugs 0
Neu Umstellung auf Jera Datev Schnittstelle - keine Kundennummer im Kundencenter Schnittstellen Import / Export 2
JTL APP - Fehlermeldung nach Update auf Wawi 1.11. JTL-Wawi App 6
JTL Wawi 1.11. - Fenstergröße - Artikel auf Einkaufsliste setzen JTL-Wawi 1.11 13
Nach Update auf 2.0.3 Keine Fehlermeldungen mehr sichtbar Otto.de - Anbindung (SCX) 1
DPD Cloud Labeldruck auf Zebra LP 2844-Z seit Update auf JTL-Wawi 1.11.x fehlerhaft JTL-Wawi 1.11 3
JTL nach Update auf 2.0.3 im Bereich „Kunden“ extrem langsam JTL-Wawi 2.0 1
Neu DotLiquide Variable Voraussichtliches Lieferdatum auf Rechnung User helfen Usern - Fragen zu JTL-Wawi 1
Neu Betrag auf der Rechnung nach Rechnungskorrektur User helfen Usern - Fragen zu JTL-Wawi 1
Fehler nach Update auf Version 1.11.11 und 2.0.4 JTL-Wawi 2.0 7
Lohnt sich das Update von 1.11.6 auf 2.0.4 aktuell? JTL-Wawi 2.0 2
Neu DHL Versenden 4.0 Zolltarifnummer auf 8 Stellen kürzen User helfen Usern - Fragen zu JTL-Wawi 1
Neu Internetmarke 2.0 - Direktdruck auf Umschlag JTL-ShippingLabels - Ideen, Lob und Kritik 3
Update auf 1.11.11 schlägt fehl JTL-Wawi 1.11 3
Neu Update Version 1.5 auf 1.11 - Download älterer Versionen als 1.8 Installation von JTL-Wawi 2
Neu Shop-Update auf 5.7.1: Sprachvariablen im Widerrufsformular werden nicht erkannt, obwohl vorhanden?! JTL-Shop - Fehler und Bugs 3
Erfahrungswerte Update von 1.8.12.2 auf 1.11.10 JTL-Wawi 1.11 4
Neu Umzug von sehr alter JTL Wawi Version auf neuen PC User helfen Usern - Fragen zu JTL-Wawi 3
Neu Rechnungskorrektur/Storno wird auf falsches Buchungskonto gebucht JTL-Wawi - Fehler und Bugs 1
Neu Umstellung auf DHL Versenden 4.0 leeres Versand Label JTL-ShippingLabels - Ideen, Lob und Kritik 5
Neu Angebotsname auf Amazon Amazon-Anbindung - Ideen, Lob und Kritik 0
Neu Konfigurationskomponenten auf Bons in separaten Positionen ausgeben JTL-POS - Fehler und Bugs 4
Neu Nach Update auf 1.11.10.0 Abgleich zu Ebay über 3 Stunden bei neuen Angeboten eBay-Anbindung - Fehler und Bugs 2
Beantwortet [WAWI-85758] Nach Update auf 1.11.10 klappt stornieren über ios Wawi App nicht mehr JTL-Workflows - Fehler und Bugs 1
Neu Suche Workflow: Erstbestellung Shop auf Rechnung -> Auftrag Zurückhalten JTL-Wawi - Ideen, Lob und Kritik 1
Dashboard lädt nicht und Umsatzanzeige rechnet falsch seit Update auf 1.11.8 JTL-Wawi 1.11 8
Neu PayPal Plugin wirft Fehler auf einmal wegen telefonnummer JTL-Shop - Fehler und Bugs 3
Update von 1.10.15 auf 1.11.10 JTL-Wawi 1.11 11
Neu Falsch erzeugte Ausgangszahlung bei Teilzahlungen und Retoure (Kauf auf Rechnung) Arbeitsabläufe in JTL-Wawi 0
Neu Nach Update auf JTL-Wawi 2.0.3 keine WMS-Lager mehr auswählbar – Versand komplett blockiert JTL-Wawi 2.0 3
Update auf 1.11 verlangt ein Update auf aktuelleren SQL Server JTL-Wawi 1.11 7

Ähnliche Themen