Neu Shop5: klick auf leeren Warenkorb ist etwas verwirrend

Conny

Sehr aktives Mitglied
7. September 2009
556
60
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
228
33
Nienburg/Weser
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
556
60
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
228
33
Nienburg/Weser
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
556
60
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
228
33
Nienburg/Weser
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
556
60
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
228
33
Nienburg/Weser
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
556
60
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
228
33
Nienburg/Weser
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
Neu JTL Shop5 Indexierung GSC - Seiten wurden innerhalb von Wochen aus dem Index geworfen Templates für JTL-Shop 10
Neu JTL Shop 5.4 - Seite 1 verschachtelt sich bei klick auf Seite 1 JTL-Shop - Fehler und Bugs 0
Neu Wo ist Texte optimieren (KI) hin? JTL reagiert seit 09.24 nicht auf Tickets :( Arbeitsabläufe in JTL-Wawi 1
Neu Fehlermeldung auf dem Kassenbon Allgemeine Fragen zu JTL-POS 1
Neu Eigenes Feld Checkbox im Artikel als Darstellungsbedingung auf Rechnungsvorlage Druck-/ E-Mail-/ Exportvorlagen in JTL-Wawi 2
Neu Charge nummer auf Lieferschein User helfen Usern - Fragen zu JTL-Wawi 1
Neu Megamenü Anzahl der Kategrien je Zeile von vier auf sechs erhöhen Templates für JTL-Shop 3
Preiskalkulation auf Grundlage von Lieferantenpreise und Lieferantenbestand JTL-Wawi 1.8 1
Kettensymbol auf alle Artikel verwenden Otto.de - Anbindung (SCX) 0
Neu ++ Fehler beim update von 1.55.5.3 auf version 1.8.11.0 ++ Installation von JTL-Wawi 8
Neu Verkaufskanal POS Kundengruppen Preis brutto auf Artikeletikett drucken Druck-/ E-Mail-/ Exportvorlagen in JTL-Wawi 2
Neu Wasserzeichen auf Lieferschein und Rechnung auf ganze A4 Seite User helfen Usern - Fragen zu JTL-Wawi 5
Neu Keine Bestellung möglich über Nova 5.4 auf 4K Laptop JTL-Shop - Fehler und Bugs 16
Bestellungen beim Lieferanten - Aufteilung auf verschiedene Läger ? JTL-Wawi 1.9 3
Neu JTL Artikel auf Shopify als Varianten anzeigen Shopify-Connector 2
Neu Sehr lange Ladezeit der Produktseite nach Upgrade auf Version 5.4 Allgemeine Fragen zu JTL-Shop 6
JTL-Search - Hardwarestörung auf einem der Search-Server (s7) Störungsmeldungen 0
Neu Nach update auf 5.4 kein Login mehr möglich JTL-Shop - Fehler und Bugs 2
Nach Umstieg auf V5 Paypal express weg. Einrichtung JTL-Shop5 5
Neu Update JTL Wawi von 1.0.0.0 auf 1.8.10.0 Installation von JTL-Wawi 8
Neu Warnung: Update auf Shop 5.4 Installation / Updates von JTL-Shop 39
POS Zahlungen tauchen in Wawi unter Zahlungen nicht mehr auf JTL-Wawi 1.9 0
Neu Umstellung auf den Amazon Lister 2.0 Amazon-Lister - Ideen, Lob und Kritik 0
API Zeichenbegrenzug auf 20 Zeichen Otto.de - Anbindung (SCX) 1
Neu Nach Update auf 5.4 klappt einiges nicht mehr ! Installation / Updates von JTL-Shop 9
Neu Update auf 5.4.0 schlägt fehl Installation / Updates von JTL-Shop 4
Neu JTL Shop Subscription wurde durch Umstellung auf "Advanced Edition" teils doppelt berechnet Allgemeine Fragen zu JTL-Shop 1
Neu Umfrage: Scanpflicht auf Artikelebene (Nur für bestimmte Artikel aktivieren/deaktivieren) JTL-WMS / JTL-Packtisch+ - Ideen, Lob und Kritik 0
Filter und Workflows nicht auf Vaterartikel anwendbar JTL-Workflows - Fehler und Bugs 0
Neu Fehler mit Zugriff auf die Datenbank (Exec Direct). Installation von JTL-Wawi 4
Neu Packtisch+ wartet nicht auf TrackingID Import Arbeitsabläufe in JTL-WMS / JTL-Packtisch+ 6
Neu Upgrade CFE auf Advanced wenn Hosting gebucht Allgemeine Fragen zu JTL-Shop 6
Neu Retouren/Rückerstattungen auf Amazon Arbeitsabläufe in JTL-Wawi 1
Neu Fehler bei Coupons bei Wechsel von 4 auf 5 Betrieb / Pflege von JTL-Shop 0
Neu Artikelnamen auf der Homepage vollständig sehen. Er ist wenn er zu lang ist verkürzt. Allgemeine Fragen zu JTL-Shop 2
Neu Anfägerfragen und Installtion auf ngix server Installation / Updates von JTL-Shop 13
Nach Update auf 1.9 alle Drucker verschwunden JTL-Wawi 1.9 6
Seit Wechsel auf DPD werden keine Versanddaten mehr an Kaufland übertragen. kaufland.de - Anbindung (SCX) 1
Neu Amazon Lister 2.0 Fehlercode: SLR402 Bild "1.jpg" für das Angebot mit SKU "xxxxx" auf Channel "AMAZONDEJTL" wurde nicht gefunden Amazon-Lister - Ideen, Lob und Kritik 0
Update von 1.6.47.2 auf 1.9.5.3 (Registrierung, usw.) JTL-Wawi 1.9 1
Neu Inhalt eines Containers mehrfach auf verschiedenen Unterseiten darstellen Allgemeine Fragen zu JTL-Shop 4
Neu Bestand auf einem Amazon-Marktplatz auf Null setzen. User helfen Usern - Fragen zu JTL-Wawi 0
Neu Gleichzeitiger Zugriff von zwei Nutzern auf JTL-Shop-Backend Allgemeine Fragen zu JTL-Shop 2
Ändern der Bearbeitungszeit auf Amazon lässt sich nicht auf Länder eingrenzen JTL-Wawi 1.9 0
Attribute für EWR Pflichtangaben (ab 13.12.2024) auf den Marktplätzen otto.de & kaufland.de Otto.de - Anbindung (SCX) 8
Fehler bei Update von 1.5.55.8 auf 1.7.15.6 ( Unbehandelte Ausnahme #7110FFD83C0136E0 vom Typ JTL.Database.SqlUpdater.UpdateException) JTL-Wawi 1.7 0
Neu Wie finde ich per SQL heraus welche Aufträge auf Teillieferbar stehen? JTL Ameise - Eigene Exporte 1
Neu DPD A6 Versandlabel auf A4 Etiketten Bogen drucken JTL-ShippingLabels - Fehler und Bugs 0
JTL Wawi Update 1.8.12.4 auf 1.9.5.2 nicht möglich JTL-Wawi 1.9 4
Neu Kontaktformular auf einer eigenen Seite hinzufügen Allgemeine Fragen zu JTL-Shop 1

Ähnliche Themen