Présentation forum Bouton_activePrésentation forum Bouton_hoverPrésentation forum Fb-hoverPrésentation forum Fb-active
CSSActif, le forum, n'est plus maintenu. Il est néanmoins disponible pour consultation. Pour des outils pratiques, rendez-vous sur:

Découvrez CSSActif, une collection d'outils et de tutoriels interactifs pour les développeurs Web — HTML, CSS, JavaScript et bien plus!

Derniers sujets
» Système d'onglets simple et personnalisable
Présentation forum EmptyLun 03 Juin 2024, 17:20 par birds

» Fiche de Présentation RPG
Présentation forum EmptySam 30 Mar 2024, 22:07 par Peyton972

» [RPG] Fiche personnage avec bannière
Présentation forum EmptySam 30 Mar 2024, 22:06 par Peyton972

» Structure de Qui Est En Ligne (1)
Présentation forum EmptyLun 04 Mar 2024, 23:20 par Peyton972

» Qui Est En Ligne - Utopia
Présentation forum EmptyDim 24 Déc 2023, 18:16 par romee

» Pack forum complet "Androïd Sylver" RPU (N°2)
Présentation forum EmptyJeu 02 Nov 2023, 06:42 par Hydrar

» Formulaire de connexion rapide amélioré
Présentation forum EmptySam 04 Mar 2023, 18:57 par Krager

» Avatar centré dans le profil
Présentation forum EmptySam 11 Fév 2023, 06:04 par Krager

Le Deal du moment : -28%
-28% Machine à café avec broyeur ...
Voir le deal
229.99 €

Partagez
 

Présentation forum

Voir le sujet précédent Voir le sujet suivant Aller en bas 
Aller à la page : 1, 2  Suivant
http://love.sucks.free.fr
ninadobrevfan
ninadobrevfan
{ Membre }
{ Membre }

Féminin Messages : 37



Présentation forum Empty
Bonjour, je reviens avec une autre question, j'aimerais savoir comment rassembler les trois partie ou quatre partie qui compose le forum, c'est a dire le bouton qui indique un nouveau message, la description, le nombre de message posté et le dernier message posté. Pour un exemple voici deux forums, je ne souhaite pas connaitre leur code mais simplement comme faire pour tout assemble =)
http://www.berkeley-u.com/ ou http://www.providence-people.com/forum.htm

Vous remarquerez aussi que la barre dernier message a disparu, est ce que tout a été supprimer et transférer dans un autre template ?

Merci <3
MessageSujet: Présentation forum   Présentation forum EmptyLun 21 Juin 2010, 09:29
Revenir en haut Aller en bas
http://www.i-love-harvard.com/
Kaiji
Kaiji
Blanche-Neige
Blanche-Neige

Féminin Messages : 5578



Présentation forum Empty
    Bonjour,

    Sans être sûre de ma réponse à 100%, je pense qu'il s'agit simplement d'un système de tableau à l'intérieur du template. Les fondateurs de ceux deux forums ont du jouer avec le template index_body et y insérer un tableau. =)
MessageSujet: Re: Présentation forum   Présentation forum EmptyLun 21 Juin 2010, 11:10
Revenir en haut Aller en bas
http://www.illusionimaginative.net/
.Little Lady
.Little Lady
{ Membre actif }
{ Membre actif }

Féminin Messages : 564



Présentation forum Empty
Alors je peux t'expliquer comment faire mais ça risque d'être long.
MessageSujet: Re: Présentation forum   Présentation forum EmptyLun 21 Juin 2010, 11:12
Revenir en haut Aller en bas
http://love.sucks.free.fr
ninadobrevfan
ninadobrevfan
{ Membre }
{ Membre }

Féminin Messages : 37



Présentation forum Empty
Little Lady, je veux bien, c'est pas grave si c'est long =)
MessageSujet: Re: Présentation forum   Présentation forum EmptyLun 21 Juin 2010, 11:32
Revenir en haut Aller en bas
http://www.illusionimaginative.net/
.Little Lady
.Little Lady
{ Membre actif }
{ Membre actif }

Féminin Messages : 564



Présentation forum Empty
Alors voici une première partie:

