Replier/déplier des blocs dans la sidebar (Créer un compte)

  • Statut : non résolu
10 sujets de 16 à 25 (sur un total de 25)
  • Auteur
    Messages
  • #578980
    Qwindoo
    Modérateur
    Maître WordPress
    2862 contributions

    Salut et désolé pour le retard de ma réponse 🙂

    Reprenons depuis le début, OK ?

    Le script qui te servira à plier/déplier des blocs est composé de plusieurs parties, codées en plusieurs langages de programmation:

    1ère partie : codée en JavaScript, elle consiste en un fichier blockmanager.js que tu devras créer puis uploader sur ton serveur en retenant l’adresse de son emplacement.

    Voici le contenu de ce fichier blockmanager.js :

    function WriteCookie (name, value)
    {
    var argv = WriteCookie.arguments;
    var argc = WriteCookie.arguments.length;
    var expires = (argc > 2) ? argv[2] : null;
    var path = (argc > 3) ? argv[3] : null;
    var domain = (argc > 4) ? argv[4] : null;
    var secure = (argc > 5) ? argv[5] : false;
    document.cookie = name+’=’+escape(value)+
    ((expires == null) ?  » : (‘; expires=’+expires.toGMTString())) +
    ((path == null) ?  » : (‘; path=’+path)) +
    ((domain == null) ?  » : (‘; domain=’+domain)) +
    ((secure == true) ? ‘; secure’ :  »);
    }

    function GetCookieValue (offset)
    {
    var endstr = document.cookie.indexOf (‘;’, offset);
    if (endstr == -1)
    endstr = document.cookie.length;
    return unescape(document.cookie.substring(offset, endstr));
    }

    function ReadCookie (name)
    {
    var arg = name+’=’;
    var arg_length = arg.length;
    var cookie_length = document.cookie.length;
    var i = 0;
    while (i < cookie_length)
    {
    var j = i+arg_length;
    if (document.cookie.substring(i, j) == arg)
    return GetCookieValue(j);
    i = document.cookie.indexOf(' ',i)+1;
    if (i == 0)
    break;
    }
    return null;
    }

    function ShowHide (block_id)
    {
    block = document.getElementById(block_id);
    block.style.display = (block.style.display == 'block') ? 'none' : 'block';
    }

    function SwitchBlockCookie (cookie_name)
    {
    date = new Date;
    date.setMonth(date.getMonth()+1);
    value = ReadCookie(cookie_name);
    WriteCookie(cookie_name, ((value == 0) ? '1' : '0'), date);
    }

    Tu devras ensuite inclure ce fichier dans tes pages web en ajoutant la ligne suivante dans le fichier header.php de ton thème (situé dans /wp-content/themes/nom_du_theme/):

    <script type="text/javascript" src="wp-content/themes/nom_du_theme/blockmanager.js » />

    Voilà 🙂

    2ème partie : codée en PHP, elle consiste en quelques lignes de code que tu peux au choix placer dans un fichier block.func.php (par exemple) que tu inclueras au début de ton fichier header.php grâce à la ligne suivante : , ou bien tu peux tout simplement écrire les lignes suivantes au début de ton fichier header.php :

    3ème partie : elle consiste en quelques ajouts de code xhtml dans tes fichiers de template : des liens (un par bloc)

    <a href="ShowHide('nom_du_bloc_a_rendre_dynamique')" title="Cliquez pour Afficher / Masquer le bloc">+/-</a>

    et les codes suivants (un par bloc) aux endroits qui deviendront dynamiques:

    <div style="display: ; »>contenu de ton div</div>

    Voilà, en espérant avoir été assez clair dans la méthode et le langage (désolé si j’ai fait des fôtes mais j’écris sur un ordi portable qui m’est assez étranger) 😉

    #578981
    Ellaurenzovfoot
    Participant
    Chevalier WordPress
    224 contributions

    Merci pour ta réponse Ms-Dos-1991, mais malheureusement j’ai quelques bugs, que l’on pourrait nommer un peu gênant :p
    mon site
    Comme vous pouvez le voir, il y a un ch’tit bug.

    En fait j’ai bien créer le .js comme dit, je l’ai mis dans le dossier de mon thème.
    Ok pour cette étape.

    C’est maintenant que cela se complique. J’ai bien la fonction php en hautde mon header.php de mon thème, cependant lorsque je met le script qui appelle le .js cela donne le résultat que vous voyez. Je n’ai que la sidebar qui est visible et fait disparaitre mes catégories….
    J’ai essayé de le mettre dans plusieurs endroit de la page à chaque fois il y a un bug… :s Je l’ai mis juste avant comme vu dans le code source du site de Cliclac.

    <link rel="pingback" href=" » />

    <script type="text/javascript" src="wp-content/themes/mag-10/blockmanager.js » />

    Je me suis dit que j’allais continuer la manip, voir si cela allait arranger et comme vous pouvez le voir, j’ai essayer avec les liens, et voilà ce que cela fait. On voit juste le plus et le moins… :s
    J’ai mis cela comme code dans ma Sidebar, pour les liens, pour l’essai:

    <div style="display: ; »>

    Liens

    +/-

    Alors voili voilou ou j’en suis….Je me suis dit que c’était un problème par rapport au nom que je donnais, alors j’ai a peu pres tout essayé…. get_links, la commande php pour les appeller, links.php, etc….
    Je ne vois pas quoi faire ni où est l’erreur, me demandant,si c’est vraiment dans la sidebar que je dois mettre cela….
    J’ai essayé le pluging wp-dtree et il ne se trouve pas dans la sidebar, donc, je suppute le truc, mais je vois pas comment le régler….

    Enfin voili voilou, désolé d’être boulet, mais je comprend pô :s

    #578982
    Qwindoo
    Modérateur
    Maître WordPress
    2862 contributions

    Of course, excuse-moi 🙂

    Il faut bien entendu que tu donnes un nom au bloc que tu veux rendre dynamique (le même que dans l’appel javascript) et ce grâce à l’attribut html id= »nom_du_bloc_a_rendre_dynamique » 😉

    Tiens nous au courant 🙂

    #578983
    Ellaurenzovfoot
    Participant
    Chevalier WordPress
    224 contributions

    Heu… je ne vois pas ce que tu veux dire… je suis un peu perdu, désolé…
    id= c’est-à-dire?
    Comment faire parvenir mes liens, catégories, archives, etc? Que dois-je inscrire? Que dois-je mettre comme nom du bloc a rendre dynamique, ne dois-je pas faire appeler qqch comme get_links, comme quand on fait directement dans le sidebar?

    Deplus comment cela se fait qu’en insérant le ….. dans le header ca ne me fait qu’apparaitre le side, déformer de plus?

    Désolé pour toutes ces questions, je comprend pas trop là…..:s

    #578984
    Qwindoo
    Modérateur
    Maître WordPress
    2862 contributions

    Les fonctions que tu as insérées dans tes pages web grâce aux codes que je t’ai donné servent à masquer et à afficher le contenu de certaines balises auxquelles tu as donné un id particulier… Exemple :

    Tu fais un texte de présentation sur ton blog :

    <p>Je m’appelle Thomas…</p>

    … et tu souhaiterais afficher un lien pour afficher ou masquer ce bloc de texte et retenir l’état d’affichage 🙂

    Donc tu te retrouves avec le code suivant :

    <p><a href="ShowHide('block_about_me')" title="Cliquez pour Afficher / Masquer le bloc">+/-</a></p>
    <p id="block_about_me" style="display: « >Je m’appelle Thomas…</p>

    C’est pas plus compliqué que ça 🙂

    #578985
    Ellaurenzovfoot
    Participant
    Chevalier WordPress
    224 contributions

    Bon je continue à jouer le relou… désolé…

    +/-
    <div style="display: ; »>

    Ca me met un plus et un moins et ca m’affiche tout les liens… et quand je clique sur +/- ça ne change rien…

    blem.jpg

    De plus j’ai toujours le bug du javascript dans le header qui nefait qu’apparaitre la sidebar, je comprend pas :s

    Je te remercie pour ton aide 🙂

    #578986
    Ellaurenzovfoot
    Participant
    Chevalier WordPress
    224 contributions

    Bon je continue à essayer… je viens de comprendre ce que tu disais par id… (oui oui je suis un peu lent…)

    Alors j’ai mis ça comme code,c’est tout le code que j’ai concernant les liens, parde balise en plus ou en moins (j’ai l’impression que c’est là que ça bug justement):

    <a href="ShowHide('Liens')" title="Cliquez pour Afficher / Masquer le bloc">+/-</a>
    <?php id="Liens" style="display: ; » get_links_list(); ?>

    Mais cela me donne:

    Parse error: syntax error, unexpected ‘=’ in

    dans la sidebar

    et

    /var/www/virtual/alterhito.fr.nf/htdocs/wp-content/themes/mag-10/sidebar.php on line 62

    dans le footer…

    louche…

    #578987
    Qwindoo
    Modérateur
    Maître WordPress
    2862 contributions

    Oui, c’est « normal » : tu as confondu ce qui fait partie du code PHP avec le code HTML 😉

    J’aurais du commencer par t’expliquer en fait : ce qu’on veut, c’est:
    1. Afficher des blocs de texte (ça c’est déjà fait sur ton blog)
    2. Etre capable de replier ces blocs en cliquant sur un bouton (dans ce cas-ci, grâce à un lien)
    3. Pouvoir sauvegarder l’état de « repliage » de ces blocs de texte dans des cookies
    4. Et enfin lors du chargement des pages, plier automatiquement ou non ces blocs selon les éventuels cookies

    Tu vois que les parties 1., 2. et 3. ne dépendent pas du serveur (de PHP) mais bien du navigateur (donc de l’HTML et du Javascript) alors que la dernière se fait lors de la génération de la page donc par le serveur (en PHP) 😉

    Pour arriver à ce résultat, on va donc :
    1. charger un fichier javascript qui contient des fonctions pour lire et écrire dans des cookies
    2. Ajouter du code html pour créer un lien qui lorsqu’on cliquera dessus appellera le code JavaScript qu’on a précédemment écrit (ça, tu l’as fait correctement)
    3. Changer 2-3 trucs sur les blocs de texte existants pour qu’ils puissent être reconnus par nos codes, et c’est là que tu t’es trompé 🙂

    Le bon code est le suivant :

    <a href="ShowHide('Liens')" title="Cliquez pour Afficher / Masquer le bloc">+/-</a>
    <div id="Liens" style="display: ; »></div>

    Voilàà 🙂

    P.S: j’écris depuis un ordinateur portable, donc si j’ai fait quelques fôtes d’orthographes, excusez-moi 😉

    #578988
    Ellaurenzovfoot
    Participant
    Chevalier WordPress
    224 contributions

    Merci 🙂, ca marche, je peux enfin enfin appuyer sur le +/- et ca fait bien le bloc 🙂
    Mais j’ai encore le problème que quand j’ai le header et la sidebar avec ces changements, je ne vois que la sidebar sur toute la page….
    J’ai installé webdevellepor de firefox et il m’a montrer les erreurs javascript, j’ai réussi à en régler une, mais les autres je ne vois pas à quoi elles correspondent :s

    Erreur : invalid XML attribute value
    Fichier source : http://alterhito.fr.nfwp-content/themes/mag-10/blockmanager.js
    Ligne : 6, Colonne : 17
    Code source :

    Erreur : SwitchBlockCookie is not defined
    Fichier source : http://alterhito.fr.nf/
    Ligne : 1

    Erreur : ShowHide is not defined
    Fichier source : javascript:ShowHide(‘Liens’)
    Ligne : 1

    Bon après tout cela, ça devrait être bon:)
    Je te remercie beaucoup en tout cas M. ms-dos 🙂

    edit: tiens je viens de remarquer l’adresse de la premiere erreur avec .fr.nfwp-content… pourtant la premiere erreur était justement avec un code dans le header du javascript qui appelait justement sans le / je l’ai rajouté, et c’est d’ailleurs de là que je peux faire le +/- , pourquoi me l’affiche t-il encore comme ça hmm….

    #578989
    Qwindoo
    Modérateur
    Maître WordPress
    2862 contributions

    Salut 🙂

    Ta page comporte plein d’erreurs de codage, ce qui provoque très probablement tes problèmes … heureusement pour toi, il est assez simple de les corriger :

    1. Les balises et noms des attributs doivent être en minuscules (ça réglera les erreurs de type there is no attribute « CONTENT » 😉 )
    2. Certaines balises de ta page sont en double, comme par exemple des balises

  • (lignes 270, 286, etc)
    3. Les balises
    doivent posséder un slash fermant en xhtml :

    4. Il faut encoder les esperluettes présentes dans tes pages : « & » en les remplaçant par «  « 

    Cela devrait corriger pas mal d’erreurs d’un coup, et tu pourras te pencher sur les quelques erreurs de balises mal alternées restantes 😉

    N’abandonne pas, WordPress est vraiment un bon truc 😎 :D

10 sujets de 16 à 25 (sur un total de 25)
  • Le forum ‘Utilisation spécifique de WordPress’ est fermé à de nouveaux sujets et réponses.