It is currently Sun 25 Sep 2016 - 07:25 - créer un forum

[Modification] Guide du css xooit

Skip to content

Post new topic Reply to topic Goto page: 1, 2, 3116, 117, 118  >

[Modification] Guide du css xooit
Author Message
themalin
Membre


Offline
Membre

Joined: 19 Apr 2006
Posts: 8,897
Point(s): 9,101
Moyenne: 1.02
Mac Firefox (ou l'un de ses dérivés : Minefield/Pale Moon/...)

PostPosted: Tue 5 Sep 2006 - 17:14    Post subject: [Modification] Guide du css xooit Reply with quote

PublicitéSupprimer les publicités ?
Bonjour voilà un guide pour savoir comment modifier votre template css parfaitement et toute les options possible qui sont dedans
pour le thèmes de type sub ce sera aussi possible dans votre template overall header


Pour votre scrollbar(qui est la barre qui apparait sur votre droite) :


utilisez ce tuto :

changer la scroll barre

Si vous voulez mettre un autre curseur que la petite flèche :


Changer le curseur

Tout d'abord comment changer votre image de fond :


si votre thème est de type sub suivez ce tuto :

mettre une image de fond


Si vous avez un autre type de thème suivez les instructions suivante :

Panneau admin Flèche modifier les templates Flèche votre template css Flèche cherchez

Code: Sélectionner - Agrandir
 /* General page style. The scroll bar colours only visible in IE5.5+ */
body {
   background-color: #000000;
   scrollbar-face-color: #000000;
   scrollbar-highlight-color: #000000;
   scrollbar-shadow-color: #000000;
   scrollbar-3dlight-color: #48A2AA;
   scrollbar-arrow-color: #48A2AA;
   scrollbar-track-color: #000000;
   scrollbar-darkshadow-color: #48A2AA;
   background-image : url('http://img2.xooimage.com/files/f/o/fond01-34624.jpeg');
   background-repeat : no-repeat;
   background-attachment : fixed;
   background-position : right;


Selon les thèmes le background image est placé différement et il peut y avoir ou nom des attachment et position en plus


Il vous suffit de changer l'image par celle que vous voulez mettre!!

Pour optimiser votre image de fond vous pouvez rajouter après :


Code: Sélectionner - Agrandir
background-repeat: repeat-y;
background-attachment: fixed;
background-position : center;


Il vous suffira de changer la valeur pour déplacer votre image


Pour modifier votre police d'écriture :



Code: Sélectionner - Agrandir
/* General font families for common tags */
font,th,td,p { font-family: Verdana, Arial, Helvetica, sans-serif }
a:link,a:active,a:visited { color : #C6E5E8; text-decoration: none; }
a:hover      { text-decoration: underline; color : #48A2AA; }
hr   { height: 0px; border: solid #48A2AA 0px; border-top-width: 1px;}


Les premiers champ sont pour votre police d'écriture
Ensuite c'est pour changer la couleur de vos liens
Vous pouvez modifier en mettant le code de style#000000 ou le nom de la couleur en anglais voulue


ensuite il arrive que vous aillez une autre image de fond mais plus en avant en fonction des thèmes

cherchez :
Code: Sélectionner - Agrandir

/* This is the border line & background colour round the entire page */


puis

Code: Sélectionner - Agrandir
   background-image : url('http://img2.xooimage.com/files/p/i/pixel06-34625.gif');
}


Et changez l'image comme pour l'autre image de fond

Vous pouvez aussi en faire un fond de couleur en transformant :

Code: Sélectionner - Agrandir

background-image  en background-color



Pour modifier vos citations et code :


Code: Sélectionner - Agrandir
/* Quote & Code blocks */
.code {
   font-family: Courier, 'Courier New', sans-serif; font-size: 11px; color: #000000;
   background-color: #808080; border: #48A2AA; border-style: solid;
   border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px
}

.quote {
   font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #E7D4FF; line-height: 125%;
   background-color: #404040; border: #48A2AA; border-style: solid;
   border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px


De la même façon que pour le reste vous pourrez modifier les couleurs de vos code et quotes en changer les couleur de background ect en mettant le nom de la couleur en anglais



Changer le nom des forum et des catégories :


Code: Sélectionner - Agrandir

/* Forum category titles */
.cattitle      { font-weight: bold; font-size: 12px ; letter-spacing: 1px; color : #C6E5E8;}
a.cattitle      { text-decoration: none; color : #C6E5E8; }
a.cattitle:visited { text-decoration: none; color : #C6E5E8; }
a.cattitle:hover{  color: #48A2AA; text-decoration: none; }


/* Forum title: Text and link to the forums used in: index.php */
.forumlink      { font-weight: bold; font-size: 12px; color : #FFFFFF; }
a.forumlink    { text-decoration: none; color : #C6E5E8; }
a.forumlink:visited { text-decoration: none; color : #C6E5E8; }
a.forumlink:hover{ text-decoration: none; color : #48A2AA; }


Vous pouvez changer la taille en modifiant :

Code: Sélectionner - Agrandir
12px


Vous pourrez aussi changer la couleur

Changer le nom des sujets :



Code: Sélectionner - Agrandir
/* titles for the topics: could specify viewed link colour too */
.topictitle         { font-weight: bold; font-size: 11px; color : #C6E5E8; }
a.topictitle:link   { text-decoration: none; color : #C6E5E8; }
a.topictitle:visited { text-decoration: none; color : #FFFFFF; }
a.topictitle:hover   { text-decoration: underline; color : #48A2AA; }


de la même manière que pour les titres des forums et catégories

Pour mettre mettre une image de fond derière les titres de modules sur le portail :



Dans votre fichier css cherchez :


Code: Sélectionner - Agrandir
td.row1   { background-color: #code couleur; }


ajoutez avant :

Code: Sélectionner - Agrandir
td.catLeft   { background-color: #code couleur; }


Cela vous mettra un fond de couleur il vous suffira de changer code couleur par la couleur voulue

Pour mettre une image en fond :


Code: Sélectionner - Agrandir

td.catLeft   { background-image: url('lien de votre image'); }


Changer la couleur de la date de votre dernier message sur l'index :


Dans votre template css cherchez :


Code: Sélectionner - Agrandir

a.gen:hover,a.genmed:hover,a.gensmall:hover   { color: #couleur; text-decoration: none; }


Ajouter à la suite :


Code: Sélectionner - Agrandir
.genpost { font-size : 10px; color: #couleur;}


Dans index_body.tpl cherchez :


Code: Sélectionner - Agrandir
   <td class="row2" align="center" valign="middle" height="50" nowrap="nowrap"> <span class="gensmall">{catrow.forumrow.LAST_POST}</span></td>


Remplacez par :


Code: Sélectionner - Agrandir
   <td class="row2" align="center" valign="middle" height="50" nowrap="nowrap"> <span class="genpost">{catrow.forumrow.LAST_POST}</span></td>


Remplacez les couleur par les couleurs que vous voulez mettre




Pour modifier la couleur des liens dans les tableaux
(Copier/coller d'un tableau en HTML vers les forums XOOIT)


Dans bbcode.tpl, rajouter (à la fin) :
Code: Sélectionner - Agrandir
<!-- BEGIN table --><table class="forumline table1 bg3 bbcode-table"{ARGS}><!-- END table -->


Puis, dans NomDuTheme.css ou overall header en fonction des thèmes, rajouter (à la fin) de la partie css :
Code: Sélectionner - Agrandir
table.bbcode-table a:link { color: #0000FF }
table.bbcode-table a:active { color: #FFFFFF }
table.bbcode-table a:visited { color: #666666 }
table.bbcode-table a:hover { color: #000000 }


Pour changer la couleur de fond des cellules du tableau ajouter ce code :


Code: Sélectionner - Agrandir
table.bbcode-table td.row3 { background-color: #codecouleur; }


(en mettant les couleurs souhaitées)

http://www.henri-ruch.ch/HTML/Couleurs/couleurs.asp






_______________________


Last edited by themalin on Thu 29 Oct 2009 - 12:12; edited 2 times in total
Forum
Author Message
tellus


Offline
Guest




PostPosted: Sun 26 Aug 2007 - 23:20    Post subject: [Modification] Guide du css xooit Reply with quote

Bonjour

moi, je cherche simplement à supprimer l'image située en haut à gauche de mon forum, et non à la remplacer

j'aimerai aussi me débarasser de ces pubs qui envahissent la partie haute du site

merci

http://les3fleaux.vraiforum.com


Author Message
themalin
Membre


Offline
Membre

Joined: 19 Apr 2006
Posts: 8,897
Point(s): 9,101
Moyenne: 1.02
Mac Firefox (ou l'un de ses dérivés : Minefield/Pale Moon/...)

PostPosted: Mon 27 Aug 2007 - 09:46    Post subject: [Modification] Guide du css xooit Reply with quote

bonjour

panneau admin
thème
modifier les templates
overall header cherches et supprimes

Code: Sélectionner - Agrandir

<td><a href="index.php"><img src="http://img7.xooimage.com/files/l/o/logo_phpbb-3463d.gif" border="0" alt="Forum Les 3 fléaux Index du Forum" vspace="1" /></a></td>


pour les pub

panneau admin
publicité et tu choisis
_______________________


Forum
Author Message
slan


Offline
Guest




PostPosted: Sat 10 Nov 2007 - 15:28    Post subject: [Modification] Guide du css xooit Reply with quote

bonjour  comment faire pour mettre l'image qu'elle se redimmensionne automatiquement

Author Message
themalin
Membre


Offline
Membre

Joined: 19 Apr 2006
Posts: 8,897
Point(s): 9,101
Moyenne: 1.02
Mac Firefox (ou l'un de ses dérivés : Minefield/Pale Moon/...)

PostPosted: Sat 10 Nov 2007 - 18:38    Post subject: [Modification] Guide du css xooit Reply with quote

bonjour

de quelle image parles tu exactement???
_______________________


Forum
Author Message
slan


Offline
Guest




PostPosted: Sat 10 Nov 2007 - 20:11    Post subject: [Modification] Guide du css xooit Reply with quote

l'image du fond

Author Message
themalin
Membre


Offline
Membre

Joined: 19 Apr 2006
Posts: 8,897
Point(s): 9,101
Moyenne: 1.02
Mac Firefox (ou l'un de ses dérivés : Minefield/Pale Moon/...)

PostPosted: Sat 10 Nov 2007 - 20:52    Post subject: [Modification] Guide du css xooit Reply with quote

tu ne peux pas mais en utilisant ce tuto tu peiux faire en sorte qu'en fonction des résolution les membres puissent choisir

http://xooit.xooit.com/t25473-Tuto-Selecteur-d-apparence.htm
_______________________


Forum
Author Message
Jessomdu59
Membre


Offline
Membre

Joined: 02 May 2008
Posts: 69
Point(s): 69
Moyenne: 1.00

PostPosted: Tue 23 Sep 2008 - 18:44    Post subject: [Modification] Guide du css xooit Reply with quote

j'ai beau suivre les indications du tuto j'arrive pas a crer mon propre design
je fait comment


Forum
Author Message
themalin
Membre


Offline
Membre

Joined: 19 Apr 2006
Posts: 8,897
Point(s): 9,101
Moyenne: 1.02
Mac Firefox (ou l'un de ses dérivés : Minefield/Pale Moon/...)

PostPosted: Wed 24 Sep 2008 - 08:29    Post subject: [Modification] Guide du css xooit Reply with quote

bonjour

tu vérifies bien de ne pas avoir les codes dans le template overall header tpl
_______________________


Forum
Author Message
Jessomdu59
Membre


Offline
Membre

Joined: 02 May 2008
Posts: 69
Point(s): 69
Moyenne: 1.00

PostPosted: Wed 24 Sep 2008 - 08:36    Post subject: [Modification] Guide du css xooit Reply with quote

ahh faut pas qu'il y ai de codes?
donc je l'efface et apres?


Forum
Author Message
themalin
Membre


Offline
Membre

Joined: 19 Apr 2006
Posts: 8,897
Point(s): 9,101
Moyenne: 1.02
Mac Firefox (ou l'un de ses dérivés : Minefield/Pale Moon/...)

PostPosted: Wed 24 Sep 2008 - 08:38    Post subject: [Modification] Guide du css xooit Reply with quote

non tu n'as pas compris

dans ton template overall header vérifies que tu n'ais pas les même code

si oui c'est dans ce template que tu dois modifies pas le css
_______________________


Forum
Author Message
Jessomdu59
Membre


Offline
Membre

Joined: 02 May 2008
Posts: 69
Point(s): 69
Moyenne: 1.00

PostPosted: Wed 24 Sep 2008 - 08:39    Post subject: [Modification] Guide du css xooit Reply with quote

oui mais je doit mettre quoi ? j'y connais vraiment rien et on les fait commetn les codes?

Forum
Author Message
themalin
Membre


Offline
Membre

Joined: 19 Apr 2006
Posts: 8,897
Point(s): 9,101
Moyenne: 1.02
Mac Firefox (ou l'un de ses dérivés : Minefield/Pale Moon/...)

PostPosted: Wed 24 Sep 2008 - 08:45    Post subject: [Modification] Guide du css xooit Reply with quote

tu fais les même modifs que tu as fais dans le css c'est tout
_______________________


Forum
Author Message
Jessomdu59
Membre


Offline
Membre

Joined: 02 May 2008
Posts: 69
Point(s): 69
Moyenne: 1.00

PostPosted: Wed 24 Sep 2008 - 08:46    Post subject: [Modification] Guide du css xooit Reply with quote

donc si c'est une photo que je veux mettre en fond par exemple je vias en bas dans parcourir, je selectionne et je fait envoyer? Parsque si c'est ça j'ai deja essayer et ca marche pas y'a rien qui change

Forum
Author Message
themalin
Membre


Offline
Membre

Joined: 19 Apr 2006
Posts: 8,897
Point(s): 9,101
Moyenne: 1.02
Mac Firefox (ou l'un de ses dérivés : Minefield/Pale Moon/...)

PostPosted: Wed 24 Sep 2008 - 08:48    Post subject: [Modification] Guide du css xooit Reply with quote

non pour le fond regardes ici

http://xooit.xooit.com/p315076.htm
_______________________


Forum
Author Message
Contenu Sponsorisé





PostPosted: Today at 07:25    Post subject: [Modification] Guide du css xooit

Display posts from previous:   
Reply to topic Page 1 of 118 Goto page: 1, 2, 3116, 117, 118  >




Portal | Index | Administration Panel | Create a forum | Free support forum | Free forums directory | Report a violation | Conditions générales d'utilisation
Propulsé par p h p B B © 2016 p h p B B Group |
 
© 2003-2013 Xooit.com - Contact - Mentions légales - CGU - Charte - CNIL : 1381401