Bonne Année 2014

Nicolas, le 31 déc 2013

Je vais pas me leurrer, j’ai toujours autant de mal à tenir la cadence de rédaction que je souhaiterais avoir. Les articles à rédiger s’entassent et j’ai beau essayer de m’organiser pour dédier un peu de temps à ce journal, il vient toujours quelque chose pour venir dérégler la frelle mécanique.

Alors, je me fais une raison et évite de me faire du mauvais sang et je vais me contenter, en ce dernier jour de 2013, de vous souhaitez une très bonne année 2014.

Voilà qui est fait.

#blog

Ghost : retours d’usage

Nicolas, le 12 nov 2013

Ce qui me manque :

  • Un autosave des articles en cours de rédaction (je suis suffisament maladroit pour avoir déjà perdu quelques dizaine de lignes pour des raisons diverses)
  • Un correcteur d’orthographe intégré (ça m’éviterait de vérifier mes écrits dans Page avant publication)
  • Une balise title pour les liens (ça faciliterait l’accessibilité du blog)
  • Eviter d’avoir à relancer Ghost parce qu’on a fait des modifications sur les fichiers .hbs
    Que le volet Preview soit un vrai preview, prenant en compte le CSS du thème.
  • Une liste de tags pour s’y retrouver un peu et en optimiser l’usage.

Au chapître des bugs :

  • Rien de bloquant ni d’exceptionnel pour une version si jeune (0.3.2 pour celle que j’utilise et 0.3.3 pour la dernière en date).
  • A noter quand même le comportement parfois un peu caractériel de l’interface avec le système Markdown (ou j’ai du mal à l’apprivoiser).

Pour le reste, rien à redire, c’est efficace. J’espère que Ghost va vraiment être fidèle à cet ADN blog et éviter de se surcharger de fonctions annexes. A moins qu’on puisse les filtrer.

#blog

Migration de WordPress vers Ghost

Nicolas, le 09 nov 2013

Attention, ce blog n’est plus mis à jour. Je laisse les articles passés ici pour archive, mais pour lire les nouveaux articles, je vous invite à vous rendre sur http://blog.nicolasgut.com.

Après quelques semaines de test du moteur de blog Ghost, tournant sous node.js et connecté à une base SQL, je suis assez satisfait de la facilité et l’efficacité du service. Même si mon thème est encore assez basique (un hack du thème Casper), je me laisse un peu de temps pour fouiller les possibilités qui s’offrent à moi pour produire (et partager avec vous) un thème préparé aux petits oignions.

Ce « nouveau » blog reprend les articles de la technobiosphere, tout en étant mis à jour 2 à 3 fois par jour (je vais essayer de m’y tenir), et traitera de sujets assez généralistes tout en collant d’avantage à mes préoccupations professionnelles.

Mettez vos liens et vos flux RSS à jour, c’est par ici que ça se passe !

A tout de suite.

#blog #subjectif

Migration de WordPress vers Ghost

Nicolas, le 27 oct 2013

Je suis en train de tester en long, en large et en travers le CMS Ghost pour, si tout se passe bien, effectuer une migration de ce blog.
En attendant confirmation et le temps que je règle tout bien comme il faut (le serveur qui s’avère un peu caractériel, les plug-ins sociaux et pondre un joli thème), je vais poster mes articles ici et .
Au moment où la migration sera effective, j’en ferai l’annonce et je verrai si je garde le contenu ici, en archive ou si je renvoie de manière systématique vers la nouvelle url.
Affaire à suivre !

#blog

Ghost 0.3

Nicolas, le 21 oct 2013

