Unsere Kundin fand auf Ihrem Retina Display, auf der Rechnung und dem Lieferschein ihr Logo zu unscharf. Daraufhin habe ich mal geschaut, was es für Möglichkeiten gibt es schärfer zu bekommen. Eine Möglichkeit zumindest für das Display wären 2 verschieden-große JPG anzulegen und diese per CSS für das jeweilige Display einzustellen.
der Vollständigkeit halber (Quelle:
http://css-tricks.com/snippets/css/retina-display-media-query/):
@media
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
/* Retina-specific stuff here */
}
Da das Logo aber auch als Vektordatei vorliegt, wollte ich mal schauen wie/ob das mit dem SVG-Format funktioniert.
Ich habe für alte Browser das top_logo.jpg als Fallback gelassen (wenn kein Javascript aktiv ist und/oder kein SVG-Format unterstützt wird) und für neue Browser aus dem
http://modernizr.com/download/ nur
svg und
add css classes ausgewählt und den Code generiert.
Den generierten Code kopiert man in die
/templates/xtc5/javascript/general.js außerdem muss in der
/includes/header.php im html-TAG die Klasse
no-js ergänzt werden (also <html class="no-js" ...)
Jetzt noch aus der Vektordatei z.B. in Coreldraw eine SVG-Datei erstellen (bei mir hat es geholfen schon die richtigen Pixelgrößen einzustellen, auch wenn es bei Vektoren ja beliebig ist, aber eine 3000 Pixel breite SVG Datei hatte 500 KB die runterskalierten 200 Pixel hatten nur noch 40KB - immer noch recht groß nur fürs Logo, aber dafür scharf
) Die Datei
top_logo.svg benennen und in
/templates/xtc5/img/ speichern.
Durch den modernizr wird jetzt das
no-js durch
js und
svg getauscht, so dass man in seine CSS-Datei Folgendes schreiben kann:
#header { background-image: url(img/top_logo.jpg); }
.svg #header { background-image: url(img/top_logo.svg) }
Dadurch hat man zumindest schon mal das Logo im Shop scharf, egal wie groß man den Bildschirm skaliert oder ob Retinadisplay oder normal.
Für die Rechnung und den Lieferschein muss man die Dateien
/templates/xtc5/admin/print_order.php und
/templates/xtc5/admin/print_packingslip.php ändern.
Einfach im Quelltext
logo.gif gegen
top_logo.svg tauschen.
Zumindest bei mir hats funktioniert - viel Spaß beim Ausprobieren - bei Fragen einfach melden.
Linkback: https://www.modified-shop.org/forum/index.php?topic=28352.0 
