Sehr geehrte POWERGAP Kunden,
zunächt wünschen wir allen ein frohes und erfolgreiches neues Jahr!
Hier eine Kleinigkeit, die wir zwischendurch eingebaut haben.
Schon länger her, da haben wir für einen Kunden CSS Klassen in die Warenkorbtabelle eingebaut. Mit Hilfe der Klassen läßt sich der Warenkorb farblich sehr individuell einstellen. Hier ein Beispielcode:
den man über Layout > Schriften/CSS > ROOT einsetzen kann. Wer sich mit CSS gut auskennt kann dieses Beispiel recht einfach umgestallten und für seine Zwecke umbauen.
Im Firefox funktioniert sogar der Hoover Effekt mit einer separaten Farbe:
Heute haben wir noch eine weitere Möglichkeit zusätzlich eingebaut! Auch beim Schritt "Zur Kasse" gibt es nun die selben Formatierungsmöglichkeiten. Hier ein Beispiel CSS:
Hier das Ergebnis:
Sollten Sie sich mit CSS nicht so gut auskennen, wollen aber dennoch auch in Ihrem Shop das Design angepasst haben, so melden Sie sich bei uns. Wir realisieren das für Sie binnen weniger Minuten.
Performance Tipp:
Wenn beide Tabellen identisch aussehen sollen/können bietet sich folgende Schreibweise an:
table.wk, table.wk_zk {border-collapse: collapse;margin: 0px;padding: 0px;}
table.wk, table.wk_zk {usw...
Sprich also die Klassendefinitionen, die identische Werte zugewiesen bekommen, einfach mit Komma hintereinander schreiben. Das erspart Code in der CSS Datei.
zunächt wünschen wir allen ein frohes und erfolgreiches neues Jahr!
Hier eine Kleinigkeit, die wir zwischendurch eingebaut haben.
Schon länger her, da haben wir für einen Kunden CSS Klassen in die Warenkorbtabelle eingebaut. Mit Hilfe der Klassen läßt sich der Warenkorb farblich sehr individuell einstellen. Hier ein Beispielcode:
/* Formatierung Warenkorbtabelle */
table.wk {border-collapse: collapse;margin: 0px;padding: 0px;}
table.wk th {background-color: #A00000;text-transform: uppercase;color: #ffe7b4; }
table.wk th, table.wk td {border-bottom: 1px solid #988644;border-top: 1px solid #988644;padding: 0.6em;vertical-align: top;}
table.wk tr td {background-color: #D7CC8A;}
table.wk tr:hover td {background-color: #998644; }
table.wk tr.odd td {background-color: #E2D89D; }
table.wk tr.odd:hover td {background-color: #998644; }
table.wk {border-collapse: collapse;margin: 0px;padding: 0px;}
table.wk th {background-color: #A00000;text-transform: uppercase;color: #ffe7b4; }
table.wk th, table.wk td {border-bottom: 1px solid #988644;border-top: 1px solid #988644;padding: 0.6em;vertical-align: top;}
table.wk tr td {background-color: #D7CC8A;}
table.wk tr:hover td {background-color: #998644; }
table.wk tr.odd td {background-color: #E2D89D; }
table.wk tr.odd:hover td {background-color: #998644; }
den man über Layout > Schriften/CSS > ROOT einsetzen kann. Wer sich mit CSS gut auskennt kann dieses Beispiel recht einfach umgestallten und für seine Zwecke umbauen.
Im Firefox funktioniert sogar der Hoover Effekt mit einer separaten Farbe:
Heute haben wir noch eine weitere Möglichkeit zusätzlich eingebaut! Auch beim Schritt "Zur Kasse" gibt es nun die selben Formatierungsmöglichkeiten. Hier ein Beispiel CSS:
/* Formatierung Tabelle Zur_Kasse*/
table.wk_zk {border-collapse: collapse;margin: 0px;padding: 0px;}
table.wk_zk th {background-color: #A00000;text-transform: uppercase;color: #ffe7b4; }
table.wk_zk th, table.wk_zk td {border-bottom: 1px solid #988644;border-top: 1px solid #988644;padding: 0.6em;vertical-align: top;}
table.wk_zk tr td {background-color: #D7CC8A;}
table.wk_zk tr:hover td {background-color: #998644; }
table.wk_zk tr.odd td {background-color: #E2D89D; }
table.wk_zk tr.odd:hover td {background-color: #998644; }
table.wk_zk {border-collapse: collapse;margin: 0px;padding: 0px;}
table.wk_zk th {background-color: #A00000;text-transform: uppercase;color: #ffe7b4; }
table.wk_zk th, table.wk_zk td {border-bottom: 1px solid #988644;border-top: 1px solid #988644;padding: 0.6em;vertical-align: top;}
table.wk_zk tr td {background-color: #D7CC8A;}
table.wk_zk tr:hover td {background-color: #998644; }
table.wk_zk tr.odd td {background-color: #E2D89D; }
table.wk_zk tr.odd:hover td {background-color: #998644; }
Hier das Ergebnis:
Sollten Sie sich mit CSS nicht so gut auskennen, wollen aber dennoch auch in Ihrem Shop das Design angepasst haben, so melden Sie sich bei uns. Wir realisieren das für Sie binnen weniger Minuten.
Performance Tipp:
Wenn beide Tabellen identisch aussehen sollen/können bietet sich folgende Schreibweise an:
table.wk, table.wk_zk {border-collapse: collapse;margin: 0px;padding: 0px;}
table.wk, table.wk_zk {usw...
Sprich also die Klassendefinitionen, die identische Werte zugewiesen bekommen, einfach mit Komma hintereinander schreiben. Das erspart Code in der CSS Datei.