Pour commencer, il faut être le Fondateur du forum car il nous faudra modifier les templates.
Allez dans le Panneau d'Administration >> Affichage >> Général >> Index_Box

I: - Suppression de la colonne "Derniers Messages" -

Pour commencer, nous allons supprimer ce qui sera inutile.
Dans votre template, cherchez et supprimez cette ligne.
Code:
<th nowrap="nowrap" width="150"><div style="width:150px;">{L_LASTPOST}</div></th>
Pour aller plus vite, vous pouvez utilisez Ctrl + F.

Ensuite, cherchez ceci:
Code:
<td class="row3 over" align="center" valign="middle" height="50">
<span class="gensmall">{catrow.forumrow.LAST_POST}</span>
</td>

Supprimez ceci:
Code:
<td class="row3 over" align="center" valign="middle" height="50">

et ceci:

Code:
</td>

A ce moment, la colonne "Derniers Messages" n'existe plus sur votre forum. Maintenant, il faut bien mettre le texte de cette colonne quelque part. Je vous propose donc de le mettre dans la case de la description des sous-forums.

II: - Replacer les Statistiques -

Maintenant, il faut replacer les statistiques. Je vous propose donc de le mettre dans la case de la description des sous-forums.

Et pour cela nous avons besoin de la variable représentant ces statistiques; soit:
Code:
<span class="gensmall">{catrow.forumrow.LAST_POST}</span>

Dans votre template, il vous faut donc localiser l'endroit où nous souhaitons le mettre, c'est-à-dire ici:
Code:
<td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle">
<img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
</td>
<h{catrow.forumrow.LEVEL} class="hierarchy">
<span class="forumlink">
<a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>

