Sélecteur de thèmes

[Wiegraf]

Tutoriel écrit par Dragon Man


Voici le premier Sélecteur de Thèmes de Forumactif !! Ce tutoriel est là pour vous donner des instructions claires et simples pour vous aider à utiliser ceci sur votre forum.

1. Ouvrez un logiciel de traitement de texte (Wordpad par exemple), et copiez ce code :

/*****************************
Do not remove this heading!
Change Skin Script
Copyright © 2007 Dragon Man
Modified by pauldemonteverde
pauldemonteverde[AT]yahoo.com
*****************************/
document.write('<style>body {margin-top:50px !important;}</style>');
document.write('<div
style="position: absolute; width: 304px; height: 38px; z-index: 1;
left: -60px; top: 15px" id="skinselector"><form><select
onchange="changeskin(this.options[this.selectedIndex].value);
window.location.reload();"><option> Change Skin
</option><option value="DEFAULT SKIN"> Default FT skin
</option><option value="FT SKIN"> FT's Skin
</option><option value="GG SKIN"> Games n Graphics
skin</option></select></form></div>');
var scheme = getCookie('template1');
if (scheme == 'FT SKIN') {
document.write('
REL="stylesheet" TYPE="text/css"
HREF="http://www.freewebtown.com/friendstermagic3/forumcss/skin1.css">');
} else if (scheme == 'GG SKIN') {
document.write('
REL="stylesheet" TYPE="text/css"
HREF="http://www.freewebtown.com/friendstermagic3/forumcss/skin2.css">');
} else if (scheme == 'DEFAULT SKIN') {
document.write('
REL="stylesheet" TYPE="text/css"
HREF="http://www.freewebtown.com/friendstermagic3/forumcss/default.css">');
}

//No need to modify anything below this line
function changeskin(change) {
var scheme = change;
var name = 'template1';
var pathname = location.pathname;
var myDomain = pathname.substring(0,pathname.lastIndexOf('/')) +'/';
var ExpDate = new Date ();
ExpDate.setTime(ExpDate.getTime() + (180 * 24 * 3600 * 1000));
setCookie(name,scheme,ExpDate,myDomain);
}
function getCookie(name){
var cname = name + "=";
var dc = document·cookie;
if (dc.length > 0) {
begin = dc.indexOf(cname);
if (begin != -1) {
begin += cname.length;
end = dc.indexOf(";", begin);
if (end == -1) end = dc.length;
return unescape(dc.substring(begin, end));
}
}
return null;
}

function setCookie(name, value, expires, path, domain, secure) {
document·cookie = name + "=" + escape(value) +
((expires == null) ? "" : "; expires=" + expires.toGMTString()) +
((path == null) ? "" : "; path=" + path) +
((domain == null) ? "" : "; domain=" + domain) +
((secure == null) ? "" : "; secure");
}

2. Enregistrez ce fichier sous skins.js (enfin, quelque chose que vous reconnaitrez facilement, mais il faut qu'il aie l'extension .js)

3. Hébergez ce fichier quelque part, je vous recommande http://pmsc.free.fr/ ou tout autre hébergeur qui accepte les fichiers JS.

4. Une fois que vous avez l'url de votre fichier, mettez ce code dans :
Panneau d'admin Configuration Description du site

Code:

<script src="URL_DU_FICHER_JS.js"></script>

Remplacez URL_DU_FICHER_JS.js par l'url de votre fichier (celui que vous venez d'héberger).

Et c'est fait.



Changer les thèmes par ceux que vous voulez :

Voici une façon rapide d'avoir vos propres thèmes :

Texte en Bleu: Les passages en bleu son des noms utilisés pour le code, je vous conseille de les renommer en SKIN 1, SKIN 2 etc. (ILS DOIVENT RESTER IDENTIQUES POUR QUE LE CODE MARCHE !)

Texte en Rouge: C'est simplement les noms des thèmes, appellez les comme vous voulez

Texte en Orange: Les passages en orange sont les urls des fichiers css des thèmes.
Pour avoir les votres, collez le code que vous voulez dans un éditeur de textes (genre Wordpad), et enregistrez sous "fichier.css".
Ensuite, hébergez ce fichier et remplacez l'url dans le code plus haut.
Il est important de mettre les noms au bon endroit, sinon vous aurez les bons thèmes, mais les mauvais noms.

Texte en Vert[/b] :
"document·cookie" Remplacez le point par un point normal (je ne sais pas pourquoi il s'affiche au milieu...)

Il y a assez de place ici pour 3 thèmes, mais pour en ajouter plus, ajoutez ces codes aux bons endroits :

document.write('<style>body {margin-top:50px !important;}</style>');
document.write('<div
style="position: absolute; width: 304px; height: 38px; z-index: 1;
left: -60px; top: 15px" id="skinselector"><form><select
onchange="changeskin(this.options[this.selectedIndex].value);
window.location.reload();"><option> Change Skin
</option><option value="DEFAULT SKIN"> Default FT skin
</option><option value="FT SKIN"> FT\'s Skin
</option><option value="GG SKIN"> Games n Graphics
skin</option><option value="SKIN VALUE"> SKIN NAME</option></select></form></div>');

Ajoutez ceci autant de fois que vous voulez, en remplaçant SKIN VALUE et SKIN NAME par ce que vous voulez.

Pour ajouter des thèmes:

var scheme = getCookie('template1');
if (scheme == 'FT SKIN') {
document.write('
REL="stylesheet" TYPE="text/css"
HREF="http://www.freewebtown.com/friendstermagic3/forumcss/skin1.css">');
} else if (scheme == 'GG SKIN') {
document.write('
REL="stylesheet" TYPE="text/css"
HREF="http://www.freewebtown.com/friendstermagic3/forumcss/skin2.css">');
} else if (scheme == 'DEFAULT SKIN') {
document.write('
REL="stylesheet" TYPE="text/css"
HREF="http://www.freewebtown.com/friendstermagic3/forumcss/default.css">');
} else if (scheme == 'SKIN VAULE') {
document.write('
HREF="http://URL_DU_FICHIER_CSS.css">');
}

Encore une fois, remplacez SKIN VALUE par la valeur appropriée, et URL_DU_FICHIER_CSS.css par la bonne url. Vous pouvez ajouter ceci pour ajouter autant de thèmes que vous voulez.


J'espère que ce n'était pas trop confus
Dragon Man


Code créé by Dragon Man
Edité et Debuggé by pauldemonteverde
Traduit par Wiegraf