fablecrabb (Créer un compte)

Ciao!

oui et j’ai trouvé un plugin excellent pour gérer le contenu de mes sidebar, il faut mtn que je finisse ce foutu CSS…

Pourquoi c’est pas bien? 🙂 c’était pour pousser les hommes de cavernes qui sont encore sur IE6 a sortir de leur grotte! (et en parallèle parce que j’ai des png transparents partout…)

Bonjour à tous!

Personne ne pouvant m’aider ici, et ne trouvant rien de concrès sur le net, j’ai choisi de télécharger un template déjà tout fait qui utilisait 2 sidebar et qui était widgétready et de m’inspirer du code, et ça a marché!!!

Peut être que ça intéresse qqn de pouvoir faire un site wordpress multi sidebar widget ready et comme j’ai bien galéré pour y parvenir, je poste ici la solution 🙂 :

1. Créer le fichier functions.php et y intégrer le code suivant

  »,
        ‘after_widget’ =>  »,
        ‘before_title’ => ‘<h2>‘,
        ‘after_title’ => ‘</h2>‘,
    ));
?>

le chiffre 2 correspondant au nb de sidebars.

2. Créer un seul fichier sidebar qui comprendra autant de div internes que l’on veut de sidebar dans notre site. Intégrer les deux morceaux de code php nécessaires juste après et juste avant les balises

les plus en externe. Modifier le numéro en fonction de si on est sur la sidebar num 1 ou la 2 par ex. Voici le code de mon fichier qui en comprend 2 (sidebar left et sidebar right)

<div class="sidebar">

<div class="sidebar_left"> 
<ul>

  <!-- début code widgétiser ma première sidebar-->




<li id="search"></li> <!--insertion formulaire de recherche -->

<li id="calendar"><h2>Calendrier</h2> <!--insertion calendrier par défaut de Wordpress-->
 
   
  

<li><h2>Archives</h2> <!--insertion archives-->
 <ul>
    
    </ul>
</li>

<li><h2> Flux RSS </h2>  <!--insertion flux rss-->
<ul>
    
<li><a href=" » title= »Flux RSS des articles »>Flux RSS des articles</a></li>
<li><a href=" » title= »Flux RSS des commentaires »>Flux RSS des commentaires</a></li>

 <!-- fin code widgétiser ma première sidebar-->
 
</ul>
</div> <!--on ferme le div sidebar_left-->

<div class="sidebar_right"> 

<ul>

  <!-- début code widgétiser ma deuxième sidebar-->

<li><h2>Categories</h2> <!--insertion catégorie-->
 <ul>
    
    </ul>


<li><h2>Menu-pagges</h2>  <!--insertion pages-->
<ul>
<a href="http://www.fightmoveacademy.ch/blog">AActualité</a>

</ul>


<li><h2>Infos Meta</h2> <!--insertion infos meta (login, etc)-->
<ul>

    <li></li>
    
 </ul>
</li>

 <!-- fin code widgétiser ma deuxième sidebar-->

</ul>

</div><!--on ferme le div sidebar_right-->
</div>

3. insérer la commande php qui appelle le fichier de la sidebar (donc j’en ai qu’un qui comprend les différentes sidebars) dans mon fichier index.php. Voici le code de mon fichier index.php

 <!-- ouvrir header,php -->

<div id="menuflash">
</div> <!-- on ferme le div menuflash-->

<div id="content">
<div id="content1">
<div id="content2">


<div class="post" id="post-« >
<h2><a href=" » title= » »></a></h2>

