Il est maintenant possible de créer des boîtes libres à volonté ! 
- Mise en place
- style.css
- configuration secondaire
Dans le panneau d'administration :
1. Créer la Boîte libre
- onglet STRUCTURE
- BOÎTES LIBRES
Les boîtes libres peuvent être placées partout

|
Les attributs généraux de toutes les boîtes latérales (y compris celles du blog) sont définis dans style.css à ces lignes :
.titrebox { /* Titre de la boîte latérale */
background-color: transparent;
border-width: 0;
padding: 4px;
white-space: nowrap;
font: bold 15px Arial, Helvetica, sans-serif;
color: #000;
text-align: left;
}
.tblbox { /* Corps de la boîte latérale */
color:inherit;
border-width: 0;
padding: 4px;
margin-bottom: 8px;
text-align:left;
background: transparent;
}
.tblboxover { /* Corps de la boîte survolé */
background-color: transparent;
}
.tblboxout { /* Corps de la boîte qui a été survolé */
background-color: transparent;
}
Pour personnaliser une boîte, copier les lignes suivantes dans le fichier style.css (n'oubliez pas de changer le numéro de la boîte !) :
.titrebox.TrFB79 { /*titre de la boîte dans une colonne latérale*/
background: url(img/image.png) no-repeat;
color: #fff;
padding-top: 15px;
height: 35px;
text-align: center;
}
.tblbox.FB79 { /*corps de la boîte*/
border-top: 1px solid #8ea2aa;
border-left: 1px solid #8ea2aa;
border-right: 1px solid #fff;
border-bottom: 1px solid #fff;
border-radius: 8px;
margin-left: 9px;
background: #e2ebee;
}
.tblbox.FB79 .box { /*texte entre le titre de la boîte et les items*/
color: #800c3f;
width: 98%;
padding: 2px;
background: #fff;
border-radius: 8px;
}
NOTE : si vous placez une boîte d'articles dans l'entête, le pied-de-page, dans l'éditorial, au-dessus ou en-dessous, celle-ci est considérée comme une boîte centrale, ce qui modifie le style |
il faudra donc indiquer :
.titre.TrFB79 { /*titre de la boîte en partie centrale*/
background: url(img/image.png) no-repeat;
color: #fff;
}
.tbl.FB79 { /*corps de la boîte*/
border-top: 1px solid #8ea2aa;
border-left: 1px solid #8ea2aa;
border-right: 1px solid #fff;
border-bottom: 1px solid #fff;
border-radius: 8px;
margin-left: 9px;
background: #e2ebee;
}
.tbl.FB79 .box { /*texte entre le titre de la boîte et les items*/
color: #800c3f;
width: 98%;
padding: 2px;
background: #fff;
border-radius: 8px;
}
|
Dans le cas où une même boite libre est présente dans 2 configurations de page, il est possible lui de donner une apparence différente pour chaque configuration.
Exemple :
- la boîte libre 79 est dans la configuration principale (0) et dans la configuration secondaire (1)
- elle est dans la colonne latérale gauche dans les 2 configurations
1. Pour l'apparence dans la configuration principale, suivre les indications de l'onglet style.css
2. Pour l'apparence dans la configuration secondaire (0), ajouter les lignes suivantes :
#LeftBoxes .L1fb79 .titrebox { /*titre boîte libre config 1*/
background: #1e8fff;
}
.L1fb79 .tblbox, .L1fb79 .tblboxover { /*corps boîte libre config 1*/
background: #ffcc00;
}
#LeftBoxes |
colonne latérale gauche |
.L1 |
colonne latérale gauche de la configuration 1 |
fb79 |
boîte libre 79 |
Pour les autres positions :
Boîtes |
Latérales |
Dans
l'entête
|
Dans le
pied de page
|
Au-dessus
|
En-dessous
|
Page d'accueil
(CONFIG ACCUEIL)
|
Gauche
|
Droite
|
Configuration 1
|
L1 |
R1 |
T1 |
B1 |
A1 |
U1 |
E1 |
N'oubliez pas : Si la boîte libre est placée ailleurs que dans les boîtes latérales :
- .titrebox devient .titre
- .tblbox devient .tbl
- .tblboxover devient .tblover
|