</span>
</h{catrow.forumrow.LEVEL}>
<span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
<span class="gensmall">
<!-- BEGIN switch_moderators_links -->
{catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
<!-- END switch_moderators_links -->
{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}

Une fois que vous avez repéré ce morceau de code, il vous suffit de le remplacer par celui-ci:
Code:
<td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle">
<img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
</td>
<h{catrow.forumrow.LEVEL} class="hierarchy">
<span class="forumlink">
<a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>

</span>
</h{catrow.forumrow.LEVEL}>
<table>
<tr>
<td><span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
<span class="gensmall">
<!-- BEGIN switch_moderators_links -->
{catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
<!-- END switch_moderators_links -->
{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
</td>
<td>
<div class="messages_sujets_derniers_sujets">
<div class="derniers_sujets"><span class="gensmall">{catrow.forumrow.LAST_POST}</span></div>
</div>
</td>
</tr>
</table>

Vous avez pu vous apercevoir que j'ai ajouté deux div dans le code: messages_sujets_derniers_sujets & derniers_sujets.
Ces deux balises vous permettront de personnaliser l'affiche des statistiques avec du CSS.

Ça y est, vous avez bien suivi le tuto ?? Alors vous pouvez enregistrer et publier votre template.

III: - Personnaliser avec du CSS -

Il est évident que cela sera plus joli avec du CSS. Nous allons donc personnaliser tout ça alors préparez-vous. Pour cela, il faut ouvrir votre feuille CSS. Allez donc dans le Panneau d'Administration >> Affichage >> Couleurs >> Feuille de Style CSS

Maintenant, il faut mettre la class relative à nos "div" dans le template modifié; soit la class "messages_sujets_derniers_sujets" et la class "derniers_sujets".

Bien évidemment, vous pouvez personnaliser à votre façon ces div.

Code:
.messages_sujets_derniers_sujets {
margin-left: VALEURpx; /*espace entre le bord gauche et la bordure*/
padding-top: VALEURpx; /*espace entre le texte et la bordure du haut*/
padding-left: VALEURpx; /*espace entre le texte et la bordure gauche*/
padding-bottom: VALEURpx; /*espace entre le texte et la bordure du bas*/
padding-right: VALEURpx; /*espace entre le texte et la bordure droite*/
border-top: VALEURpx solid #COULEUR;
border-left: VALEURpx solid #COULEUR;
border-bottom: VALEURpx solid #COULEUR;
-moz-border-radius-topleft: VALEURpx; /*arrondir l'angle gauche du haut*/
-moz-border-radius-bottomleft: VALEURpx;/*arrondir l'angle gauche du bas*/
}

/*affichage derniers messages*/
.derniers_sujets {
padding: VALEURpx; /*espace entre le texte et la bordure*/
margin: VALEURpx; /*espace entre le bord et la bordure*/
border: VALEURpx dashed #COULEUR;
-moz-border-radius-topleft: VALEURpx; /*arrondir l'angle gauche du haut*/
-moz-border-radius-bottomright: VALEURpx; /*arrondir l'angle droit du bas*/
text-align: center;
}
MessageSujet: Re: Présentation forum   Présentation forum EmptyMar 22 Juin 2010, 06:43
Revenir en haut Aller en bas
http://love.sucks.free.fr
ninadobrevfan
ninadobrevfan
{ Membre }
{ Membre }

Féminin Messages : 37



Présentation forum Empty
Merci beaucoup j'avais un soucis mais finalement j'ai trouvé d'où ce venait, vous aviez oublié de placer cette balise :
Code:
      <td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
Je cite le passage avec la correction pour ceux que ça intéresse.
Spoiler:

Tout marche parfaitement.

J'aurais une dernière question, comment intégrer aussi la partie sur la gauche avec les images des nouveau messages ... et faire en sorte que la partie "titre des catégories" soit plus rataché au bloc prévu ?


Dernière édition par ninadobrevfan le Mar 22 Juin 2010, 09:48, édité 1 fois
MessageSujet: Re: Présentation forum   Présentation forum EmptyMar 22 Juin 2010, 08:59
Revenir en haut Aller en bas
http://www.illusionimaginative.net/
.Little Lady
.Little Lady
{ Membre actif }
{ Membre actif }

Féminin Messages : 564



Présentation forum Empty
Tu as finis cette partie ??
Alors je commence à préparer la suite en tuto.
MessageSujet: Re: Présentation forum   Présentation forum EmptyMar 22 Juin 2010, 09:38
Revenir en haut Aller en bas
http://love.sucks.free.fr
ninadobrevfan
ninadobrevfan
{ Membre }
{ Membre }

Féminin Messages : 37



Présentation forum Empty
Oui oui j'ai fini et j'ai déjà commencer a faire des modifs ^^

Je sais pas si ce que je vais demander fera partie de la suite du tuto mais au cas ou :

Comment intégrer aussi la partie sur la gauche avec les images des nouveau messages ... et faire en sorte que la partie "titre des catégories" soit plus rattaché au bloc prévu ?
MessageSujet: Re: Présentation forum   Présentation forum EmptyMar 22 Juin 2010, 09:52
Revenir en haut Aller en bas
http://www.illusionimaginative.net/
.Little Lady
.Little Lady
{ Membre actif }
{ Membre actif }

Féminin Messages : 564



Présentation forum Empty
T'inquiète pas, tout sera prévu. Par contre qu'entends-tu par les titres des catégories soient plus rattachés au bloc prévu ??
MessageSujet: Re: Présentation forum   Présentation forum EmptyMar 22 Juin 2010, 10:20
Revenir en haut Aller en bas
http://love.sucks.free.fr
ninadobrevfan
ninadobrevfan
{ Membre }
{ Membre }

Féminin Messages : 37



Présentation forum Empty
je t'avais envoyé l'adresse de mon forum il me semble pour un autre soucis, tu verras les barres verte avec les divers titre comme "contrat de licence", "administration" ... J'aimerais les coller en quelque sorte au cadre beige en dessous avec la description et les derniers messages ...
Comme cela tu pourras voir mon avancement ^^
MessageSujet: Re: Présentation forum   Présentation forum EmptyMar 22 Juin 2010, 10:28
Revenir en haut Aller en bas
http://www.illusionimaginative.net/
.Little Lady
.Little Lady
{ Membre actif }
{ Membre actif }

Féminin Messages : 564



Présentation forum Empty
Il faut peut-être que tu supprimes les sauts à la ligne.
MessageSujet: Re: Présentation forum   Présentation forum EmptyMar 22 Juin 2010, 10:37
Revenir en haut Aller en bas
http://love.sucks.free.fr
ninadobrevfan
ninadobrevfan
{ Membre }
{ Membre }

Féminin Messages : 37



Présentation forum Empty
Surement mais je ne connais pas le nom de cette partie dans le template ^^
j'aimerais l'intégrer dans une class comme la description ou le nombre de message si possible
MessageSujet: Re: Présentation forum   Présentation forum EmptyMar 22 Juin 2010, 10:43
Revenir en haut Aller en bas
http://www.illusionimaginative.net/
.Little Lady
.Little Lady
{ Membre actif }
{ Membre actif }

Féminin Messages : 564



Présentation forum Empty
Peux-tu me faire un schéma de ce que tu souhaites parce que là j'ai du mal à voir ce que tu souhaites ??
MessageSujet: Re: Présentation forum   Présentation forum EmptyMar 22 Juin 2010, 10:46
Revenir en haut Aller en bas
http://love.sucks.free.fr
ninadobrevfan
ninadobrevfan
{ Membre }
{ Membre }

Féminin Messages : 37



Présentation forum Empty
Alors actuellement j'ai ça :
https://2img.net/h/oi50.tinypic.com/22z5sk.jpg

et j'aimerais quelque chose dans ce genre que j'adapterai après en css comme je le souhaite :
https://2img.net/h/oi45.tinypic.com/hu5awx.jpg
MessageSujet: Re: Présentation forum   Présentation forum EmptyMar 22 Juin 2010, 10:55
Revenir en haut Aller en bas
http://www.illusionimaginative.net/
.Little Lady
.Little Lady
{ Membre actif }
{ Membre actif }

Féminin Messages : 564



Présentation forum Empty
Alors déjà pour corriger la taille du cadre des stats, tu devrais mettre dans ton CSS
width: auto;

Pour le reste c'est une organisation en type onglet. Je te fais un tuto dès que possible.
MessageSujet: Re: Présentation forum   Présentation forum EmptyMar 22 Juin 2010, 10:59
Revenir en haut Aller en bas
http://love.sucks.free.fr
ninadobrevfan
ninadobrevfan
{ Membre }
{ Membre }

Féminin Messages : 37



Présentation forum Empty
Heu merci mais avec une class comme je fais actuellement ça ne peux pas marcher ?
Je connais un peu le système en onglet en javascript, j'en ai un pour ma page d'accueil mais y aurai pas plus simple ? Par ce que je veux pas te prendre tout ton temps =)
MessageSujet: Re: Présentation forum   Présentation forum EmptyMar 22 Juin 2010, 11:04
Revenir en haut Aller en bas
http://www.illusionimaginative.net/
.Little Lady
.Little Lady
{ Membre actif }
{ Membre actif }

Féminin Messages : 564



Présentation forum Empty
Pour mettre une class à une div ou une span il faut d'abord définir les caractéristiques de cette class donc en mettant width: auto; et height: auto; dans ton CSS à la class appropriée, la largeur et la longueur s'ajusteront automatiquement.

Mais ce ne sont les onglets auxquels tu penses.
MessageSujet: Re: Présentation forum   Présentation forum EmptyMar 22 Juin 2010, 11:12
Revenir en haut Aller en bas
http://love.sucks.free.fr
ninadobrevfan
ninadobrevfan
{ Membre }
{ Membre }

Féminin Messages : 37



Présentation forum Empty
Tout ceci est déjà fait, j'ai juste besoin de savoir où se trouve la balise du titre de catégorie et si on peux la déplacer juste au dessus du tableau de la description =)
Comme sur l'image en fait. C'est pas un onglet en lui même, c'est simplement le CSS qui est comme ça.

Edit : C'est bon j'ai trouver toute seule =)

Me reste plus qu'a savoir pour les image de gauche ^^
MessageSujet: Re: Présentation forum   Présentation forum EmptyMar 22 Juin 2010, 11:23
Revenir en haut Aller en bas
http://www.illusionimaginative.net/
.Little Lady
.Little Lady
{ Membre actif }
{ Membre actif }

Féminin Messages : 564



Présentation forum Empty
Alors cherche dans ton template index_box ceci: {catrow.forumrow.L_FORUM_FOLDER_ALT}

Cela correspond aux images de gauche. Supprime ceci: < td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle"> et ceci: < /td> puis replace ceci: {catrow.forumrow.L_FORUM_FOLDER_ALT} où tu le souhaites.
MessageSujet: Re: Présentation forum   Présentation forum EmptyMar 22 Juin 2010, 11:35
Revenir en haut Aller en bas
http://love.sucks.free.fr
ninadobrevfan
ninadobrevfan
{ Membre }
{ Membre }

Féminin Messages : 37



Présentation forum Empty
Youpi j'ai tout réussi comme je le souhaitais merci infiniment !
Sinon j'aurais une dernière petite interrogation, lorsque j'ai déplacer mon titre de catégorie, tout c'est mis en gras, je peux t'envoyer mes code pour que tu me dises si il y a un problème quelque part car j'ai bien regardé et toutes les balises sont bien fermé pourtant -_-
MessageSujet: Re: Présentation forum   Présentation forum EmptyMar 22 Juin 2010, 11:44
Revenir en haut Aller en bas
http://www.illusionimaginative.net/
.Little Lady
.Little Lady
{ Membre actif }
{ Membre actif }

Féminin Messages : 564



Présentation forum Empty
Oui oui y a pas de soucis.
MessageSujet: Re: Présentation forum   Présentation forum EmptyMar 22 Juin 2010, 11:45
Revenir en haut Aller en bas
http://love.sucks.free.fr
ninadobrevfan
ninadobrevfan
{ Membre }
{ Membre }

Féminin Messages : 37



Présentation forum Empty
Merci je t'envoi ça tout de suite alors.

Sinon pour le credit, je met .Little Lady ? Ou tu as un autre pseudo que tu préfèrerais que je mette. Vu que tu m'as beaucoup aidé, c'est normal que je te crédite donc j'aimerai bien savoir =)
MessageSujet: Re: Présentation forum   Présentation forum EmptyMar 22 Juin 2010, 11:50
Revenir en haut Aller en bas
http://www.illusionimaginative.net/
.Little Lady
.Little Lady
{ Membre actif }
{ Membre actif }

Féminin Messages : 564



Présentation forum Empty
Tu peux mettre .Little Lady ou alors .Little C ce sera pareil.
MessageSujet: Re: Présentation forum   Présentation forum EmptyMar 22 Juin 2010, 12:12
Revenir en haut Aller en bas
http://love.sucks.free.fr
ninadobrevfan
ninadobrevfan
{ Membre }
{ Membre }

Féminin Messages : 37



Présentation forum Empty
Merci =)