C’est avec grand plaisir que je teste le moteur de blog Ghost, initié par John O’Nolan, financé à hauteur de 320000$ via Kickstarter, qui a la particularité de tourner sous mode.js.
L’installation en est simplisme, surtout en local, et l’interface est très facile d’usage. Il faudra simplement, au novice, s’habituer au système Markdown, et encore, on peut très bien gérer avec quelques tags html basiques.
Parfait pour revenir au blogging pur et dur sans s’encombrer de multiples fonctionnalités qui dépassent largement l’usage du journal personnel en ligne et perdent les grands amateurs (mon père, par exemple).
Le seul inconvénient que je lui trouve vient du fait que l’usage du node.js est encore très rare chez les hébergeurs courants. Heureusement, nous avons installé quelques blogs sous Ghost sur les serveurs de Quartr et je m’amuse à voir jusqu’où je peux pousser l’outil en matière de template et autres scripts d’import de mon contenu WP vers Ghost. Y a de fortes chances pour que ce blog tourne prochainement avec ce nouveau moteur. Je vous tiendrai au courant.
Attention, Ghost est en version 0.3, ce qui signifie que le projet est encore tout jeune et qu’il est forcément limité et pas exempt de bugs. A bon entendeur…
Si vous êtes intéressés par un blog sous Ghost, n’hésitez pas à m’envoyer un message.

#blog #média

Remplacer du contenu dans une table en base SQL

Nicolas, le 28 juin 2012

Souhaitant réutiliser l’ancienne url de ce blog, technobiosphere.com au lieu de blog.nicolasgut.com, je devais effectuer 2 modifications successives.
1. Modifier l’url du blog dans l’administration de WordPress (Réglages > Général)
2. Modifier l’adresse de tous les liens et images présents en « dur » dans les articles.
Pour ce faire, le plus simple est de directement remplacer blog.nicolasgut par www.technobiosphere directement dans la base de données.
Direction phpMyAdmin pour effectuer la modification :

UPDATE wp_posts SET post_content = REPLACE(column_name,"blog.nicolasgut","www.technobiosphere")

Et le tour est joué !

#blog #hack it yourself

Un peu de sécurité pour WordPress

Nicolas, le 11 mar 2012

Blog Security Unit

WordPress est un CMS très efficace et très simple pour mettre en place un blog ou site web dynamique. Mais se contenter de l’installer et d’y poster des articles n’est pas suffisant pour garantir, dans le temps, son bon fonctionnement et surtout, sa sécurité.
Quelques règles simples permettent aisément de s’assurer qu’on ne laisse pas traîner de grosses failles et rendre un peu plus complexe le piratage de WordPress. Attention, rien d’impénétrable, mais de quoi éviter les catastrophes à la moindre intrusion maligne.

Mettre à jour WordPress

Chaque nouvelle version de WordPress arrive avec son lot de pansements pour les failles qui ont pu être découverte dans la précédente version. C’est une bonne et donc une bonne raison d’en profiter. D’autant qu’en publiant la liste des patchs et des failles, WordPress délivre des solutions simples pour pénétrer l’ancienne version, rendant cette dernière d’autant plus vulnérable.

Sauvegarder son WordPress

Sauvegarder est une bonne solution pour retrouver son blog ou son site en cas de gros problème. Il faut procéder en 2 étapes :
– Sauvegarder l’ensemble des fichiers qui se trouvent sur votre serveur à l’aide de votre client FTP
– Sauvegarder le contenu de la base de données en utilisant, par exemple, le plugin WP-DBManager qui permet différents modes de sauvegarder ainsi qu’une fonction d’optimisation des bases de données. On en profitera pour vérifier la « santé » de son installation WordPress avec le plugin Health Check.
Il est impératif d’effectuer ces opérations régulièrement et non uniquement lors des mises à jour de WordPress. Si j’avais été sérieux concernant ce point, je n’aurais pas eu autant de difficultés à retrouver le contenu de mon blog après une mauvaise manipulation dans la gestion de mes bases de données !
Quand je dis « régulièrement », je pense à toutes les 2 semaines à une fois par mois au maximum.

Ne pas utiliser le login « admin » donné par défaut

Tout est dit. Mais si vous avez déjà créé votre compte avec le login « admin », vous ne pouvez pas simplement le changer. Le login ne peut être changé avec WordPress. Alors comment faire ? Il suffit de créer un nouvel utilisateur en lui donnant le statut d’administrateur, se connecter avec ce nouveau compte et de détruire l’ancien. Il faudra alors attribuer les articles au nouveau compte.

Un mot de passe sérieux