<p class="postmetadata"> <!-- on affiche les postmetadata (date, auteur, etc de l'article) -->
    
     par  |
    Catégorie:  |
     
 
</p>

<div class="post_content">

Oooopppsss…

Désolé, mais vous cherchez quelque chose qui ne se trouve pas ici .





4. Mettre en forme le div sidebar et son contenu dans le fichier CSS. Voici la partie de mon CSS concernée

.sidebar {
position:absolute;
background-color: #F40606;
width: 347px;
height: 360px;
bottom: 38px;
left:0;
}

.sidebar ul{
list-style: none;
margin: 0;
padding: 0 10px;
}

.sidebar li{
list-style: none;
}

.sidebar_left { /*on a séparé la sidebar en deux div pour avoir deux colonnes et les placer grâce au float */
width: 150px;
float: left;
}

.sidebar_right {
width: 150px;
float: right;
}

Et voilà!!!

Si qqn a un prob qu’il n’hésite pas à m’écrire et j’essayerai de l’aider!

A bientôt!

🙂 oui bien sûr pas de problème:

et bien en fait j’ai mon div page qui fait 1000 x 750 px. Je voulais avoir une image de background qui prenne tout le fond, et j’ai donc fait un jpg qui fait exactement 1000 x 750 px. Je n’avais pas d’indication de padding, juste le margin top qui me permet de placer un peu mon div page sur la hauteur.

Toutefois lorsque je regardais mon site, c’est comme si mon div page m’avais rogné une partie de mon image de background sur la hauteur, et pourtant le div fesait bien 750 px de haut, et lorsque je cliquais afficher l’image de fond, j’avais mon image de fond ENTIERE qui s’affichait…

Mais c’est pas grave, j’ai opté pour mettre mon image de fond dans le body et là ça joue.

J’avais mis une hauteur pour mon conteneur parce que j’avais peur que sinon je ne pouvais pas définir l’emplacement de mes div avec un « bottom: 5px; » par ex…

J’ai essayé de widgétiser mon template en suivant ce tuto:
ici,

mais j’ai un problème très bizarre, j’ai ceci:
[function.array-merge]: Argument #2 is not an array in /home/www/a580eb005036d21b27555d5084e9618c/web/blog/wp-includes/widgets.php on line 60

qui s’affiche en haut de mon blog, et de plus la fonction widget ne fonctionne pas. Je vais créer un nouveau sujet dans le forum, peut être que qqn sait qu’est-ce que je dois aller grailler dans le fichier widgets.php à la ligne 60…🙂

…je viens de tomber sur un tutoriel sur la gestion de la sidebar pour un site wordpress mi site traditionnel mi blog. Je vais donc essayer de résoudre ma deuxième question seul pour ne pas te surcharger de questions 🙂

et bien j’aimerais un design fixe pour commencer pour ne pas trop compliquer la tache avec mes div qui contiennent une image de fond, car même si je sais que je peux l’étirer en la coupant en plusieurs morceaux, je préfère faire simple.

J’ai regardé ton tuto pour l’alignement vertical, et après avoir essayé quelques uns de leurs trucs et avoir fouiné sur le web, j’ai abandonné car apparemment c’est en effet un sujet épineux :happy: et je me base plutôt sur un margin-top: value; pour gérer quand même un peu le positionnement vertical…

Sais tu aussi pourquoi est-ce qu’on a un effet de sintillement pour la partie du background qui se trouve sous le div content, lorsqu’il y a un scroll pour la page (donc que par ex ma sidebar est trop longue) ? C’est curieux ce truc!

Salut!

je te remercie bcp pour ta réponse, j’ai donc installé les extensions et corrigé l’erreur pour le div sidebar! Par contre je ne comprends pas bien ce que font ces extensions, elles permettent réellement de changer la feuille de style d’un site par ex? Mais les changements seront visibles seulement pour notre pc?

Sinon j’ai fait un shéma du site le voilà

Voici les différents div du shéma:
1: Div header- Doit rester à la même place tout le temps, n’est pas scrollable
2: Div sidebar- Doit rester à la même place tout le temps, n’est pas scrollable
3: Div news- Doit rester à la même place tout le temps, n’est pas scrollable, contient une bannière style pub
4: Div menu flash – Doit rester à la même place tout le temps, n’est pas scrollable, contient une anim flash
5: Div content – Doit rester à la même place tout le temps, le fond est fixe, mais le contenu est scrollable
6: Div footer – Doit rester à la même place tout le temps, n’est pas scrollable
7: Div page – J’aimerais qu’il soit centré en hauteur et en largeur par rapport à l’écran, afin de se poser correctement sur l’image de background

Mes questions sont donc:
– Comment puis je centrer en hauteur et en largeur mon div page?
– Est-il possible de faire que le scroll du div content soit celui du bord de page, plutôt que d’être situé sur le bord du div content?
– Est-ce que ma technique pour placer mes div internes par rapport au div page est elle juste? (le div page en position relative, les autres en absolue, et le placement grâce au infos « bottom:0 » etc?
– Comment faire pour bloquer impérativement la taille du div page? Actuellement si j’ajoute du contenu à la sidebar, il s’allonge, j’ai pourtant spécifié une taille dans le CSS pour le div page…

Merci d’avance pour votre aide à tous!

le fichier sidebar

<div> 
<ul>
</ul>
<li id="search"></li> <!--insertion formulaire de recherche -->

<li id="calendar"><h2>Calendrier</h2> <!--insertion calendrier par défaut de Wordpress-->
 
   
  
<li><h2>Categories</h2> <!--insertion catégorie-->
 <ul>
    
    </ul>

<?php wp_list_pages('title_li=<h2>Menu-pages</h2>‘); ?> <!--insertion pages-->

<li><h2>Archives</h2> <!--insertion archives-->
 <ul>
    
    </ul>
</li>


<li><h2>Infos Meta</h2> <!--insertion infos meta (login, etc)-->
<ul>

    <li></li>
    
 </ul>
</li>

<li><h2> Flux RSS </h2>  <!--insertion flux rss-->
<ul>
    
<li><a href=" » title= »Flux RSS des articles »>Flux RSS des articles</a></li>
<li><a href=" » title= »Flux RSS des commentaires »>Flux RSS des commentaires</a></li>
 
</ul>
</li>


 
  </li>

 </li>
</div>