J'ai dernier petit soucis, tout es parfaitement comme je le souhaitais sauf que quand j'ai déplacé le titre dans mon template pour qu'il soit au dessus de mon tableau pour les descriptions et derniers messages, tout s'est mis en gras.
J'ai demandé a .Little Lady si elle pouvait m'aider et après avoir regarder mon code template et css, elle n'a rien trouvé, je vous met une capture, si vous pensez pouvoir m'aider, envoyer moi un mp et je vous enverrai ces mêmes codes.

Merci d'avance <3

Caps : https://2img.net/h/oi47.tinypic.com/2nw28mc.png
MessageSujet: Re: Présentation forum   Présentation forum EmptySam 26 Juin 2010, 16:32
Revenir en haut Aller en bas
http://www.i-love-harvard.com/
Kaiji
Kaiji
Blanche-Neige
Blanche-Neige

Féminin Messages : 5578



Présentation forum Empty
    Bonjour,

    Votre problème est-il résolu ?
MessageSujet: Re: Présentation forum   Présentation forum EmptySam 03 Juil 2010, 20:06
Revenir en haut Aller en bas
Contenu sponsorisé




Présentation forum Empty
MessageSujet: Re: Présentation forum   Présentation forum Empty
Revenir en haut Aller en bas
 

Présentation forum

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 2Aller à la page : 1, 2  Suivant

 Sujets similaires

-
» Presentation de forum
» présentation de forum
» Polices de forum
» Description forum et liens sous forum: soucis de positionement [Non résolu]
» description forum & lien forum

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
CSSActif :: De la théorie à la pratique :: Aide CSS & xHTML :: Problèmes résolus-

Partenaires Or


← Page précédente   ↑ Aller en haut Copyright © CSSActif 2009 - 2013 Tous droits réservés
Créer un forum | ©phpBB | Forum gratuit d'entraide | Signaler un abus | Cookies | Forum gratuit