Fork me on GitHub

Rapport de message :*
 

Comment voir ses commentaires en forme "info bulle"

Titre du sujet : Comment voir ses commentaires en forme "info bulle"
par eparcyl92 sur 17/09/2010 11:01:19

Vous pouvez personnaliser le cadre des commentaires comme ceci:

Open in new window


Détail d'installation

1. Ajouter les codes ci-dessous dans votre fichier XOOPS_URL/themes/VOTRE_THEME/style.css:
/* xoops commentaire en forme bulle for Nullos Planet*/
.ncomment {
    padding-top: 20px;
    padding-right: 20px;
    padding-bottom: 40px;
    padding-left: 20px;
    background-image: url(images/com_bl.png);
    background-position: left bottom;
    background-repeat: no-repeat;
}
.ncomment_l {
    background-image:url(images/com_l.png);
    background-position: left;
    background-repeat:repeat-y;
    background-color:#c8e4ad; /* couleur du fond de texte suivant la couleur du cadre */
    }
.ncomment_r {
    background-image:url(images/com_r.png);
    background-position: right;
    background-repeat:repeat-y;
    }
.ncomment_t {
    background-image:url(images/com_t.png);
    background-position: top;
    background-repeat:repeat-x;
    }
.ncomment_b {
    background-image:url(images/com_b.png);
    background-position: bottom;
    background-repeat:repeat-x;
    }
.ncomment_tl {
    background-image:url(images/com_tl.png);
    background-position: left top;
    background-repeat:no-repeat;
    }
.ncomment_tr {
    background-image:url(images/com_tr.png);
    background-position: right top;
    background-repeat:no-repeat;
    }
.ncomment_br {
    background-image:url(images/com_br.png);
    background-position: right bottom;
    background-repeat:no-repeat;
    }
.ncomment_user {
padding-left:15px;
padding-bottom:20px;
}

