Warenkorb-Darstellung

[Anne62]

betrifft: www.landleckereien.de/blogshop

Moin,
Ich möchte gerne eine andere Warenkorb-Darstellung als meine jetzige, die ich unübersichtlich finde:

ich hätte gerne ein Darstellung der Produkte in einer Reihe, so wie

hier:
Ich habe mehrere Versuche unternommen, aber mir dabei immer wieder das Layout zerschossen. Vielleicht könnt ihr helfen.

Wenn ich es richtig verstanden habe, geht es dabei um diese Tabellenreihe:

Code: Alles auswählen

<tr class="productrow_2 wpsg_<?php echo (($i % 2 == 0)?'odd':'even'); ?>">
            <!-- produktbilder -->
				<td colspan="<?php echo ((sizeof($this->view['basket']['mwst']) > 1 || $this->get_option('wpsg_showMwstAlways') == '1')?'4':'3'); ?>" class="wpsg_cell_name"> 
					<?php if ($this->get_option('wpsg_mod_produktbilder_basketimage') == '1' && $this->hasMod('wpsg_mod_produktbilder')) { 
						
						if (wpsg_isSizedString($p['varianten_image'])) $arBilder = array($p['varianten_image']);						
						else $arBilder = $this->callMod('wpsg_mod_produktbilder', 'getProduktBilder', array($this->getProduktID($p['id']))); 
						
					?>
					<div class="wpsg_basket_productimage">
						<?php if (wpsg_isSizedString($arBilder[0])) { ?>
						<img src="<?php echo $this->callMod('wpsg_mod_produktbilder', 'makeTn', array($this->getProduktID($p['id']), $arBilder[0], 30, 30, 'c')); ?>" alt="<?php echo wpsg_hspc((($p['detailname'] != '')?$p['detailname']:$p['name'])); ?>" />
						<?php } ?>
					</div>
					<?php } ?>
					<?php if ($this->getProduktLink($p)) { ?>
					<a href="<?php echo $this->getProduktLink($p); ?>"><?php echo wpsg_hspc((($p['detailname'] != '')?$p['detailname']:$p['name'])); ?></a>
					<?php } else { ?>
					<?php echo wpsg_hspc((($p['detailname'] != '')?$p['detailname']:$p['name'])); ?>
					<?php } ?>
				</td>
			</tr>			

Problem ist: wenn ich eine weitere Spalte in der Tabelle einführe, um das Produktbild und den Produktlink einzusetzen, zerschieße ich mir im unteren Bereich die Tabellenzeilen, die mit einem dynamischen Colspan-Befehl arbeiten. Das ist der Fall, wenn Produkte mit unterschiedlichem MwSt. im Warenkorb sind.
Und wenn ich nur den Codeschnipsel in die Zelle des "löschen"-Buttons setze , ist die darstellung sehr unbefriedigend, da es nicht nebeneinander steht. Vielleicht habt ihr ja einen Tipp, wie ich das lösen kann?

Ich nutze WP 4.7.5, WPSG-Version 3.12.4, Firefox 53.0.2, Mac El Capitan 10.11.6, Twenty Twelve Eigendesign mit vielen Änderungen.
Vielen Dank für Eure Hilfe
Anne

[maennchen1.de]

Hallo!
Spätestens wenn du Produktvariablen, Produktvarianten oder Bestellvariablen nutzt, wird dir dein Design nicht mehr helfen, weil dann alles in einer Zeile steht.
Wie du schon festgestellt hast, ist das ein ziemlich kompliziertes Unterfangen und muss an sehr vielen Stellen angepasst werden.

[Anne62]

Produktvariablen und Varianten wird es nicht geben.
Was meinst du mit Bestellvariablen? Zahlungs- und Versandvariable?
Ich verstehe auch wirklich nicht, warum das so angeordnet ist, gibt es einen Grund für diese Unübersichtlichkeit?

[maennchen1.de]

Bestellvariablen: http://wpshopgermany.maennchen1.de/2011 ... variablen/

Die Anordnung ist so, weil man sehr viele Sachen in dem Warenkorb anzeigen lassen kann, was du derzeit nicht machst. Hier mal ein Beispiel aus unserem Testshop:

Optimierungspotential ist immer und überall! Wir freuen uns auf konstruktive Vorschläge!

[Anne62]

Mein Vorschlag wäre: vereinfachen soviel wie irgend geht. So eine "eierlegende Wollmilchsau" ist - meiner Meinung nach - zu unübersichtlich.
Aber das hilft mir nun auch nicht weiter.
Ich frage mich z. B. warum die MwSt. beim Produkt nur angezeigt wird, wenn es mindestens zwei Produkte mit unterschiedlichen MwSt. sind?

[maennchen1.de]

Ja, da gebe ich dir recht. Je einfacher, umso besser. Aber jeder möchte das maximalste aus seinem Shop heraus holen und Geschmäcker sind verschieden. Wir können nur mit den PHTML-Dateien die Option geben, das wieder etwas zu vereinfachen. Nicht jeder Shop hat die selben Anforderungen.

Ich frage mich z. B. warum die MwSt. beim Produkt nur angezeigt wird, wenn es mindestens zwei Produkte mit unterschiedlichen MwSt. sind?

Das ist eine einschaltbare Option unter "Konfiguration > Einstellungen > Darstellung > MwSt. Spalte auch bei einem Satz zeigen:".

