AccueilFAQRechercherMembresGroupesS'enregistrerConnexion

Forum de graphisme, codage et game design proposant des tutoriels, astuces, libres services et commandes dans les domaines de l'infographie amateur, de l'intégration web (HTML et CSS essentiellement) ainsi que dans la conception de RPG sur forum.


    Faire un sélecteur de thème

    Partagez
    avatar
    Okhmhaka
    FémininAge : 32Messages : 31851

    le Mer 9 Sep 2009 - 11:48

    Rappel du premier message :

    Salut salut,

    A force de subir les demandes, je vous donne une fois pour toutes le code qui m'a servit à faire le sélecteur de Skin, en vous expliquant en deux mots comment l'utiliser.

    Le code n'est pas caché sous balise hide, mais n'hésitez pas à remercier son auteur :)
    Lien pour comprendre pourquoi le contenu n'est pas sous hide


    Code:
    <div style="text-align: center;"><font style="color: #747474;" size="1">Choisis ton ambiance :</font><br><br></div><center>                               
            <script type="text/javascript">
                /* <![CDATA[ */
                    var scheme = getCookie('template1');
                    if (scheme == 'Fresh Fruits')
                    {
                        document.write('<link rel="stylesheet" type="text/css" href="http://host.image.files.free.fr/host/4aa05ca567a5dcsstheme16b.css">');
                    }
                    else if (scheme == 'Sober Night')
                    {
                        document.write('<link rel="stylesheet" type="text/css" href="http://host.image.files.free.fr/host/4a81e47691c42csstheme17.css">');
                    }
                    else if (scheme == 'Poker Face')
                    {
                        document.write('<link rel="stylesheet" type="text/css" href="http://host.image.files.free.fr/host/4a81e3770e4b7csstheme18.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");
                    }
                /* ]]> */
            </script>
       
            <div id="skinselector">
                <form>
                    <select onchange="changeskin(this.options[this.selectedIndex].value); window.location.reload();">
                        <option> >.Skins disponibles </option>
                        <option value="Fresh Fruits"> Fresh Fruits </option>

                        <option value="Sober Night"> Sober Night </option>
                        <option value="Poker Face"> Poker Face </option>
                    </select>
                </form>
            </div>


    Ce code est à mettre l'endroit où vous voulez appliquer le sélecteur.

    Attention ! Selon l'endroit où vous le placez, ce sélecteur ne sera pas effectif partout ! Si vous voulez que lorsque le membre change de page en entrant sur le forum par exemple le skin qu'il a choisi reste le même, il faut mettre le code dans les templates en haut de page.

    Templates : "Overall_header New"

    Placez le code après :

    Code:
                <table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}">
                   <tr>
                      <td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td>
                   </tr>
                </table>


    Utilisation :

    Vous l'avez donc compris, il faut utiliser UNIQUEMENT les feuilles CSS pour donner au forum son skin, c'est là que réside la difficulté de la tâche, car mettre un code en copier coller c'est facile, mais convertir un design normalement "automatique" en CSS c'est déjà plus difficile. Estimez-vous heureux, vous n'avez pas à passer en revenue tout le CSS de base du forum pour y trouver les identifiants car beaucoup vous seront donnés dans cette section de Trucs et Astuces. Ca vous économise un bon nombre d'heure de travail.

    Il faudra donc que vous alliez fouiller dans les topics de cette section pour trouver tout les moyens d'utiliser le CSS dans vos fora.


    Précision : une fois que vous avez fait vos différentes feuilles CSS, il faut les héberger. Pour cela, utilisez par exemple H.I.F..


    Dernière édition par Sparrow-style le Mer 13 Juin 2012 - 23:05, édité 5 fois



    avatar
    Cruelly
    FémininAge : 23Messages : 2520

    le Lun 8 Fév 2016 - 9:16

    Bon je me lance
    Merci Capitaine ! Very Happy



    Construction d'un forum en cours ! Vous pouvez me donner votre avis ou m'apporter votre soutiens dans mon WIP :coeur:
    avatar
    Myosotis
    FémininAge : 16Messages : 94

    le Dim 14 Fév 2016 - 21:04

    Merci beaucoup !
    avatar
    Choubakawa
    MasculinAge : 23Messages : 59

    le Mar 16 Fév 2016 - 19:00

    Merci :)



    avatar
    Youp
    FémininAge : 22Messages : 566

    le Mer 17 Fév 2016 - 23:58

    Je suis super curieuuuse, merci du partage ^^



    avatar
    Sephy
    FémininAge : 23Messages : 134

    le Sam 20 Fév 2016 - 21:59


    Aaah super je cherchais cette astuce depuis longtemps ! :)
    Merci beaucoup !
    avatar
    Lindaóma
    FémininAge : 19Messages : 150

    le Sam 5 Mar 2016 - 17:11

    ça m'intéresse, merci pour le code !



    avatar
    Meldicia
    FémininAge : 29Messages : 31

    le Mer 16 Mar 2016 - 18:17

    Merci !!
    Darouine Lius
    MasculinAge : 27Messages : 65

    le Ven 13 Mai 2016 - 10:42

    merci :)
    avatar
    Heartfilia
    FémininAge : 17Messages : 98

    le Dim 15 Mai 2016 - 16:26

    Merci !



    YOU HELLA SAVED MY LIFE
    - chloe price
    avatar
    Meldicia
    FémininAge : 29Messages : 31

    le Dim 29 Mai 2016 - 3:57

    Merci Very Happy
    avatar
    Sapphire
    FémininAge : 20Messages : 48

    le Dim 7 Aoû 2016 - 23:13

    Merci beaucoup !
    avatar
    Llunn
    FémininAge : 27Messages : 73

    le Sam 13 Aoû 2016 - 22:04

    Merci beaucoup !
    avatar
    Sadja
    MasculinAge : 19Messages : 74

    le Dim 14 Aoû 2016 - 13:50

    Merci beaucoup ! :)
    avatar
    KimmyKinder
    FémininAge : 15Messages : 174

    le Jeu 18 Aoû 2016 - 19:54

    Merci **
    avatar
    Lou'
    FémininAge : 27Messages : 99

    le Ven 19 Aoû 2016 - 22:46

    Merci pour l'astuce, je vais essayer ça pour ma prochaine version ♥
    avatar
    Vetrox
    MasculinAge : 16Messages : 36

    le Lun 29 Aoû 2016 - 10:48

    merci
    avatar
    Mabari
    FémininAge : 24Messages : 5

    le Mer 7 Sep 2016 - 14:36

    Merci :)
    avatar
    Twearky
    FémininAge : 23Messages : 6

    le Mer 26 Oct 2016 - 11:27

    Bien
    avatar
    mijako
    FémininAge : 24Messages : 76

    le Dim 8 Jan 2017 - 1:18

    merci
    avatar
    Halvan
    MasculinAge : 21Messages : 5

    le Jeu 2 Mar 2017 - 18:50

    Merci pour le code ! Je vais voir si j'arrive à mettre tout ça en place Very Happy
    avatar
    Linaewen
    FémininAge : 24Messages : 193

    le Mer 15 Mar 2017 - 19:11

    Merci je cherchais justement comment faire Very Happy
    Contenu sponsorisé


      La date/heure actuelle est Mer 29 Mar 2017 - 11:13