Vos Projets » Site internet : pages d'enfants
Catégorie:  
   
Site internet : pages d'enfants
Publié le 13/04/2011 @ 08:46:20,
Par Monky
Salut la compagnie !

Vous connaissez pour certain mon site. J'ai modifié le thème pour qu'il soit plus léger aux yeux. J'ai enfin réussi à réaliser une sidebar (à droite) différente de celle de l'ensemble du site pour ce que j'appelle "les pages personnelles des enfants".

En voici une : http://www.enseignelibre.be/?page_id=2673

L'idée est donc de présenter les travaux des enfants sur une page : que ce soit leurs productions écrites comme les vidéos et les sons.

Je ne suis pas un as en la matière et je viens vers vous pour récolter des conseils : que serait-il possible de faire pour que ces pages personnelles deviennent plus simples à utiliser : que ce soit via la sidebar comme le contenu. Si vous parcourez la page, vous pouvez constater qu'elle peut être très longue avec les vidéos...

Ceci dit : j'ai besoin de quelque chose de rapide à la création. C'est-à-dire de facile à mettre en place et qui ne me demande des dizaines de manipulations par page. J'ai 24 enfants cette année, il peut-être plus d'autres années...

Mon idée est de pouvoir conserver tout cela presque "à vie". Chaque année, j'ouvre une nouvelle zone pour ma classe suivante en conservant les autres.

Petite précision : je fonctionne sous Wordpress. Le Php est donc possible même si je n'y connais rien.
   
Site internet : pages d'enfants
Publié le 13/04/2011 @ 08:51:00,
Par Monky
D'ailleurs, je pense à une chose qui n'est pas dans mes compétences :

Dans la sidebar, j'ai placé les accès principaux à la page :


Je me demandais s'il serait possible de faire "flotter" la sidebar. C'est à dire que la page défile mais que la sidebar reste toujours visible car fixe...
   
Site internet : pages d'enfants
Publié le 13/04/2011 @ 09:31:36,
Par max
en css
{
position: fixed;
}
Trololo
   
Site internet : pages d'enfants
Publié le 13/04/2011 @ 09:37:54,
Par Monky
en css
{
position: fixed;
}



D'abord, merci pour la réponse :wink:

Petit soucis : la sidebar ne se trouve plus au bon endroit du coup. Je laisse les paramètres comme ça pour que vous puissiez voir le résultat. Enfin, si vous en avez l'envie.

Voici le Css actuel de ma sidebar 2

  1. #sidebar2 { 
  2. width: 265px; 
  3. float:right
  4. position: fixed; 
  5. overflow: hidden; 
  6. margin:0 0 20px 0; 
  7. }

Dernière édition: 13/04/2011 @ 11:13:59
   
Site internet : pages d'enfants
Publié le 13/04/2011 @ 09:47:53,
Par zion
Un truc du genre:

#sidebar2 {
left: 50%;
margin: 0 0 20px 200px;
overflow: hidden;
position: fixed;
width: 265px;
}


:smile:
Je suis le Roy :ocube:
   
Site internet : pages d'enfants
Publié le 13/04/2011 @ 11:59:30,
Par Monky
Un truc du genre:

#sidebar2 {
left: 50%;
margin: 0 0 20px 200px;
overflow: hidden;
position: fixed;
width: 265px;
}


:smile:



Un énooOOOOOoooooOOOOrme merci !
   
Site internet : pages d'enfants
Publié le 13/04/2011 @ 12:04:00,
Par zion
Maintenant faudrait réduire le contenu, parce que ça dépasse largement l'écran et comme on peut pas le scroller :smile:

Ou alors tu fais:

#sidebar2 {
left: 50%;
margin: 0 0 20px 200px;
overflow: hidden;
position: fixed;
width: 265px;
overflow-y: scroll;
max-height: 600px;
}
Je suis le Roy :ocube:
   
Site internet : pages d'enfants
Publié le 13/04/2011 @ 12:07:16,
Par Monky
Je viens de le faire mais le résultat est étrange...
   
Site internet : pages d'enfants
Publié le 13/04/2011 @ 12:08:36,
Par zion
J'ai pas dit que ce serait beau, juste pratique :tinostar:
Je suis le Roy :ocube:
   
Site internet : pages d'enfants
Publié le 13/04/2011 @ 12:10:20,
Par Monky
J'ai remis la version précédente que tu m'as proposée car j'ai diminué le nombres d'items dans le menu. Mais... j'ai un soucis maintenant que je ne comprends pas. La page n'est plus centrée et se met complètement à droite. J'ai du faire une bourde quelque part. J'enquête...
   
Site internet : pages d'enfants
Publié le 13/04/2011 @ 12:15:50,
Par Monky
J'ai remis le Css initial et replacé ma sidebar2. Ça refonctionne... Je ne touche plus à rien :wink:

