Changement de dossier du CDN vers WordPress + Remplacement de LinkWithin par SimilarPost puis TimThumb
Depuis longtemps, j’avais pas mal de photo de ce blog qui étaient stockées derrière le domaine louisvolant.com. Pourquoi ? Parce que à une époque aujourd’hui lointaine, j’avais deux hébergements, un sur lequel fonctionnait le blog, et l’autre sur lequel je préférait stocker mes photos et autres images affichées sur le site, ce qui permettait, lors de téléchargements, de ne pas impacter le même serveur. Mais ce temps est révolu : depuis lors, j’ai un serveur non-mutualisé, donc des ressources matérielles sans commune mesure avec ce dont je disposais à l’époque. D’où l’idée de rassembler les images et le blog (et de surcroît, ça fait économiser une résolution de domaine au chargement de la page, ce qui n’est pas plus mal).
J’ai commencé par copier les photos d’un domaine à un autre :
cp -R ancien-ndd/dossier/* blog/wp-content/uploads/ancien-ndd
Puis je suis allé dans mon MySQL, et j’ai remplacé les occurences de ancien-ndd/dossier/ par blog/wp-content/uploads/ancien-ndd. En fait, ces occurrences se trouvaient exclusivement dans des URL d’images ou de documents, donc pour le lecteur, ce changement d’url devrait, s’il est bien fait, être totalement transparent (Edit : maintenant ça doit bien faire deux semaines qu’il est fait, et personne ne s’est plaint, c’est donc que tout doit être correct)
UPDATE `wp_posts` SET `post_content` = Replace(`post_content`,’ancien-ndd/dossier’,’blog/wp-content/uploads/ancien-ndd’ ) WHERE `post_content` LIKE ‘%ancien-ndd/dossier%’
Bien sûr, le mieux c’est de faire un backup de la BDD avant de faire ce genre de manipulation, mais pour ma part, j’ai un backup qui est fait toutes les nuits, donc pas de problème à ce niveau.
Ensuite, j’ai besoin que toutes les photos non gérées directement par WordPress, aient une version « timbre », ce afin de bien gérer les photos dans les billets similaires affichés en bas de chaque billet.
Donc pour cela, il me faut un petit script, qui créé une copie des image et les convertisse directement en 150×150, avec une opération de renommage du style mon_image.jpg qui devienne mon_image-150×150.jpg (vous allez comprendre pourquoi dans la suite). Autant vous le dire tout de suite, pour l’instant je n’ai pas trouvé ce script. Par contre, j’ai trouvé TimThumb, qui redimmensionne (en PHP) a la volée les images. Et ça fonctionne plutôt pas mal. Je vous le recommande.
Remplacement de LinkWithin par SimilarPost
Comme je vous le disais plus haut, l’idée est de remplacer LinkWithin qui ne fonctionnait pas chez moi par un simili-LinkWithin. J’ai donc fait un tout petit peu de rétro-ingénierie (j’ai copié leur code HTML/CSS), et j’ai pu, en l’associant aux quelques fonctionnalités du plugin SimilarPost, créer un petit carrousel de billets similaires, avec chacun leur image (cf en bas de chaque billet de ce blog).
Il suffisait d’utiliser pour cela le pseudo-code que fournit le plugin SimilarPost, avec notamment les annotations comme {url} (qui donne l’url d’un billet jugé comme similaire au billet lu par le visiteur) ou {imageurl} :
Voilà le code. Dans les Output Settings du plugin SimilarPost, j’avais mis :
Case Output Template :
<a href="{url}" class="similarpostlinkblock" onmouseover="this.style.backgroundColor='#dde'" onmouseout="this.style.backgroundColor=''"> <div style="width: 156px; height: 215px; margin: 0; border: 0; padding: 0"> <div style="margin: 0; border: 1px solid #ddd;padding: 2px;width: auto;height: auto; "> <div style="background: url({imagesrc:0:post:?t}) no-repeat; width: 150px; height: 150px; margin: 0; border: 0; padding: 0"></div> </div> <div class="similarpostlink"> {title:59:trim} </div> </div> </a>
Text and codes before the list:
<h3>Vous serez peut-être intéressé :</h3><div style="margin: 0; border: 0; padding: 0px 0px 160px 70px;">
Text and codes after the list:
</div>
Le problème de cette solution, c’est qu’elle appelait à chaque fois les images 150×150 générées par WordPress lorsque vous uploadez une image au moment de créer un billet ou une page (via le {imagesrc:0:post:?t}). MAIS : moi j’avais plein d’anciennes images (celles provenant de mon CDN, ainsi qu’une grosse partie encore hébergée sur Flickr), et du coup celles-ci n’avaient pas de version 150×150 (et je n’avais pas trouvé de script pour les générer, comme je l’ai expliqué plus haut). D’où l’utilité du script les recréant en 150×150 (ce dont j’ai parlé plus haut).
La solution meilleure : TimThumb
EDIT : Attention : suite à l’attaque de mon blog via une faille dans TimThumb, je déconseille son utilisation.
Du coup, pour créer les images en 150×150, j’ai fini par trouver une script PHP qui les créée à la volée (ce qui n’est pas bien, car cela augmente le temps de chargement de la page). J’aurais préféré un script me les créant toutes d’un coup, et rajoutant -150×150 a la fin du nom du fichier, mais je ne crois pas que c’était trop possible… (ImageMagick saurait-il faire ça ? Si vous savez le faire, je suis preneur de la technique)
Donc revenons à TimThumb. Vous uploadez ce script sur votre serveur, vous créez un dossier de cache (ce qui est TRÈS bien : vous générez une fois l’image, et les fois suivantes, celle-ci est déjà créée !). Par contre, cela nécéssite d’apporter un petit changement au code d’appel de SimilarPost.
Ainsi, il faut remplacer
{imagesrc:0:post:?t}
par
wp-content/dossier_de_mon_script/timthumb.php?src={imagesrc:0:post:}&h=150&w=150&zc=1
Et ça fonctionne ! Je ne dis pas que je n’ai pas eu d’erreur PHP à cause de droits non accordé au script PHP (ça sent très fort la faille de sécurité d’ailleurs, mais osef 🙂 )
Vous serez peut-être intéressé :
- • Récit de l’attaque via PHP de mon blog. En cause : timthumb.php
Ce matin, en regardant mon tableau de bord Analytics, j'ai découvert des pages bizarre affichées sur mon blog. Bizarre car les urls ne correspondaient pas au pattern que je leur ai donné sur mon blog....
- • Avec OutBrain et LinkWithin, améliorez la navigation interne de votre blog
OutBrain et LinkWithin sont deux services qui proposent un widget à placer sur votre blog (plusieurs plateformes sont supportées, dont Wordpress et Blogger), widget qui est par exemple à placer en bas...
- • Un carrousel d’images au lieu de simples liens sur votre blog WordPress
Sur plusieurs blogs, j'ai pu trouver ce que j'appellerai un "carrousel d'images", permettant d'afficher l'image d'un billet, cliquable, avec sur celui-ci une partie grisée sur laquelle est écrit le ti...
- • Postez des billets sur votre WordPress par mail
Il y a quelques temps déjà que Wordpress permet à ses utilisateurs de répondre aux commentaires par mail, mais à partir de maintenant la stratégie mail de Wordpress franchit un cap en permettant le p...
- • Thèmes magazines pour WordPress : comment avoir l’air d’un pro sur son blog
Un petit post récapitulatif, pour moi d'abord (vous l'aurez remarqué, mon blog est plus un fourre-tout/pense-bête/boite-à -tutoriel qu'un journal intime). Les thèmes magazines de Wordpress sont des thè...
2 commentaires sur ce billet
Laisser un commentaire
- 11 March 2018Comment bloquer toutes les pubs sur son réseau internet avec Pi-Hole(0) Comments
- 21 January 2018Migrer de Calendar vers ZonedDateTime & LocalDateTime(0) Comments
- 20 January 2018Comment récupérer une base de code Spring Boot/Maven rapidement(0) Comments
- 20 January 2018Comment utiliser IntelliJ Idea Ultimate gratuitement et légalement sans limite de durée(0) Comments
- 08 December 2017ffmpeg : comment Ré-encoder et/ou faire tourner (réorienter) une vidéo en ligne de commande(0) Comments
- 19 November 2017Remplacer du texte via Regex dans les post de Wordpress(2) Comments
- 16 November 2017Lancement d'une fusée : quel est le découpage du prix de chaque élément ?(0) Comments
- 17 September 2017Comparatif des offres de stockage de gros volume sur le net(2) Comments
- 13 August 2017Bolivie – Jour 20 : Visite de La Paz(0) Comments
- 13 August 2017Bolivie – Jour 19 : La route de la mort dans les Yungas(0) Comments
Salut,
Pour ton script PHP qui redimensionne les images, j’ai fait ça il y a peut pour une galerie, grosso modo le script que j’utilise charge la librairire PHPThum et si la miniature n’existe pas déjà , il la créer. Il gère également les dates de modification, si tu change l’image d’origine, il recréera la miniature.
Je t’ai mis le code là : http://pastebin.com/AMf72ws0 si ça t’intéresse.
J’utilise CakePHP comme Framework donc il faut adapter certain truc (notamment pour la date de modification) mais ça doit pas être bien compliquer à faire.
@jparker: Ah pas mal ! Bravo à toi ! J’avoue que je suis pas du tout développeur PHP (je ne connais CakePHP que de nom) (je suis développeur Java dans la vraie vie 🙂 ) Merci de m’avoir donné le lien : le script n’est pas long, donc je vais le lire et je regarderai ce que je peux faire du code à partir de ce que j’ai en terme de PHP sur mon serveur 🙂
Encore merci à toi !