TagComment - Installation des smileys seulement

Uploadez vos smileys sur Internet (par FTP par exemple).

Vous pouvez le faire par Canalblog mais si vous devez modifier vos fichiers, Canalblog leur donnera un nom différent (un numéro d'ID) et ça vous obligera à modifier les endroits où les noms de fichiers sont référencés.

---

Récupérez tag_comment.js. Vous devrez le modifier en fonction des smileys que vous voulez ajouter, rendez-vous donc aux sections idoines :

• Personnalisation de la barre des icônes

• Personnalisation du module de conversion

... et mettez le en ligne.

---

Ensuite, il va vous falloir éditer les fichiers du modèle de votre blog.

Rendez vous donc dans le menu Apparence, et Editer les fichiers de ce modèle sur le modèle en cours.

Dans la liste déroulante sélectionnez : "Page d'un message"

Voici la liste des modifications à faire sur cette page.

• Insertion du code javascript (remplacez http://site.fr/blog/tag_comment.js par le lien vers l'endroit où vous avez uploadé tag_comment.js) :

<script language="Javascript" src="http://site.fr/blog/tag_comment.js"></script>

Entre :

<link rel="stylesheet" href="<$BlogCSSURL$>" type="text/css" />

Et :

</head>

• Astuce de remplacement et formatage des commentaires :

<form>
  <textarea id="commentStr<$BlogCommentId$>" style="left: 0; top: 0; position: absolute; visibility: hidden;" rows=1><$BlogCommentBody$></textarea> 
</form>
<p>
  <script language=javascript>
  <!--
    var v_str = document.getElementById("commentStr<$BlogCommentId$>").value;
    formatComment(v_str);
  //-->
  </script>
</p>

A la place de :

<p><$BlogCommentBody$></p>

• Insertion de la barre d'icônes au dessus de la zone de saisie du commentaire :

<script language=javascript>
<!--
  displayCommentIcons();
//-->
</script><br />

Entre :

<input id="commentTitle" name="commentTitle" value="" maxlength="128" />
</p>

Et :

<p>
<label for="commentBody">

---

Maintenant dans la liste déroulante, sélectionnez "Feuille de style générale".

Ajoutez les styles comIconImg (et comIconImg:hover pour faire un effet de rollover sur les boutons de la barre des icônes), après la définition du style ".blogbody .itemfooter".

.blogbody .comIconImg {
    border-style: solid;
    border-width: 1px;
    border-color: #FFDDFF;
}
.blogbody .comIconImg:hover {
    border-style: dotted;
    border-width: 1px;
    border-color: #990099;
    background-color: #EFFFF5;
}

Et changez les paramètres donnés en exemple ci-dessus avec votre propre configuration.

Comments

[france]

Pas évident tout de même lol

[laura]

enfin ça maaaarche !! super !! mille merci a toi pour cette instal bien pratique et magnifiquement expliquée !!
première fois que je prog un peu et franchement je suis très fière !! :)
encore merci ^^