Pour mes derniers articles j’ai eu besoin d’afficher des captures d’écran issues de mon iPhone. Mais comme je ne pouvais rien faire simplement, je n’allais tout de même pas ouvrir Photoshop pour créer des miniatures ! Rendons à la machine ce qui est à la machine.
Afin de créer vous aussi vos miniatures iPhone, vous aurez besoin de remplir les conditions suivantes :
- Posséder un blog WordPress (sans déc’ ?)
- Avoir la librairie PHP Imagick
- Disposer d’un accès FTP sur votre blog
J’ai commencé par récupérer une image d’iPhone « vide », que j’ai réduite de moitié pour adapter à la taille de mon blog. Vous pouvez récupérer l’image en cliquant ci-dessous. Elle est à mettre dans le dossier /wp-vcon :
La technique que j’ai adoptée pour la génération d’images à la volée est de passer par un fichier .htaccess dans /wp-content/uploads. Il sert à rediriger toutes les requêtes vers des fichiers inexistants sur un script spécifique, en l’occurrence le script pour les miniatures :
Options -Indexes
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ /wp-content/uploads/check.php?route=$1 [L,QSA]
L’image à l’intérieur de l’iPhone est la moitié d’une capture d’écran faite via l’iPhone (en appuyant simultanément sur la touche Home et la touche Power).
<?php
$destination = $_GET['route'];
if (eregi("^(.+)-iphone\.(.+)$",$destination,$r)) {
header("Content-type: image/".$r[2]);
$original = $r[1].".".$r[2];
if (file_exists($original)) {
$or = new Imagick($original);
$or->setCompression(Imagick::FILTER_LANCZOS);
$or->ThumbnailImage(160,240,true);
$im = new Imagick(dirname(__FILE__).'/iphone-gui.png');
$im->compositeImage($or,Imagick::COMPOSITE_DEFAULT,18,60);
$im->writeImage($destination);
echo file_get_contents($destination);
}
}
header("HTTP/1.0 404 Not Found");
?>
Exemple concret après installation du script : Si vous avez uploadé une image nommée application.png, il vous suffit de rajouter « -iphone » juste avant l’extension du fichier pour avoir un aperçu iPhone, ce qui donnera application-iphone.png.
Et voilà, grâce à ces quelques fichiers, ma flemme d’ouvrir Photoshop pour avoir de jolies miniatures est entièrement comblée, j’espère que ça pourra servir à quelques personnes. Le script est très facilement adaptable sur d’autres plate-formes que WordPress, j’ai donné cette intégration pour l’exemple.
Yus — le 23 décembre 2009 à 01:27
Rooh cte technique de feignasse, j’adore. :D