2. Copier les images dans XOOPS_URL/themes/VOTRE_THEME/images/ (nota: si ces dossiers n'existent pas, créez-les en ajoutant aussi un fichier index.html)

3. Copier les images (addc.png; deletec.png et editc.png) dans XOOPS_URL/images/icons (MERCI TARIK )

3. Vous allez chercher, dans XOOPS_URL/modules/system/templates/, les fichiers suivants:
system_comment.html
system_comments_flat.html
system_comment_thread.html
system_comments_nest.html

Les fichiers ci-dessous sont à mettre dans XOOPS_URL/themes/VOTRE_THEME/modules/system/ (nota: si ces dossiers n'existent pas, créez-les en ajoutant aussi un fichier index.html)

Vous pouvez alors les ouvrir, et remplacez leurs contenus par ceux qui sont ci-dessous:

Pour le fichier system_comment.html:
<!-- xoops commentaire en forme bulle des Nullos Xoops Planet -->
<div>
<div class="ncomment_l">
<div class="ncomment_t">
<div class="ncomment_r">
<div class="ncomment_b">
<div class="ncomment_tr">
<div class="ncomment_br">
<div class="ncomment_tl">
<div class="ncomment">
<a id="comment<{$comment.id}>"></a>
<div class="comTitle"><{$comment.image}><{$comment.title}></div><div class="comText"><{$comment.text}></div>
          <{if $xoops_iscommentadmin == true}>
          <a href="<{$editcomment_link}>&com_id=<{$comment.id}>"><img src="<{$xoops_url}>/images/icons/editc.png" alt="<{$lang_edit}>" title="<{$lang_edit}>"/></a>&nbsp;&nbsp;<a href="<{$deletecomment_link}>&com_id=<{$comment.id}>"><img src="<{$xoops_url}>/images/icons/deletec.png" alt="<{$lang_delete}>" title="<{$lang_delete}>"/></a>&nbsp;&nbsp;<a href="<{$replycomment_link}>&com_id=<{$comment.id}>"><img src="<{$xoops_url}>/images/icons/addc.png" alt="<{$lang_reply}>" title="<{$lang_reply}>"/></a>
          <{elseif $xoops_isuser == true && $xoops_userid == $comment.poster.id}>
          <a href="<{$editcomment_link}>&com_id=<{$comment.id}>"><img src="<{$xoops_url}>/images/icons/editc.png" alt="<{$lang_edit}>" title="<{$lang_edit}>"/></a>&nbsp;&nbsp;<a href="<{$replycomment_link}>&com_id=<{$comment.id}>"><img src="<{$xoops_url}>/images/icons/addc.png" alt="<{$lang_reply}>" title="<{$lang_reply}>"/></a>&nbsp;&nbsp;
          <{elseif $xoops_isuser == true || $anon_canpost == true}>
          <a href="<{$replycomment_link}>&com_id=<{$comment.id}>"><img src="<{$xoops_url}>/images/icons/addc.png" alt="<{$lang_reply}>" title="<{$lang_reply}>"/></a>&nbsp;&nbsp;
        <{else}>
          <{/if}>
          </div>
          </div>
          </div>
          </div>
          </div>
          </div>
          </div>
          </div>
          <div class="ncomment_user"><img align="absmiddle" class="comUserImg" src="<{$xoops_upload_url}>/<{$comment.poster.avatar}>" alt="" width="35" height="35"/> <{$comment.poster.uname}>
&nbsp; &nbsp; <span class="comDateCaption"><{$lang_posted}>:</span> <{$comment.date_posted}>&nbsp;&nbsp;<span class="comDateCaption"><{$lang_updated}>:</span> <{$comment.date_modified}></div>
</div>

Pour le fichier system_comments_flat.html:
<!-- xoops commentaire en forme bulle des Nullos Xoops Planet -->
<{foreach item=comment from=$comments}>
    <{include file="db:system_comment.html" comment=$comment}>
<{/foreach}>

Pour le fichier system_comment_thread.html:
<!-- xoops commentaire en forme bulle des Nullos Xoops Planet -->
<{section name=i loop=$comments}>
<br />
  <{include file="db:system_comment.html" comment=$comments[i]}>
<{if $show_threadnav == true}>
<div style="text-align:left; margin:3px; padding: 5px;">
<a href="<{$comment_url}>"><{$lang_top}></a> | <a href="<{$comment_url}>&com_id=<{$comments[i].pid}>&com_rootid=<{$comments[i].rootid}>#newscomment<{$comments[i].pid}>"><{$lang_parent}></a>
</div>
<{/if}>
<{if $comments[i].show_replies == true}>
<br />
<table cellspacing="1" class="outer">
  <tr>
    <th width="50%"><{$lang_subject}></th>
    <th width="20%" align="center"><{$lang_poster}></th>
    <th align="right"><{$lang_posted}></th>
  </tr>
  <{foreach item=reply from=$comments[i].replies}>
  <tr>
    <td class="even"><{$reply.prefix}> <a href="<{$comment_url}>&com_id=<{$reply.id}>&com_rootid=<{$reply.root_id}>"><{$reply.title}></a></td>
    <td class="odd" align="center"><{$reply.poster.uname}></td>
    <td class="even" align="right"><{$reply.date_posted}></td>
  </tr>
  <{/foreach}>
</table>
<{/if}>
<{/section}>

Pour le fichier system_comments_nest.html:
<!-- xoops commentaire en forme bulle des Nullos Xoops Planet -->
<{section name=i loop=$comments}>
<br />
  <{include file="db:system_comment.html" comment=$comments[i]}>
<{foreach item=reply from=$comments[i].replies}>
<br />
<table cellspacing="0" border="0">
  <tr>
    <td width="<{$reply.prefix}>"></td>
    <td>
        <{include file="db:system_comment.html" comment=$reply}>
    </td>
  </tr>
</table>
<{/foreach}>
<{/section}>



Petite remarque: si vous utilisez blank.gif, comme avatar par défaut, la flêche de la bulle pointera sur un vide.
Pour personnaliser l'avatar par défaut, vous pouvez soit remplacer blank.gif par un autre .gif, soit lire ce sujet.


Remerciement Heaven et Young (dont j'ai malheureusement perdu leurs liens).

TÉLÉCHARGEMENT COMPLET
Open in new window


A+++
Propulsé avec XOOPS | Graphisme adapté par Tatane, Grosdunord, Montuy337513

26 Personne(s) en ligne (19 Personne(s) connectée(s) sur Forum) | Utilisateur(s): 0 | Invité(s): 26 | Plus ...