♡ Do you know wonderland ?

Invité

Voici un petit sujet ou je me permets de recycler quelques astuces et certains de mes codes peut-être vous seront-ils utiles dans un avenir proche.

♡ Comment retirer Dernières modification ....

Pour cela rendez vous dans votre panneau d'administration -> Affichage -> Couleurs -> Feuilles style CSS -> et coller ce code -> Valider & enregistrer.

Code:: tr.post span.gensmall { display: none; }

♡ Jolie petite vignette (sous forum)

Une fois qu'on connait la technique c'est assez simple. Je vous propose donc le code prêt à coller (ou prêt à voler mdr). D'abord, allez dans la feuille de style de votre forum c'est à dire : (Affichage => Couleurs => Feuille de style CSS). Ajouter le code suivant :

Code:: .vignettes
{-moz-border-radius:7px;
background-color: #ffffff;
padding-right:10px;
padding-left:10px;
padding-bottom: 3px;
padding-top:3px;}

Ensuite, il faut faire une petite modification dans les configurations du PA. Rendez-vous dans " affichage ", puis " structure et hiérarchie ", et enfin " Hiérarchie ". Dans " Lien vers les niveaux inférieurs ", sélectionner " Non " sinon vous aurez deux fois le lien menant aux sous forums et ce n'est pas jolie, jolie du tout.

Maintenant, il faut ajouter les sous forums avec le css que l'on a ajouté précédemment Panneau admin >> Général -> Catégories & forums -> Description du forum. Copier/coller cela et remplacer en dessous de la description de vos sous forums. N'oubliez pas d'utiliser les balises
pour faire un écart entre votre sous forum et votre description.

Code:: <div align="center">
<a class="vignettes" href="LIEN SOUS FORUM">NOM DU SOUS FORUM/TOPIC</a>
<a class="vignettes" href="LIEN SOUS FORUM">NOM DU SOUS FORUM/TOPIC</a>
<a class="vignettes" href="LIEN SOUS FORUM">NOM DU SOUS FORUM/TOPIC</a>
<a class="vignettes" href="LIEN SOUS FORUM">NOM DU SOUS FORUM/TOPIC</a>
</div>

♡ Because it clean ! (code héberger chez une amie) / Voir MP

Invité

Sujet : Mettre une Chatbox (CB) latéralement.

Voilà un nouveau petit tutoriel pour mettre votre CB soit à droite ou à gauche.

Première étape.

☆ Création du Javascript.

La première étape de ce tutoriel rapide il faut se rendre dans le panneau d'administration et il faut se rendre dans l'onglet Modules puis dans le menu direction HTLM & Javascript. Il faut se rendre dans l'option Gestion des codes Javascript puis créer un nouveau code pour cela il faut tout simplement cliquer sur Créer un nouveau code Javascript.

La page principale va s'ouvrir, et donc donner un titre tel que "Chatbox Latérale" à votre code puis cocher la case "Sur toutes les pages". Dans le corps du sujet veuillez collez ce code :

Code:: $(function(){
   var urlChatBox = '/chatbox/index.forum?page=front&';
   var imgOuvrir = 'http://';
   var imgOuvrirSurvol = 'http://';
   var imgFermer = 'http://';
   var imgFermerSurvol = 'http://';
   $('body').append('
   <table class="ChatboxLaterale" cellspacing="0" cellpadding="0">
   <tr>
   <td>
   <iframe src="'+urlChatBox+'" id="chatboxpop" scrolling="no" marginwidth="0" marginheight="0" frameborder="0"></iframe>
   </td>
   <td class="boutonChatbox">
   <img id="btn_cb" src="'+imgOuvrir+'" alt="ouvrir la chatbox" />
   </td>
   </tr>
   </table>
   ');
   $('#btn_cb').on({
   click: function(){
   $('#chatboxpop').toggle();
   },
   mouseenter: function(){
   if($('#chatboxpop').css('display') == 'none'){
   $(this).attr('src', imgOuvrirSurvol);
   } else {
   $(this).attr('src', imgFermerSurvol);
   }
   },
   mouseleave: function(){
   if($('#chatboxpop').css('display') == 'none'){
   $(this).attr('src', imgOuvrir);
   } else {
   $(this).attr('src', imgFermer);
   }
   }
   });
});

☆ Personnalisation du code.

Une fois que vous avez enregistrer le code rendez-vous dans la partie CSS du forum (PA -> Affichage -> Images & Couleurs -> Feuille Style CSS). Et collez ce code :

Code:: .ChatboxLaterale
{
position: fixed; /* position fixe dans la fenêtre */
  bottom: 10%; /* à 10% du bas (calculé en fonction de la taille de la fenêtre) */
  left: 0; /* et collé au bord gauche */
  width : 100px; /* dimension 100px */
}
.ChatboxLaterale iframe
{
  width: 800px; /* largeur */
  height: 400px; /* hauteur */
  display: none; /* caché par défaut */
}
.boutonChatbox
{
vertical-align: bottom; /* on aligne le bouton en bas, le long de la chatbox */
}

.boutonChatbox img
{
  cursor:pointer; /* on ajoute un pointeur pour indiquer que l'image est cliquable */
}

Maintenant vous pouvez enregistrer et validez votre CSS puis vous rendre sur la page principale de votre forum, et vous verrez votre CB sur le côté.

☆ Dernière chose.

Si vous vous retrouvez avec deux CB c'est normal, il faut désactiver celle du bas et pour cela il faut tout simplement aller dans :

Panneau d'administration -> Modules -> Chabox -> Configuration

Puis au niveau de Affichage de la Chabox : Ne pas afficher (Laissez par contre la CB activé).