Quitte à se créer un nouveau compte, autant choisir un mot de passe qui joue vraiment son rôle. Eviter les « 1234567 », « azertyu », « password », etc ! Prendre un mot de passe plutôt long (plus de 7 caractères), avec majuscules/minuscules, espaces, ponctuations et chiffres. Je dois avouer que j’utilise une phrase complète que je retiens facilement mais qui fait plus de 15 caractères.
Il peut être bon de changer ce mot de passe régulièrement.

Masquer les notifications d’erreurs de connection

Toujours concernant le couple login/mot de passe, il est intéressant de masquer les notifications d’erreurs lors de connections ratées. En effet, ces notifications donnent des indices qui permettent, par élimination, de faciliter l’intrusion.
Pour ce faire, éditez le fichier functions.php de votre thème et ajoutez cette ligne :
add_filter(‘login_errors’,create_function(‘$a’, « return null; »));

Changer le préfixe wp_ des tables des bases de données

Si vous n’avez pas encore installé votre blog ou que le coeur vous en dit de faire les modifications (attention quand on joue avec les bases de données et les fichiers de configuration), changer le préfixe wp_ des tables est une barrière supplémentaire aux intrusions. A l’installation, modifiez la ligne ad hoc dans le fichier wp-config.php.
$table_prefix = ‘wp_';

Protégez le fichier wp-config.php

La seule fois où mon blog a été « squatté », c’est ce fichier qui avait été modifié. Pour empêcher ce genre d’incursion, il faut modifier le fichier .htaccess du répertoire en ajoutant les lignes suivantes :
# protect wp-config.php
<files wp-config.php>
Order deny,allow
Deny from all
<⁄files>

Utilisation des clés d’authentification WordPress

On trouve ça dans le fichier wp-config.php et ça permet simplement de compliquer le décryptage des données. Tout comme les mots de passe, on peut renouveler l’opération régulièrement.
* Clefs uniques d’authentification et salage.
*
* Remplacez les valeurs par défaut par des phrases uniques !
* Vous pouvez générer des phrases aléatoires en utilisant
* {@link https://api.wordpress.org/secret-key/1.1/salt/ le service de clefs secrètes de WordPress.org}.
* Vous pouvez modifier ces phrases à n’importe quel moment, afin d’invalider tous les cookies existants.
* Cela forcera également tous les utilisateurs à se reconnecter.
*
* @since 2.6.0
*/
define(‘AUTH_KEY’, ‘put your unique phrase here’);
define(‘SECURE_AUTH_KEY’, ‘put your unique phrase here’);
define(‘LOGGED_IN_KEY’, ‘put your unique phrase here’);
define(‘NONCE_KEY’, ‘put your unique phrase here’);
define(‘AUTH_SALT’, ‘put your unique phrase here’);
define(‘SECURE_AUTH_SALT’, ‘put your unique phrase here’);
define(‘LOGGED_IN_SALT’, ‘put your unique phrase here’);
define(‘NONCE_SALT’, ‘put your unique phrase here’);

Voilà qui est déjà pas mal et, même si rien n’est imparable, ces mesures devraient quand même renforcer votre précieux blog ou site. Et pour les free-lances qui me lisent, vous pourrez rajouter « sécurisation » dans votre prestation :-)

#blog #hack it yourself

Histoire d’archives

Nicolas, le 08 mar 2012

Depuis que j’ai malencontreusement effacé la base de données de mon blog, je me suis efforcé, à plusieurs reprises, de reconstitué les archives disparues. Entre des sauvegardes locales liées à l’usage du logiciel Ecto pour la rédaction des articles, des backups de BDD et le site Wayback Machine (qui donne des versions gardées en cache des sites web).
Voilà aujourd’hui que la tâche est terminée. La quasi totalité des articles de décembre 2004 à aujourd’hui sont à nouveau en ligne. Bien sûr, les images sont (beaucoup) plus petites dans les anciens articles, la mise en page peut parfois être un peu chamboulée et surtout, il manque une très grande quantité d’images d’aperçu (que j’utilise pour les articles liés).
Petits problèmes inhérents à plus de 7 ans de rédaction que je récupère au cours de mes petites balades dans le temps.

