Canalblog
Editer l'article Suivre ce blog Administration + Créer mon blog
Publicité
Twister City - Annexes
11 mai 2008

TagComment - Installation des smileys et des tags seulement

Uploadez icônes et boutons 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 boutons ou smileys que vous voulez ajouter, rendez-vous donc aux sections idoines :

... 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>

  • Vérification du commentaire en amont :

<form action="" method="post" name="frmComment" id="frmComment" onsubmit="return checkCommentAndSubmit(this)">

A la place de :

<form action="" method="post" name="frmComment" id="frmComment" onsubmit="handleSubmit(this)">

  • 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">

  • Zone d'affichage d'erreur dans la saisie du commentaire :

<strong><span id="comErrorMessage"></span></strong>

Entre :

<input  type="submit" name="submit" value="Envoyer" />

Et :

<br />
</form>


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.

Publicité
Commentaires
Publicité
Publicité