Archives par étiquette : Blog

Wordpress

A y est !

image

Afin de célébrer l’arrivée du printemps, et mon 2000ème tweet (oui je tweete plus que je ne bloggue…), j’ai enfin quitté la plate-forme désuète que j’utilisais depuis bien longtemps afin de me mettre sur la plate-forme avec l’ecosystème le plus riche : WordPress.

Les objectifs que je souhaitais atteindre en migrant étaient simples :

 

 

  • Ne plus devoir coder pour personnaliser mon blog, mais me reposer sur les différents plugin existants
  • Avoir la possibilité d’avoir assez simplement un blog un peu plus agréable graphiquement (oui, je sais ce n’était pas compliqué de faire mieux…)
  • et enfin avoir un meilleur référencement grâce aux capacités “naturelles” d’un moteur de blog robuste et optimisé.

Et comme la ‘”tradition” le veut, je vous propose donc un petit post mortem du déroulement de la migration.

Mais avant de commencer cette description, je tiens à remercier Guillaume André pour avoir réalisé l’image du bandeau du blog !

Il a en effet réussi à transformer mon magnifique dessin de développeur :

Sans titre

en un résultat bien plus agréable pour vos yeux (et pour les miens Sourire ) :

Sourire

L’installation de WordPress fut très simple grâce à l’utilisation de Web Platform Installer. Toutes les dépendances nécessaires s’installent toutes seules comme des grandes, et on se retrouve ainsi en 5min avec un WordPress fonctionnel.

Premier défi : l’import des posts existants. Je ne partais pas en effet de zero puisque je souhaitais récupérer un peu plus de 200 posts. La majorité des bloggeurs qui ont réalisé ce type de migration ont utilisé le langage BlogML. Après avoir fait quelques tests, j’ai constaté que je perdais pas mal de formatage et de mise en page en utilisant cette technique j’en ai donc utilisé une différente : le RSS !

J’ai donc configuré DasBlog pour exposer l’intégralité de mes posts dans mon flux RSS et importer ce flux dans WordPress qui propose un importer “in the box”.

Mission réussie, il a ensuite été nécessaire de recatégoriser l’ensemble de ces posts.

DasBlog ne supporte que les tags et ne supporte pas les catégories contrairement à WordPress. Après avoir utiliser le converter de Catégories/Tags, j’ai donc créé un ensemble de catégories et j’ai ensuite donc classés manuellement les posts selon ces catégories… Il s’agit de la première opération couteuse en temps. J’ai mis un peu moins d’1h30 pour effectuer le classement des 218 posts.

Comme de plus en plus de thèmes, celui que j’utilise à présent propose des miniatures d’images. Ces miniatures d’images sont à définir manuellement dans l’interface d’administration de wordpress lorsque l’on poste un nouveau contenu. N’allant pas faire manuellement chaque post afin de définir ces miniatures je me suis donc tourné vers le plugin nommé “Auto Post Thumbnail”.

Ce plugin permet d’automatiquement générer une miniature en fonction du contenu du post que l’on insère. Et il propose même de parcourir l’intégralité du contenu d’un blog afin de regénérer l’ensemble des miniatures. Et la bonne nouvelle est qu’il remplit parfaitement son job.

image

Et j’ai ensuite terminé cette migration par la tâche la plus complexe : la mise en place de redirections 301 afin d’éviter que cette migration ne génère beaucoup de liens mort.

Et cette opération a été bien plus douloureuse que ce que j’avais anticipé malgré les différentes recherches que j’avais effectué afin de préparer cette migration.

Premier constat, les redirections sont souvent négligées dans la plupart des articles décrivant la migration de DasBlog vers WordPress. Quand elles ne sont pas complètement oubliées, elles sont réalisées d’une manière assez approximative.

La technique la plus utilisée consiste à créer des regex pour transformer automatiquement d’anciennes url vers le nouveau modèle d’urls. Un système qui peut convenir pour une majorité de posts mais en aucun cas pour l’intégralité.

Je me suis donc tourné vers le plugin le plus utilisé dans ce cadre : “Redirection”.

Afin de créer l’intégralité des redirections, j’ai donc souhaité créer un fichier csv qui permettent d’effectuer le matching de toutes les urls.

Et pour cela j’ai utilisé une technique très simple bien qu’apparemment personne ne l’utilise, j’ai utilisé tout simplement les fichiers sitemaps de l’ancien blog et du nouveau ! Les fichiers sitemaps sont un catalogue de l’ensemble des contenus d’un blog, il s’agit donc de l’élément idéal pour effectuer le matching.

Ce matching a de plus été effectué très simplement puisque je n’ai appliqué qu’un simple tri alphabétique sur les urls regroupées pour avoir un matching exact à 100%.

image

Je me suis arracher les cheveux pour arriver à faire comprendre mon beau csv au plugin Redirection… Pour finalement laisser tomber en concluant que ce plugin ne fonctionne pas avec IIS…

Je me suis donc tourné vers une solution de plus bas niveau, le module d’url rewriting de IIS7 qui permet d’effectuer des redirections d’url.

Ce module stocke dans le web.config les urlmaps que l’on définit, j’ai donc écrit une moulinette afin de transformer mon csv en éléments xml que j’ai inséré dans le fichier de config pour parvenir à mes fins.

Et me voilà donc enfin sur wordpress, avec un blog fonctionnel et personnalisable que je vais pouvoir m’empresser de remplir de contenu !