#blog

Nouveau thème

Nicolas, le 11 mai 2011

Vous n’avez pas pu passer à côté. J’ai changé le thème de ce blog. L’ancien template datait déjà de quelques années et un petit coup de dépoussiérage était le bienvenu. D’autant que ça m’a fait un très bon exercice pour mettre en pratique mes derniers apprentissages de CSS3.
Au programme :
– page infinie avec JQuery
– un champs de recherche animé
– un design global totalement épuré
– intégration d’une page flickr succincte (encore en cours de conception) et une page twitter (qui pourrait être améliorée)
– l’uniformisation du design sur le tumblr
Pas mal de travail, d’autant que le CSS3 et IE ne font pas bon ménage du tout ! Je dois travailler tout ça prochainement.
Comme vous pouvez l’imaginer, j’ai fait en sorte que l’ensemble soit propre, mais je suis conscient qu’il reste du travail pour perfectionner tout ça. Et puis, il faudra que je m’assure du bon affichage sur iPhone et iPad sans passer par des plug-in exotiques !

#blog

CSS3 : opacité des images et couleur du texte sélectionné

Nicolas, le 03 mai 2011

A mes minutes (heures, c’est trop long) perdues, je me replonge avec bonheur dans le HTML et le CSS. Le premier étant passé en version 5 et le second en version 3, j’ai de quoi assurer un bon moment de plaisirs et de (re)découvertes.
Parce que c’est vraiment la sensation que j’ai : redécouvrir le html et le css, ainsi que leur champs drastiquement élargi.

Alors, je m’amuse à faire quelques tests sur ce présent blog avant de me lancer dans une refonte complète du template (oui, ça ne va pas tarder après quelques années sans changement de thème).

J’avais déjà évoqué comment embarquer une police dans la page html avec le css dans un précédent article.

Attaquons-nous à des fonctions qui peuvent paraître aussi nécessaires qu’un gif animé, mais qui pourraient être nettement plus pertinentes en d’autres circonstances.

Modifier l’opacité d’une image au survol par la souris
Idéal pour des menus imagés, pour mettre en avant une image dans une gallerie, ces quelques lignes de code sont loin d’être compliquées.
La première partie modifie l’opacité (alpha) par défaut de l’ensemble des images de la page ( img { } ) en établissant la valeur à 75% (opacity:0.75;) de l’opacité « normale ». Comme mon fond est blanc, ça aura comme conséquence d’éclaircir l’image.
La deuxième partie modifie l’opacité au survol des images par la souris ( img:hover { } ) en rétablissant l’opacité complète (opacity:1;).
On note que dans les 2 parties, on ajoute une ligne de code pour assurer une transition linéaire douce entre les 2 valeurs de l’opacité sur une durée de 0.7s.

img {
-webkit-transition: opacity 0.7s linear;
opacity: 0.75;
}
img:hover {
-webkit-transition: opacity 0.7s linear;
opacity: 1;
}

Changer la couleur de sélection du texte
Ici aussi, de la pure cosmétique avec le changement de la couleur de sélection du texte. Au lieu de compter sur la couleur par défaut de mon navigateur (bleu ciel), j’ai décidé de me mettre en accord avec la charte du blog : le orange.
La première partie du code s’en charge très bien en établissant la valeur hexadécimale de la couleur de sélection à #FF8000 (mon « orange »).
La deuxième partie du code est optionnelle. Je l’ai composée pour éviter que la sélection ne dépasse littéralement de la ligne de texte (elle avait la fâcheuse tendance d’empiéter sur la sidebar). Phénomène que j’ai croisé très souvent sur le web, mais qui semble ne gêner que moi. Cette ligne de code n’a pour seul intérêt que de masquer ce qui « sort » de la zone nommée « content », zone qui délimite le texte dans mon thème.

::-moz-selection {
background:#FF8000;
}
::selection {
background:#FF8000;
}

#content {
overflow: hidden;
}

Voilà, vous savez tout. Amusez-vous bien.

#blog #hack it yourself #sciences