Développement Article

De l’importance de mettre WordPress à jour

Effectivement mettre WordPress à jour est très important pour éviter de se faire hacker son site. J’en ai vécu l’expérience il y’a quelque temps et ce n’est pas très marrant d’avoir à nettoyer son serveur surtout que les hackers ont des methodes de plus en plus sophistiqués pour planquer du code n’importe où. Je vais donc ici donner quelques solution pour toujours rester à jour.

Stop à la procrastination 

Lorsque vous arrivez sur votre blog pour écrire un nouveau post, pensez à mettre à jour vos plugin et votre version de WordPress. Je dis stop à la procrastination car effectivement, on a vite fait de se dire que ce n’est pas important et que cela peut attendre. Mais une mise à jour est souvent accompagnée d’un fixe d’une vulnérabilité.

Installer un plugin qui vous enverra des notifications de mise à jour

Depuis que je me suis fait hacké, je ne prend plus de chance, toutes les semaines je reçois un rapport qui m’indique les mises à jour à faire (entre autre). Ce qui me permet d’aller tout de suite faire les mises à jour et de jamais rester trop longtemps exposé à une  vulnérabilité.

Ce plugin s’appelle WP Security Scan, il vous donnera aussi pas mal d’information utile pour sécuriser votre blog WordPress. Ce plugin est fourni par la compagnie Website Defender.

Conclusion

J’espère que ces informations seront utiles et si vous le saviez déjà, prenez juste ce post comme une piqûre de rappel 😉 J’essayerais de faire un post un peu plus long sur WP Security Scan bientôt.

 

Rendre les données humaines

De nos jours nous sommes entourés, submergés de données. Que ce soit les médias, les réseaux sociaux, les blogs ou que sais-je encore nous sommes en permanence soumis à des données plus ou moins compréhensible.

Il est presque impossible de pouvoir lire, comprendre et analyser ces données de façon manuelle lorsqu’elle sont en trop grande quantité. C’est là qu’intervient le « data visualization ».

De plus en plus je m’interesse à la visualisation de ces donneés et un collègue m’a partagé cette vidéo (tiré de TedX Vancouver) que j’ai trouvé vraiment interessante. La personne qui fait la conférence est Jer Thorp un designer assez puissant dans ses idées et ses réalisations. Le gars a tout même un beau portfolio puisqu’il a travaillé pour The New York Times, The Guardian, Scientific American, The New Yorker, and the CBC. 

Protéger vos .svn en production

Une chose à laquelle on ne pense pas souvent lorsqu’on passe en production un projet, c’est de supprimer / bloquer l’accés aux fichiers .svn. Ces fichiers ont beau être des fichiers cachés, ils n’en sont pas moins accessibles via un navigateur. Je vous conseille de faire le test avec votre serveur, vous serez surement surpris ! Il est important de protéger ces fichiers qui peuvent contenir de l’info utile à un pirate qui voudrait s’amuser sur votre serveur.

Pour se protéger, il existe 2 façons de faire : 

Faire un svn export de votre projet

C’est interessant car en faisant cela on enlève radicalement le problème puisqu’on supprime les .svn de chaque répertoire. Cependant, ce n’est pas forcément la meilleure solution car vous ne pourrez plus interagir avec votre serveur SVN, plus de « svn up » possible. Solution efficace donc, mais pas très pratique.

Faire un fichier .htaccess qui va bloqué l’accés aux .svn

L’autre solution est donc de mettre en place un fichier .htaccess à la racine de votre projet avec les lignes suivantes : 

RewriteEngine on
# Hide .SVN Folders
RewriteRule ^(.*/)*\.svn/ / [F,L]

Cette solution vous permet de garder les avantages du svn mais empêche l’accés au .svn. J’utilise personnellement cette 2ème solution.

Conclusion

Juste faites le ! C’est toujours mieux de prévenir que de guérir en sécurité.

 

 

 

Les « Custom Post » de WordPress

Comment transformer votre WordPress en un puissant CMS ? Voici le but de ce post ! Nous allons utiliser une fonctionnalité appelée Custom Post. Qu’est qu’un Custom Post ?  Il s’agit de créer un nouveau type de post avec des champs personnalisés pour répondre à vos besoins. Par exemple on va pouvoir ajouter une rubrique Portfolio, Clients, Projets, Recettes …

Comment mettre en place les Custom Post

La plupart de ce que l’on va faire se fait dans le fichier function.php (à la racine de votre thème). Pour notre exemple nous allons créer un nouveau type de posts Projets avec 2 champs personnalisés : Ville et Pays.

Déclaration du Custom Post

Pour commencer on va dire à WordPress que nous souhaitons créer un nouveau type de post. Voici le codex de wordpress qui explique les différents arguments que l’on peut passer à cette fonction : register_post_type

register_post_type('projet', array(
  'label' => __('Projets'),
  'singular_label' => __('Projet'),
  'public' => true,
  'show_ui' => true,
  'capability_type' => 'post',
  'hierarchical' => false,
  'supports' => array('title', 'author', 'thumbnail')
));

Création des champs personnalisés

Lorsqu’on crée un type de post, on peut aussi y ajouter différents champs personnalisés pour ce type de post. Dans notre cas, on veut ajouter Ville et Pays qui définiront un projetJe vous laisse regarder les paramètres de la fonction add_meta_box.

La description, le titre et le thumbnail sont ajoutés lors de la déclaration de notre nouveau type de post (paramètre supports)

