Retina Product Images

Please scroll down for the german description.

Our Retina Images extension displays sharper images to users with high resolution devices and screens like the iPad© or iPhone© by providing a double-sized version of the product image. In contrast to any javascript based approach where the normal image is loaded first and then substituted by the retina version (like retina.js jQuery plugin etc.), this extension creates and caches them on the fly in PHP and provides them directly to the image's source attribute, so only the retina version is loaded.

Frontend Demo • Backend Demo

Features:

The extension doesn't touch or override any template

No javascript image substitution! Pure PHP with a whiff of JS for the cookie

Images get cached by magento's internal catalog image caching system

Normal images for normal (non-retina) displays

Uses cookie for fast recognition of retina devices

No configuration required

It's free!

Usage:

Install the module like described below, clear your cache and re-login to your admin panel. Go to "System -> Configuration -> MEDIA ROCKS EXTENSIONS" where you have a configuration section called "Retina Images". This is where you can enable the extension.

You don't have to adjust any template, just make sure your image tags have a height or width set, so the retina image can be scaled down correctly. Of course you have to upload your product images as twice as big as the maximum used dimension on your page. For example if you display your product images in grid with 200x200 pixels, you have to upload them at least with 400x400 pixels.

Installation:

Installation via Magento Connect Manager:
Open the Connect Manager and upload the extension file via "Direct package file upload".

Manual Installation:
Unpack the extension and upload the app folder to your Magento root folder.

Uninstall Module:

To uninstall the module, please use the Magento Connect Manager or remove the following files and folders from your system manually:

- app/etc/modules/Mediarocks_RetinaImages.xml
- app/code/community/Mediarocks/RetinaImages
- app/design/frontend/base/default/layout/mediarocks_retinaimages.xml
- app/design/frontend/base/default/template/mediarocks/retinaimages

Unsere Erweiterung Retina Images erkennt retina-fähige Geräte wie das iPhone© oder das iPad© und erstellt automatisch hochauflösende Bilder für eine optimale, scharfe Darstellung der Produkte in Ihrem Shop. Im Gegensatz zu Javascript-Lösungen (wie z. B. dem jQuery Plugin retina.js), bei denen zuerst normale Bilder geladen werden und diese anschließend durch die hochauflösenden Versionen ersetzt werden, generiert diese Erweiterung Bilder mit doppelter Auflösung, speichert diese zwischen und gibt sie direkt im src-Attribut des Bildes aus, wodurch nur das hochauflösende Bild geladen wird.

Frontend Demo • Backend Demo

Features:

Die Erweiterung überschreibt oder ändert keinerlei Templates

Bilder werden von Magento's internem Katalog Bilder Cache-System zwischengespeichert

Normale Bilder für normale (nicht-retina-)Bildschirme

Verwendet Browser-Cookie für schnelle Wiedererkennung von retina-Geräten

Kein Javascript-Bildaustausch! Pures PHP mit einem Hauch Javascript für das Cookie

Keine Konfiguration nötig

Kostenlos!

Anwendung:

Installieren Sie das Modul wie unten beschrieben. Dannach müssen Sie den Magento Cache leeren und sich erneut im Admin Bereich anmelden. Navigieren Sie zu "System -> Konfiguration -> MEDIA ROCKS EXTENSIONS -> Retina Images" und aktivieren Sie das Modul.

Sie müssen kein Template anpassen oder ähnliches. Stellen Sie lediglich sicher, dass in Ihren Bild-Tags eine Höhe oder eine Breite definiert ist, damit das Bild korrekt skalliert werden kann. Selbstverständlich müssen Sie Ihre Produktbilder in doppelter Auflösung bereitstellen, als sie auf der Seite dargestellt werden. Wenn Ihre Bilder in der Tabellenansicht z. B. mit 200x200 Pixeln dargestellt werden, müssen Sie die Bilder in mindestens 400x400 Pixeln hochladen.

Installation:

Manuelle Installation:
Entpacken Sie das Erweiterungspaket (mit der Endung .tgz) aus dem Ihnen bereitgestellten ZIP-Archiv und kopieren Sie alle darin enthaltenen Dateien und Ordner in das Root-Verzeichnis Ihrer Magento-Installation.

Installation via Magento Connect Manager:
Öffnen Sie den Connect Manager und geben unter "Install New Extensions" den Extension-Key ein, den Sie auf der Magento-Connect Seite erhalten, ein. Klicken Sie anschließend auf Install. Oder laden Sie alternativ das Erweiterungspaket (mit der Endung .tgz) aus dem Ihnen von Media Rocks Software Solutions bereitgestellten ZIP-Archiv unter "Direct package file upload" hoch.

Modul deinstallieren:

Um das Modul zu deinstallieren, entfernen Sie bitte folgende Dateien und Ordner manuell von Ihrem System: