Ok

En poursuivant votre navigation sur ce site, vous acceptez l'utilisation de cookies. Ces derniers assurent le bon fonctionnement de nos services. En savoir plus.

16.06.2009

Communiquez avec vos visiteurs grâce à la newsletter de votre blog

Parmi les fonctionnalités offertes aux abonnés payant de Hautetfort, il y a bien la lettre d'actualités. Vous pourriez me dire que cela ne sert à rien puisqu'il est permis à tout le monde de créer une circulaire d'information des mises à jour avec FeedBurner. Ce à quoi je ne manquerai pas de répondre que vous ne devriez comparer que ce qui peut l'être.

FeedBurner permet d'abord d'avoir des statistiques sur la consultation de votre flux RSS. Cela vous demandera quelques efforts, mais vous pouvez lui demander d'envoyer, automatiquement et dans une plage horaire programmée, un message électronique reproduisant tout ou partie des notes publiées depuis le dernier envoi. Je n'en dis pas plus à propos des ces services pour l'instant, puisque See Mee est sur le pont.

La newsletter Hautetfort propose un service différent. S'il est lui aussi conçu pour vous permettre d'informer vos abonnés de la publication des dernières notes en reproduisant une partie du texte, c'est à vous de décider :
- du rythme d'expédition
- de la profondeur de la revue de votre blog
- de la mise en forme de votre newsletter (si vous choisissez le HTML)
- des informations qui accompagneront la liste de vos dernières notes.

Ce dernier point n'est pas le moins intéressant, puisque vous pouvez utiliser la newsletter pour avoir une communication spécifique envers vos abonnés. Vous pouvez donner des informations supplémentaires, des avant-premières, etc. Sans vouloir jouer les apprentis marketeurs on-line, la newsletter vous permet tout de même d'animer votre communauté d'internautes si vous le souhaitez.

Le nombre d'abonnés à ma newsletter ne dépasse pas le niveau de crypto-groupuscule, à côté du quel l'équipage du "Les copains d'abord" passerait pour celui du "Potemkine". Cela m'aide grandement à garder des ambitions mesurées.

 

Lire la suite

20:30 Écrit par Gee Mee dans Configuration avancée, Personnaliser son blog | Lien permanent | Commentaires (4) | Tags : newsletter, hautetfort, feedburner | |  del.icio.us | | Digg! Digg |  Facebook

14.04.2009

Créer un style pour les commentaires

Cette note a d'abord été publiée le 10 mars dernier, mais elle méritait d'être revue compte tenu des évolutions récentes imposées aux commentaires. Et elle le sera peut-être bientôt puisque cela va encore bouger de ce côté d'après la dernière newsletter de la plateforme.

Pour la personnalisation des commentaires, j'avais préconisé la modification du modèle de la page "lien permanent", l'insertion d'une instruction Html pour appeler un style disctinct à créer dans la feuille de style. Cela n'est plus nécessaire aujourd'hui, car la plateforme a modifié ses modèles et utilise d'emblée des styles distincts pour le contenu de la note, les commentaires, et selon qu'ils ont été proposés par des invités ou par l'auteur du blog (du moins une personne ayant donné l'adresse de courrier électronique que ce dernier a enregistré dans son compte Hautetfort). D'une certaine façon cela nous facilite les choses, à condition de retirer ses moufles avant de modifier la feuille de styles.

Je pars du principe que vous avez suivi les manipulations exposées dans la note du Blog.Hautetfort pour Distinguer ses réponses au sein des commentaires.

Lire la suite

13:00 Écrit par Gee Mee dans Configuration avancée, Personnaliser son blog | Lien permanent | Commentaires (1) | Tags : hautetfort, aspire, commentaire, css | |  del.icio.us | | Digg! Digg |  Facebook

27.03.2009

Andy s'en soucie-t-il ?

Après la disparition de la pub, voici que mes notes maladroitement tronquées dans la page d'accueil laissent la place à l'officiel format de note longue... Et pourquoi pas une newsletter ?

Je vous dois la vérité, c'est l'une des heureuses conséquences de la note d'Alexandra de dimanche dernier. Il y eut bien sûr la satisfaction narcissique de se voir mettre en avant quelques instants en très bonne compagnie, comme un fugace quart d'heure de Warhol alors que je préfère Andy.

Mais il y a surtout le cadeau de cet abonnement « pro » pour m'encourager dans le partage d'informations, de conseils qui permettent d'exploiter au mieux la plateforme, et de s'y sentir toujours mieux sans avoir des œillères pour autant. Un vrai chouette cadeau dont j'ai bien l'intention de profiter, pour que vous profitiez aussi des fonctionnalités disponibles.

Les aigris et les grincheux penseront que je me suis fait acheter, peu m'importe, je renonce à tenter de les convaincre. Qu'ils pensent seulement un instant à la situation qui sera la mienne si Hautetfort revient sur sa décision.

J'invite toutes les bonnes volontés à participer à la vie de ce blog, à faire en sorte que cet espace soit offert à la communauté de ceux qui bidouillent pour eux et pour les autres. Que chacun se sente libre de proposer une note, un tutoriel, une astuce, toute contribution sera accueillie avec bienveillance (à condition qu'elle n'en manque pas elle-même).

Et je profite d'ailleurs de l'occasion pour demander à l'auteur de Kezablog de se manifester (on peut le faire discrètement en récupérant mon adresse de courrier électronique). Je ne crois pas abuser en affirmant que Lavande et moi-même regrettons de voir que nos initiatives auraient pu en dissuader d'autres.

À moi de remercier Alexandra et l'équipe, à vous tous d'imaginer que vous pourriez ici faire des essais, des tentatives, partager, sans que cela ne nuise à vos propres projets.

Parlons-en !

11:27 Écrit par Gee Mee dans 1ère visite | Lien permanent | Commentaires (6) | Tags : hautetfort, kezablog | |  del.icio.us | | Digg! Digg |  Facebook

13.03.2009

Afficher une lettrine en début de note, grâce à la feuille de styles (révisée)

Mise à jour du 17 mars : L'affichage automatique de la lettrine par les CSS est neutralisé en attendant que l'interprétation du code par les navigateurs soit homogène. Autant dire que nous ne serons pas loin des calendes grecques. Pour la révision de cette note, j'ai triché.

J'ai retiré <div class="texte_note"> du modèle de la page, et sans rétablir ma feuille de style dans son état préalable, je suis intervenu dans le code Html de la note. J'ai encadré le premier paragraphe de <div class="texte_note"> et </div>.

 

*** Note d'origine ***

Je vous ai déjà donné une méthode en novembre dernier, en voici une autre, et vous jugerez de celle qui vous convient le mieux. Peut-être aucune.

Dans une note qui commence à sérieusement dater, à l'échelle de la péremption ultra-rapide des informations communiquées sur un blog, je vous disais comment afficher une lettrine avec un tableau. Ce n'était pas forcément la méthode la plus aisée, puisqu'il fallait rentrer dans le code HTML. Au titre des avantages, on peut tout de même retenir que l'on peut utiliser une image de fond pour « enluminer ». La méthode requérant votre intervention, il vous est loisible de ne presque jamais vous en servir, ou de multiplier les lettrines dans un même texte, fut-ce au dam des typographes patentés (qui en ont vu d'autres). Mais du passé...

Tabula rasa
Dans la méthode actuellement utilisée sur ce blog, le traitement est automatique, puisque que l'on se repose sur les propriétés CSS. C'est tout ou rien. On tâtonne pour trouver un résultat satisfaisant, mais après c'est très confortable.

Je vous donne le code avant quelques explications
Dans le modèle de la page « lien permanent » j'ai modifié les lignes suivantes :
<h3 id="p1"><span>{$post.title}</span></h3>
<div class="posttext">
<div class="posttext-decorator1">
<div class="posttext-decorator2">
{if $post.extended}<div class="introductory">{/if}
{$post.source|trimlonglines:60}
{if $post.extended}</div>{/if}
{if $post.extended}<a id="more"></a><br />{$post.extended}{/if}
<div style="clear:both;"></div>
</div>
</div>
</div>


pour ne changer que cela :
<h3 id="p1"><span>{$post.title}</span></h3>
<div class="texte_note">
<div class="posttext-decorator1">
<div class="posttext-decorator2">


Dans la feuille de styles, après l'élément .content ul li on trouve dorénavant les instructions suivantes :
/**************************************************/
.texte_note p {
padding: 5px 28px 5px 28px;
margin: 5px 0px 5px 0px;
font-size: 1em;
line-height: 1.25em;
}
.texte_note p + p {
margin: 0;
}
.texte_note p:first-letter { /*** Pour la 1ère lettre du 1er § ***/
font-size: 3.5em; /*** La taille est multipliée par 3,5 ***/
line-height: 1em;
font-weight: 400; /*** "graisse" normale, donc maigre ***/
float: left;
margin: 0;
}
.texte_note p:first-line { /*** Pour la 1ère ligne du 1er § ***/
font-weight: 800; /*** "graisse" accentuée ***/
}
.texte_note p + p:first-letter { /*** Pour la 1ère lettre des autres § ***/
font-size: 1em; /*** La taille revient à la normale ***/
line-height: 1.25em;
float: none;
margin: 0;
}
.texte_note p + p:first-line { /*** Pour la 1ère ligne des autres § ***/
font-weight: 400; /*** La graisse revient à la normale ***/
}

/*** à partir du code http://jontangerine.com/silo/typography/p/ ***/

/*****************************************************/


Comment ça marche ?


L'élément « texte_note » donne des indications pour p et p+p ; en fait pour le premier paragraphe, puis pour les suivants.
Le code utilise les « pseudo-formats » CSS first-letter et first-line pour appliquer des styles particuliers à la première lettre et à la première ligne du premier paragraphe (p), puis les corrige, rétablit la normale, en appliquant d'autres styles aux paragraphes suivants (p+p).

Mais la méthode a ses limites. En rétablissant la « graisse » de la première lettre, de la première ligne, des paragraphes suivants, le code retire le gras que vous avez éventuellement appliqué en début de paragraphe dans l'éditeur de note. Et pourtant me direz-vous, il y a bien ici des « sous-titres » avec un début de paragraphe en gras ? Oui mais, j'ai triché, il y a un retour à la ligne avant la première lettre. Et si je ne le fais pas...

Voilà ce que cela donne.

C'est pire encore avec Internet explorer qui semble ne pas accepter l'argument (p+p), et donc ne pas savoir distinguer le premier paragraphe des suivants.

Je m'en contente, considérant même que ce retour à la ligne forcé contribue à la bonne mise en forme du texte. Mais c'est une affaire de goût. Le code d'origine comportait une identation (un retrait positif en première ligne), mais cela rendait visible cette astuce du retour à la ligne pour récupérer le gras dès le premier caractère. Il y a peut être une solution plus élégante techniquement, et il ne faut pas hésiter à critiquer tant que l'on apporte une solution.

Sauf à vouloir faire afficher un autre lettrine (et sous IE seulement), il ne faut utiliser que des sauts de lignes (Maj+Entrée). C'est finalement trop pénible à l'usage de vérifier tous les sauts de lignes, aussi vais-je ce code dans la CSS mardi prochain avant de trouver une solution acceptable.

Et merci CUI ?

Merci à Comme Une Image d'avoir éclairé ma lanterne en me donnant l'adresse du site Jon TANgerine. Il est exclusivement anglophone, ce qui peut-être un avantage quand on maîtrise mal l'italien [;-)], et vous donne ici douze modes de mise en forme "typo" de paragraphe.

08:20 Écrit par Gee Mee dans Configuration avancée, Personnaliser son blog | Lien permanent | Commentaires (2) | Tags : personnaliser, blog, hautetfort, lettrine, css | |  del.icio.us | | Digg! Digg |  Facebook