function admin_init(){
  add_meta_box("city_projet", "Ville du projet", "city_projet",   "projet", "normal", "high");
  add_meta_box("country_projet", "Pays du projet", "country_projet", "projet", "normal", "high");
}

Définition des champs personnalisés

Ici on va déterminer le type d’affichage que l’on veut pour nos champs personnalisés dans le panneau d’admin. On peut alors définir le type de champ dans le formulaire input text, textarea, select …

function city_projet(){
 global $post;
 $custom = get_post_custom($post->ID);
 $city_projet = $custom["city_projet"][0];
?>
 <input size="70" type="text" value="<?php echo $city_projet;?>" name="city_projet"/>
<?php
}

function country_projet(){
 global $post;
 $custom = get_post_custom($post->ID);
 $country_projet = $custom["country_projet"][0];
?>
 <input size="70" type="text" value="<?php echo $country_projet;?>" name="country_projet"/>
<?php
}

Fonction de sauvegarde des champs personnalisés

Il faut ensuite créer les fonctions qui vont permettre la sauvegarde en base de données des champs personnalisés. En gros quelles actions veut-on entreprendre lorsque l’on clique sur Save Draft / Publier ou aussi lors de la sauvegarde automatique.

function save_custom_projet(){
 global $post;
 if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) {
 	 return $postID;
 }
 update_post_meta($post->ID, "url_projet", $_POST["url_projet"]); //enregistrement dans la base de données
 update_post_meta($post->ID, "country_projet", $_POST["country_projet"]);
 update_post_meta($post->ID, "city_projet", $_POST["city_projet"]);
}

On met le tout en action

La dernière étape consiste à appeler les fonctions que l’on vient de créer plus haut. Sans cela, rien ne se passera et votre nouveau « Custom Post » ne fonctionnera pas correctement.

add_action("admin_init", "admin_init");
add_action('save_post', 'save_custom_projet');

Voici le résultat en image

Conclusion

Cette nouvelle fonctionnalité de WordPress (ajouté à la version 3) permet concrètement de tourner WordPress en un CMS puissant et malléable.

Si vous avez des questions, n’hésitez pas, j’essayerais d’y répondre au maximum de mes connaissances.

Internationalisation WordPress avec QTranslate

J’ai récemment eu à mettre en place un site sous WordPress en anglais et en français. Pour cela j’ai eu recourt au fabuleux plugin QTranslate. Ce plugin est vraiment bien intégré et permet de pouvoir traduire tout ou presque en 2 ou plusieurs langues. Voici une petite présentation du plugin.

Interface administrateur

L’interface du plugin est vraiment bien construite, on s’y retrouve très vite et la configuration se fait très simplement. Il suffit de choisir les langues que l’on veut utiliser et en choisir une par défaut. D’autres options comme la gestion des dates, la gestion de l’url (?lang=fr ou /fr/) sont aussi disponibles.

Intégration du plugin dans wordpress

Une fois la configuration effectuée, l’administration du blog se retrouvera modifié en conséquence. Aussi bien les pages d’administration des posts, des catégories, des page seront adapté aux langues que vous avez choisi. Ainsi pour le contenu par exemple on aura 2 tabs pour choisir sa langue.

Quelques snippets pour Qtranslate

Je partage avec vous ici quelques bouts de code qui m’ont été utile lors du développement. Pour ceux qui doivent mettre les mains dans le cambouis, j’espère que ça vous aidera.

Pour écrire du texte en dur et qu’il soit pris en fonction de la langue courante :

<?php echo __('[:fr]Profil[:en]Profile'); ?>
<?php the_content(__('[:fr]Lire la suite[:en]Read more')); ?>

Pour placer le selecteur de langue : 

<?php qtrans_generateLanguageSelectCode(); ?>

La fonction ci dessus va généré le code HTML suivant :

<ul class="qtrans_language_chooser">
<li class="active"><a href="/qtranslate/faq/" class="qtrans_flag qtrans_flag_en"><span>English</span></a></li>
<li class="active"><a href="/de/qtranslate/faq/" class="qtrans_flag qtrans_flag_de"><span>Deutsch</span></a></li>
</ul>

Pour mettre du style css sur cette liste, utilisé les selecteurs css suivants :

.qtrans_language_chooser ul {
  padding-top:0px;
}

.qtrans_language_chooser li {
  font-size:0px;
	display:inline-block;
	height:19px;
	width:54px;
	list-style-type: none;
}

.qtrans_language_chooser li > a{
	display:inline-block;
	height:19px;
	width:54px;
}

.qtrans_language_chooser li.lang-en{
  background-image: url(./images/lang-en.png);
}

.qtrans_language_chooser li.lang-en.active, .qtrans_language_chooser li.lang-en:hover{
  background-image: url(./images/lang-en-active.png);
}

.qtrans_language_chooser li.lang-fr{
  background-image: url(./images/lang-fr.png);
}

.qtrans_language_chooser li.lang-fr.active, .qtrans_language_chooser li.lang-fr:hover{
  background-image: url(./images/lang-fr-active.png);
}

Conclusion sur QTranslate

Qtranslate se révèle être un outil très interessant et facile à utiliser pour la tâche parfois complexe qu’est l’internationnalisation. L’utilisation est très facile et l’intégration est parfaite dans presque toutes les parties du blog. Le seul bémol serait qu’il ne permet pas d’avoir 2 url différentes pour un même post / page / catégorie, c’est un point négatif qui peut biaiser quelque peu votre SEO. Mis à part ce petit défaut qui sera peut-être corrigé dans les versions futures, ce plugin fait la job comme il faut 🙂