Un grand merci, Zion !
   
Site internet : pages d'enfants
Publié le 13/04/2011 @ 12:35:33,
Par zion
De rien :smile:
Je suis le Roy :ocube:
   
Site internet : pages d'enfants
Publié le 13/04/2011 @ 14:09:40,
Par Monky
J'ai une dernière question à soumettre.

Je voudrais créer une liste déroulante contenant des liens hypertextes. Dans mon fichier Sidebar2, j'ai donc insérer un code que j'ai déduit en visitant le web :

<FORM onchange="location.href=this.value">
<SELECT name="nom" size="1">
</FORM>
<OPTION value="http://www.enseignelibre.be/?page_id=2667">Amal</OPTION>
<OPTION value="http://www.enseignelibre.be/?page_id=2919">Arzu</OPTION>

</SELECT>
</FORM>


Mais cela ne fonctionne pas. J'ai du faire une bourde quelque part...

Voici l'intégralité du fichier :

<?php
/**
* @package WordPress
* @subpackage Tweaker2
*/
?>
<div id="sidebar2">
Bonjour ! Bienvenue sur ma page personnelle ! Je vous invite à parcourir mes créations à l'aide du menu ci-dessous.

<h4>Menu de navigation</h4>
<a href="#present">Je me présente</a><br/>
<a href="#textes">Mes textes</a><br/>
<a href="#multimedia">Mes documents multimédias</a><br/>
<a href="#photos">Quelques photos</a><br/>
<a href="#comments">Accéder aux commentaires</a><br/>
<a href="#respond">Écrire un commentaire</a><br/>
<a href="#haut">Retour en haut de la page</a><br/>

<h4>Les enfants de ma classe</h4>
<a href="http://www.enseignelibre.be/?page_id=2544">Cliquez ici</a> pour accéder aux autres enfants de ma classe.
<FORM>

<FORM onchange="location.href=this.value">
<SELECT name="nom" size="1">
</FORM>
<OPTION value="http://www.enseignelibre.be/?page_id=2667">Amal</OPTION>
<OPTION value="http://www.enseignelibre.be/?page_id=2919">Arzu</OPTION>

</SELECT>
</FORM>


</div>
</div>
   
Site internet : pages d'enfants
Publié le 13/04/2011 @ 14:28:38,
Par ebdalaoueb
Sauf erreur de ma part, tu souhaites que le choix d'un enfant dans ta liste provoque l'ouverture de "sa" page, ton onchange n'est donc pas placé au bon endroit. Il faut le placer sur l'élément dont tu souhaites suivre le changement.

Du coup tu peux virer les form qui ne servent à rien...

ça donne donc :
  1. <div id="sidebar2"
  2. Bonjour ! Bienvenue sur ma page personnelle ! Je vous invite Ã  parcourir mes créations Ã  l'aide du menu ci-dessous
  3. <h4>Menu de navigation</h4
  4. <a href="#present">Je me présente</a><br/> 
  5. <a href="#textes">Mes textes</a><br/> 
  6. <a href="#multimedia">Mes documents multimédias</a><br/> 
  7. <a href="#photos">Quelques photos</a><br/> 
  8. <a href="#comments">Accéder aux commentaires</a><br/> 
  9. <a href="#respond">Écrire un commentaire</a><br/> 
  10. <a href="#haut">Retour en haut de la page</a><br/> 
  11. <h4>Les enfants de ma classe</h4
  12. <a href="http://www.enseignelibre.be/?page_id=2544">Cliquez ici</apour accéder aux autres enfants de ma classe
  13. <SELECT name="nom" size="1" onchange="location.href=this.value"
  14. <OPTION value="http://www.enseignelibre.be/?page_id=2667">Amal</OPTION
  15. <OPTION value="http://www.enseignelibre.be/?page_id=2919">Arzu</OPTION
  16. </SELECT
  17. </div>

   
Site internet : pages d'enfants
Publié le 13/04/2011 @ 14:45:53,
Par Monky
Sauf erreur de ma part, tu souhaites que le choix d'un enfant dans ta liste provoque l'ouverture de "sa" page, ton onchange n'est donc pas placé au bon endroit. Il faut le placer sur l'élément dont tu souhaites suivre le changement.

Du coup tu peux virer les form qui ne servent à rien...



Merci beaucoup ebdalaoueb ! C'est nickel ! J'arrête maintenant de vous ennuyer... :shy:
Répondre - Catégorie:  
Informaticien.be - © 2002-2024 AkretioSPRL  - Generated via Kelare
The Akretio Network: Akretio - Freedelity - KelCommerce - Votre publicité sur informaticien.be ?