Difficile de sortir ce blog de sa torpeur actuelle. Le dernier article remonte au mois de mai, et je vous avoue que même si j’ai depuis lancé un autre blog orienté photo (et deux trois autres trucs), je ne produis pas autant de contenus que je le souhaiterais.

J’expérimente donc actuellement une nouvelle façon de bloguer, qui semble pour l’instant fonctionner : reprendre l’habitude d’écrire régulièrement en rédigeant chaque jour de courts articles en mode Bloc Notes, principalement orientés autour de la veille que je réalise chaque jour. L’idée est à la fois de partager mes trouvailles et de les stocker (proprement) à un endroit facilement accessible.

Pour cela, j’ai mis en place quelques outils qui me permettent de gagner du temps et publier de manière simple, rapide et efficace mes billets.

Scriptogr.am, ton blog dans ta Dropbox

Le premier d’entre eux est tout simplement le support visible, la partie émergée de l’iceberg : mon espace scriptogr.am. Scriptogr.am, c’est une plateforme de blogs très particulière : alors que certaines plateformes stockent le contenu que vous produisez sur leurs serveurs, et s’en servent pour glisser des liens d’affiliation, l’idée derrière ce service est très simple. Il s’agit de faire en sorte que le contenu de votre blog soit stocké chez vous.

Et ça fonctionne très simplement : un répertoire local sur votre ordinateur contient des fichiers, qui correspondent chacun à un article ou une page de votre blog. Quand vous lui demanderez (id est, quand vous cliquerez sur le bouton Synchronize de votre compte), Scriptogram ira télécharger chacun des fichiers, et génèrera la structure de votre site en conséquence : pages, articles, tags, pagination, archives … Un véritable blog, simpliste certes, mais qui remplit tout à fait son rôle.

La question est tout de même de savoir comment ce service accède à des fichiers stockés sur votre ordinateur. Et la réponse est très simple : c’est une application DropBox ! Si vous n’avez pas encore de compte sur ce service merveilleux, sortez de votre grotte utilisez ce lien pour bénéficier de 500Mo d’espace supplémentaire et gratuit 😉

Résumons la situation : j’ai donc un blog sur un service gratuit (pour l’instant), je reste maître de mon contenu et peux le republier facilement ailleurs si ce service venait à fermer, et mon contenu est stocké sur mon ordinateur et accessible depuis n’importe où grâce à DropBox. Dois-je également préciser que DropBox gère nativement le versioning de fichiers ?

Markdown ou HTML, vous avez le choix

Scriptogram promeut l’utilisation de Markdown comme langage de marquage, en parallèle du HTML : vous pouvez donc utiliser l’un ou l’autre dans vos articles, en-têtes de fichiers exceptées. Celles-ci devront en effet respecter la syntaxe suivante :

Title: Mon titre
Date: 1970-07-01 14:00
Tags: mot clé, mot clé
...

Le HTML permet une large compatibilité, tandis qu’après un temps d’adaptation Markdown peut faire gagner pas mal de temps de formatage.

Le flux RSS

Par défaut Scriptogram génère automatiquement un flux RSS reprenant les articles de votre blog.
Malheureusement celui-ci n’apparaît pas visuellement sur la plupart des thèmes. Cela peut s’avérer assez problématique pour les visiteurs qui souhaitent s’y abonner. Heureusement, il est assez facile d’y remédier.

Il suffit en effet de créer un article contenant les lignes suivantes (en prenant soin de remplacer « username » par votre nom d’utilisateur) :

Title: RSS
Type: page
Link: http://scriptogr.am/username/rss

De même que Tags ou Date, Link et Type font partie des éléments d’en-tête optionnels des fichiers de votre blog scriptogram, appelés variables globales au même titre que Slug, Published ou encore Excerpt. Seul Title est réellement obligatoire.

Type permet de spécifier le type d’article :

• par défaut post, un article normal qui apparaîtra dans votre flux (et donc pas besoin de renseigner le Type)
• ou bien page, une page qui sera liée depuis toutes les autres pages du site, comme sur WordPress par exemple.

Quant à Link, il permet de lier directement à un contenu externe (autrement dit n’importe quelle URL).

Pour plus de détail concernant les autres variables globales, consultez la documentation.

Installer Disqus pour les commentaires

Un blog sans commentaires, ça n’est pas vraiment un blog. Malheureusement cette fonctionnalité n’est pas gérée par Scriptogram, et c’est en effet tout à fait compréhensible puisque ce serait assez contraire au concept de base du service.

Ce choix est d’autant plus facile à comprendre puisqu’il est possible de mettre en place cette fonctionnalité grâce à des services externes, comme Disqus. L’avantage de Disqus est que là encore, vous restez maître des données.

Une fois votre compte créé sur la plateforme, l’ajout du formulaire à votre blog est assez simple. Rendez-vous sur votre Dashboard Scriptogram, dans l’onglet Tools, et accédez à l’éditeur HTML (voir ci-contre).

Cherchez ensuite dans la partie de gauche (le code source du template) la balise , qui définit la partie du template spécifique aux pages d’articles, et ajoutez là où vous le jugez adéquat (quelques lignes au-dessus de a priori) le code fournit par Disqus, qui devrait ressembler à ceci :