[Anne62]

Moin,
das ist ja schon mal was - muss man aber auch erst mal finden
Das bringt mich zur nächsten Frage: ich möchte gerne den Button "aktualisieren" im Shop durch eine kleine Grafik ersetzen, finde aber keine Lösung dafür. Der momentane Code lautet ja so:

Code: Alles auswählen

<input type="submit" class="wpsg_button wpsg_refreshbutton" value="<?php echo __('aktualisieren', 'wpsg'); ?>" name="wpsg_basket_refresh" />

Die Grafik

Code: Alles auswählen

<img src="<?php echo WPSG_URL; ?>views/gfx/icon-refresh.png" alt="<?php echo __('aktualisieren', 'wpsg'); ?>" />

Ich habe schon diverse html-Hilfen durchforstet, aber keine der Lösungen funktioniert bisher - habt ihr einen Tipp?
Grüße und Dank für eure Unterstützung
Anne

[maennchen1.de]

Der Button ist nicht einfach eine Grafik, sondern ein Submit-Button. Er hat also eine Funktion. Diese musst du der Grafik noch mitgeben:
https://www.google.de/search?q=submit+button+mit+grafik

[Anne62]

Ja, das es ein submit-Button mit einer Funktion ist, war mir schon klar und ich habe auch schon Diverses ausprobiert - mit genau der Suche, die du empfiehlst, aber leider ohne Erfolg.
Es gibt jetzt allerdings einen Teilerfolg:
Erst ein css:
input[type="submit"]{
background:url(http://www.landleckereien.de/blogshop/w ... efresh.png) no-repeat left center;
width:40px;
height:40px;
border:0;
}

und in der basket.phtml nichts ändern. Ging aber nur mit dem kompletten Pfad bei background. Und beim Mouseover verschwindet die Grafik - warum auch immer... Habt ihr eine Idee?

[Anne62]

Mit meiner eben gezeigten Lösung kriege ich aber ein Problem, da der "type="submit" auch vom "zur Kasse"-Button genutzt wird. Also weiter suchen. Ich verstehe nicht, warum ich da keine Lösung finde... habe einfach von den Formularverarbeitungen zu wenig Ahnung.

[maennchen1.de]

Das ist mehr CSS-Kenntnis
Mit der obigen Definition nimmst du Bezug auf alle Submit-Buttons. Du müsstest wenn, dann mit ID oder Klassennamen arbeiten. Was wir ja schon machen (wpsg_button wpsg_refreshbutton). Suche einfach in der wpShopGermany-CSS-Datei und passe die Klassen nach deinen Wünschen an.

[Anne62]

Das ist ja das vertrackte, eigentlich bin ich bei css einigermaßen gut dabei, aber diesmal ... ich werde weiter probieren und berichten

[Anne62]

Inzwischen bin ich einen Schritt weiter, zumindest konnte ich den Button per css mit einem Hintergundbild versehen, aber es gibt noch Darstellungsprobleme.
Also im Code habe ich beim Button nichts geändert:

Code: Alles auswählen

<input type="submit" class="wpsg_button wpsg_refreshbutton" value="<?php echo __('aktualisieren', 'wpsg'); ?>" name="wpsg_basket_refresh" />

Dein Tipp mit den Klassen hat mich weitergebracht
Im CSS sieht es so aus, allerdings spricht der Button erst an, wenn man die Klasse nicht so definiert: .wpsg_button .wpsg_refreshbutton
sondern so: .wpsg_basket .wpsg_refreshbutton
Im CSS sieht das so aus:

Code: Alles auswählen

.wpsg_basket .wpsg_refreshbutton {
background:url(http://www.landleckereien.de/blogshop/wp-content/uploads/wpsg/user_views/warenkorb/icon-refresh.png) no-repeat;
width:16px;
 height:16px;
border:0;
}

Aaaaber: die Darstellung ist noch seltsam: beim Button wird immer noch die "Beschriftung" aktualisieren angezeigt

und es gibt einen hover-Effekt, bei dem ich noch nicht herausgefunden habe, wo ich den abstellen kann.
Da kann ich kein Screenshot liefern, aber der Button wird beim Mouseover grau.

Und als Drittes eine Frage: Ich finde es kundenfreundlicher, wenn der Button ganz in der Nähe der Mengenzahl steht, anstatt ganz am Ende des Warenkorbes. Besonders, wenn ein Kunde viele Produkte hat, ist der Button nicht gleich zu entdecken. Deshalb habe ich versucht, den Button direkt neben der Mengenzahl oder dem "löschen"-Button zu setzen. Dann allerdings funktionierte die Rechnerei nicht mehr richtig - woran kann das gelegen haben?

Ich wäre froh, wenn ihr zu diesen Fragen noch Hinweise hättet - und denkt nicht, ich hätte nicht gesucht...

[maennchen1.de]

Du machst aus einem Button mehrere Buttons. Hier musst du aufpassen, dass dieser noch seine Funktion beibehält.

[Anne62]

Daher sitzt er neben dem Bild, in meinem Warenkorb rechnet er dann richtig, sitzt er in der gleichen Tabellenzelle wie die Mengenzahl oder der löschen-Button, funktioniert es nicht mehr. Zur Not würde ich ihn noch direkt unter die Produkte setzen - vor der Zwischensumme.