image

Relooking d’été

Comme tous les ans, je profite de la période des vacances d’été afin de faire évoluer
ce blog en changeant son apparence ou en ajoutant des fonctionnalités.

Cette année aucune modification graphique n’a été apporté sur le thème utilisé, j’ai
cependant ajouté plusieurs fonctionnalités.

Comme vous avez pu le lire via le précédent post, le système de gestion
des commentaires est à présent basé sur DISQUS
. DISQUS permet de bénéficier
d’un affichage ergonomique des commentaires basés sur des threads et vous permet de
vous identifier via votre compte Facebook, Twitter ou encore OpenID :image

J’ai également rajouté la barre Wibiya en
bas de page
:

image

Cette barre permet de fournir des fonctionnalités de navigation tels l’affichage synthétique
des derniers posts, mais également de traduire les posts en différentes langues (pratique
pour ceux qui arrivent sur mon blog via mes
tweets
) :

image image

 

Et enfin, la barre propose une intégration avec Twitter qui vous permet de consulter
mes derniers tweets et de tweeter à votre tour à propos des différents posts du blog
:

image

C’est tout pour cette année, n’hésitez pas à m’indiquer ce que vous en penser, à faire
vos remarques et suggestions !

image

Installer DISQUS sur DasBlog

DISQUS est un excellent service de gestion de commentaires :

image

Celui-ci permet de gérer l’authentification des utilisateurs via Facebook Connect,
Twitter, OpenID ou encore via un compte DISQUS. Ce qui est idéal afin d’avoir des
informations sur les visiteurs qui commentent les posts sans avoir à les forcer
créer de nouveaux comptes. De plus l’affichage et l’ergonomie est bien meilleure que
les systèmes de commentaires présénts sur la plupart des moteurs de blog. Pour plus
d’infos, je vous recommande vivement d’aller jeter un oeil sur http://www.disqus.com afin
d’avoir un bref aperçu de l’ensemble des services proposés (et il y en a beaucoup
: intégration des réactions saisies sur Twitter, Widgets d’affichages des posts les
plus commentés, etc…).

L’intégration de DISQUS se fait de manière assez simple pour les moteurs de blogs
les plus courants tels que WordPress, Blogger, TypePad, etc. mais n’est pas si simple
pour les blogs basés sur DasBlog. Je vous propose donc un petit tutorial afin de vous
faciliter la tâche si vous souhaitez vous aussi intégrer DISQUS à votre blog basé
sur DasBlog.

La gestion des commentaires ne se fait pas via une macro DasBlog mais via un usercontrol.
Il vous faut donc modifier manuellement le fichier CommentViewBox.ascx.

S’agissant dans mon cas d’une migration du système de commentaires pour passer vers
DISQUS, j’ai décidé de laisser l’affichage des commentaires existants de mon blog
tout en proposant la saisie des nouveaux via DISQUS. Ainsi les posts existants ayant
des commentaires continueront d’afficher les commentaires existants tout en permettant
la saisie des nouveaux via le nouveau système, et quand aux nouveaux posts, ceux-ci
n’afficheront que les commentaires saisis via DISQUS.

Pour cela j’ai rajouté une div avec la class CommentBoxStyle (afin de s’intégrer correctement
d’un point de vue design) juste après la div ayant pour id “CommentViewContent”. Div
qui va contenir le code générique #1 de DISQUS. Dans mon cas : image

A noter que j’ai également masqué la div “commentViewEntry” via un style=”display:none”
afin d’interdire toute saisie de commentaire via l’ancien système.

Afin d’afficher le nombre de commentaires saisis via DISQUS il faut rajouter une url
spécifique contenant une ancre nommée #disqus_thread. Ce lien sera modifié dynamiquement
via javascript afin d’indiquer ce nombre. Pour cela, modifier le fichier itemTemplate.blogtemplate
de votre thème comme ceci :

image

Enfin dernière étape, il faut donc ajouter ce fameux javascript. Pour cela modifier
le fichier homeTemplate.blogtemplate et ajouter le snippet #2 avant la fermeture de
la balise body :

image

Afin directement les commentaires au sein de chaque post, je vous recommande d’activer
l’option suivante (je ne comprends vraiment pas pourquoi elle ne l’est pas par défaut…)

image

Voilou, n’hésitez pas à tester le nouveau système de commentaires !

image

Editer DasBlog sous Visual Studio 2010

Si vous souhaitez modifier le moteur de blog DasBlog sous Visual Studio 2010 vous
risquez de rencontrer différents problèmes.

Lors de l’ouverture de la solution 2008, la conversion automatique ne fait pas le
travail tout à fait correctement puisque l’on se retrouve avec le message d’erreur
suivant : 

C:ProjectsDasBlogsourcenewtelligence.DasBlog.Webnewtelligence.DasBlog.Web.csproj(1529,123):
The expression "$("".VSVersion)" cannot be evaluated. Method ‘System.String.VSVersion’
not found.

image

Afin de résoudre le problème éditez le fichier csproj et identifiez les lignes suivantes
:

image

Supprimez-les et remplacez-les  par l’import suivant :

<Import Project="$(MSBuildExtensionsPath)MicrosoftVisualStudiov10.0WebApplicationsMicrosoft.WebApplication.targets"
/>

Tout devrait alors rentrer dans l’ordre, vous devriez être capable d’éxécuter et modifier
DasBlog afin de l’adapter à vos besoins :

image