</pre>
<div id="disqus_thread"></div>
<pre>
<script type="text/javascript">// <![CDATA[
  var disqus_shortname = 'diije-blocnotes';
  (function() {
    var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
    dsq.src = 'http://' + disqus_shortname + '.disqus.com/embed.js';
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
  })();
// ]]></script>
<noscript>Merci d'activer JavaScript afin d'afficher les <a href="http://disqus.com/?ref_noscript">commentaires propulsés par Disqus.</a></noscript>
<a class="dsq-brlink" href="http://disqus.com">commentaires propulsés par <span class="logo-disqus">Disqus</span></a>

Pensez à remplacer la valeur de disqus_shortname par celle qui correspond à votre site sur Disqus. Et notez que dans l’onglet Tools, vous pourrez également accéder à l’éditeur CSS, et personnaliser l’apparence de votre site.

Enfin, pour les plus aventuriers d’entre vous, sachez que Disqus propose également d’afficher un compteur des commentaires de chaque article. Première étape, ajoutez le code suivant juste avant la balise </body> (en remplaçant là encore la variable disqus_shortname 😉 ) :

<script type="text/javascript">// <![CDATA[
var disqus_shortname = 'diije-blocnotes';
(function () {
    var s = document.createElement('script'); s.async = true;
    s.type = 'text/javascript';
    s.src = 'http://' + disqus_shortname + '.disqus.com/count.js';
    (document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
}());
// ]]></script>

Il vous faudra ensuite ajouter à l’endroit où vous souhaitez voir le compteur s’afficher le code suivant :

<a href="#disqus_thread"></a>

Dernier point concernant les commentaires : si vous le souhaitez vous pouvez via l’interface d’administration de Disqus personnaliser le texte affiché par le compteur. Et y adjoindre du code HTML : de quoi améliorer l’apparence du compteur si vous en avez envie.

Les images

Autre manque de Scriptogram, c’est l’insertion d’images dans les articles. Si la fonctionnalité est tout à fait correctement gérée grâce à HTML ou Markdown, vous devrez héberger vos images ailleurs.

Il est tout à fait possible de les héberger sur votre serveur FTP ou sur Flickr par exemple, mais si vous souhaitez là encore conserver tous les fichiers dans votre Dropbox, plusieurs solutions existent.

La plus simple, est de stocker directement ces images dans un répertoire de votre choix. Depuis quelques temps, DropBox a en effet supprimé la notion de dossier public pour rendre tous les fichiers partageables, quel que soit leur emplacement. D’un simple clic droit sur une image, rendez-vous sur Dropbox -> Partager le lien pour être renvoyé vers une page web comme celle-ci.
Pratique pour partager une galerie photo par exemple, mais malheureusement ceci n’est pas l’URL directe vers l’image, mais vers cette page avec boutons de partage et logos. Autrement dit, si vous utilisez ce lien, votre image ne s’affichera pas.

L’astuce est toute simple : il suffit de remplacer dans l’URL le www par dl (comme ceci) pour obtenir le lien vers le fichier lui-même 😉

Sublime : léger, rapide, efficace

Avant toute chose, sachez que Scriptogr.am propose via le Dashboard un formulaire d’ajout et d’édition d’articles, qui sauvegardera les nouveaux articles sous formes de fichiers dans votre Dropbox. Mais l’idée est de pouvoir utiliser son éditeur préféré, pour davantage de confort.

Sublime Text 2 est un excellent éditeur de code qui convainc un nombre toujours plus important d’utilisateurs, moi y-compris. Les raisons sont sans doute sa sobriété, sa rapidité, et ses nombreuses fonctionnalités qui permettent de gagner un temps considérable au quotidien.

Puisqu’il gère parfaitement la coloration syntaxique en HTML, et surtout en Markdown (de même que dans de nombreux autres langages), c’est tout naturellement que je l’utilise comme principal éditeur.

Avec quelques légères optimisations Sublime peut vous faire gagner un temps considérable, en particulier si vous souhaitez l’utiliser pour rédiger des articles pour Scriptogr.am.

Package Control

De la même manière qu’un apt sur certaines distributions Linux, il est possible d’adjoindre à Sublime Text un Package Manager qui vous permettra d’installer, de mettre à jour ou de supprimer très facilement des add-ons.
Ce gestionnaire de paquets s’appelle Package Control, et son installation est d’une simplicité enfantine : ouvrez Sublime Text, et cliquez sur View -> Show Console pour afficher la console.

Dans la console, collez et exécutez la commande suivante :

import urllib2,os; pf='Package Control.sublime-package'; ipp=sublime.installed_packages_path(); os.makedirs(ipp) if not os.path.exists(ipp) else None; urllib2.install_opener(urllib2.build_opener(urllib2.ProxyHandler())); open(os.path.join(ipp,pf),'wb').write(urllib2.urlopen('http://sublime.wbond.net/'+pf.replace(' ','%20')).read()); print 'Please restart Sublime Text to finish installation'

Relancez Sublime, et le tour est joué.

Paquet Scriptogram pour Sublime

Maintenant que vous avez installé Package Control, je vous recommande l’installation de Scriptogram, un add-on qui va vous permettre de pré-formater vos fichiers pour qu’ils correspondent aux spécifications de la plateforme du même nom.

L’installation est très simple :

1. Ouvrez Sublime Text 2
2. Tapez cmd+shift+P sous mac, ou ctrl+shift+p ailleurs, afin d’ouvrir la palette de commandes
3. Dans cette palette, tapez Package Control: Install Package
4. Une liste déroulante apparaît : cherchez le paquet Scriptogram et installez-le
5. Relancez Sublime Text

Désormais, il vous suffira d’ouvrir la palette de commandes et de taper Scriptogram pour que votre fichier en cours soit formaté.

Pour ceux qui souhaiteraient ajouter ou retirer des choses parmi les lignes ajoutées par ce script, sachez qu’il est très simple de modifier le code (en Python). Pour vous donner un exemple, j’ai forké le projet sur github.

Définir l’emplacement de sauvegarde

Dernière astuce qui peut vous faire gagner un temps fou sur Sublime : par défaut ce logiciel, comme tant d’autres, vous propose de sauvegarder vos fichiers un peu n’importe où, alternant plus ou moins aléatoirement entre le dernier emplacement de sauvegarde utilisé, et un obscur répertoire système.

Mais il est assez simple de configurer un emplacement de sauvegarde par défaut :

1. Ouvrez Sublime Text
2. Rendez-vous dans Preferences -> Settings Default
3. Ajoutez à la fin du fichier les lignes suivantes :

// Sets the default save directory for the view.
"default_dir": "/chemin/vers/mon/repertoire"

1. Pensez à ajouter une virgule à la fin de l’instruction précédente pour éviter les erreurs
2. Redémarrez Sublime Text

Bien évidemment, si vous configurez comme répertoire par défaut le répertoire de l’application Scriptogram dans votre Dropbox, vous gagnerez là encore quelques précieuses secondes.

Avec ces différentes étapes, vous disposez désormais d’un blog totalement opérationnel doublé d’un outil pour produire des articles de façon quasi industrielle. Mais si écrire des articles c’est bien, faire en sorte qu’ils soient lus c’est mieux.

IFTTT : la boîte à outils

Les habitués y auront pensé dès qu’on a parlé de flux RSS : le fameux IFTTT, le service qui permet de déclencher tout simplement des actions en fonction d’évènements, au travers de multiples services et sites web.

Ce service va dans les faits vous permettre par exemple de publier automatiquement un tweet lorsqu’une nouvelle entrée apparaîtra dans le flux RSS de votre blog.

Pour ce faire, nous allons utiliser une recette déjà créée par un autre utilisateur :

1. Créez votre compte sur la plateforme
2. Rendez-vous sur cette page et activez le Channel Twitter
3. Rendez-vous sur cette page (la recette en question), et renseignez le flux RSS de votre blog (http://scriptogr.am/username/feed)
   • Paramétrez le tweet que vous souhaitez émettre
   • Validez, et le tour est joué</ol> Cette recette est très classique, mais je vous encourage fortement à explorer la liste des recettes et à en créer par vous même.

## En conclusion

Le gros point noir pour l’instant sur Scriptogr.am est **l’obligation de devoir se rendre sur le site pour pouvoir synchroniser** (à la main) les nouveaux articles. A l’heure où j’écris cet article, il semblerait que l’équipe de développeurs travaille sur une nouvelle version de la plateforme embarquant de nombreuses nouveautés dont des solutions à cet égard, mais pour l’instant aucune date n’a été dévoilée, et les utilisateurs sont donc toujours dans l’attente.

J’ai pour ma part essayé de bricoler un script bash qui avait pour but de déclencher la synchronisation à intervalles réguliers, mais je n’ai pour l’instant pas obtenu de résultat probant. Malgré tout la plateforme conserve des atouts intéressants, le premier d’entre eux étant de conserver votre contenu en local sur votre ordinateur. Pour cette raison, je continue à l’utiliser en l’état, en espérant une rapide avancée sur ce sujet.

On a donc trois solutions pour mettre à jour ce blog de manière régulière :

  * Utiliser l’interface en ligne pour rédiger des articles, mais on n’utilise plus notre éditeur favori
  * Se rendre sur le Dashboard pour synchroniser après chaque nouvel article rédigé, mais là encore la flexibilité n’est pas optimale
  * Décider de synchroniser manuellement et régulièrement le blog, indépendamment de la rédaction d’articles, au risque de publier les articles par blocs

Pour ma part j’ai retenu la dernière solution qui convient très bien à mon utilisation en mode « bloc notes » : l’essentiel est que les notes soient prises, leur partage sur le net ce n’est que du bonus.

Bien entendu ça n’est que mon utilisation personnelle de la plateforme (si vous voulez voir ce que ça donne, rendez-vous [ici](http://scriptogr.am/diije)), et certains l’utilisent comme un blog à part entière. A chacun de se faire sa propre opinion.