Piwigo.org

Katryne · 2019-04-16 22:19:04

Bonjour

Un menu en colonne latérale avec un thème Bootstrap, est-ce que c'est une hérésie ou de l'acrobatie ? Si c'est possible, comment faire ?
Merci !

polowigo · 2019-04-17 11:02:47

Bonjour,

Peut-être une piste d'après le thème Bootstrap Darkroom : lorsque l'on configure la position des informations de l'image en "Sidebar", celles-ci sont présentées dans une colonne, visible ou non, sur le côté droit.
Peut-être pouvez-vous récupérer ce bout de code, le modifier de façon à laisser la colonne visible et y placer les éléments de menu ?

Bon courage.

Katryne · 2019-04-17 19:59:58

Merci de ta suggestion. J'ai d'abord regardé ce que çla side-bar donnait pour les infos de l'image, mais je n'aime pas beaucoup, pas vraiment utilisable pour l'usage que j'en ai.

Je cherchais une vraie disposition en 2 colonnes, mais il semble que pour produire du responsive, bootstrap doit présenter toutes les infos en une suite verticale. Les accès internes et les liens externes ne pouvant découler que d'un menu déroulant.

Je vais chercher encore.

Guillaume C · 2019-04-17 20:07:43

C'est faisable en éditant le bon tpl (pas vérifié lequel) et en définissant les conditions d'affichage pour le responsive avec @media en css dans LocalFiles Editor.

Dernière modification par Guillaume C (2019-04-17 20:08:42)

polowigo · 2019-04-18 10:02:32

Katryne a écrit:
Je cherchais une vraie disposition en 2 colonnes,

Dans index.tpl, tu peux essayer de placer le nav dans un div de style col-lg-1 ou col-lg-2, et le reste dans un div de style col-lg-auto (je n'ai pas testé).

Katryne · 2019-04-18 12:58:52

polowigo a écrit:
Dans index.tpl, tu peux essayer de placer le nav dans un div de style col-lg-1 ou col-lg-2, et le reste dans un div de style col-lg-auto (je n'ai pas testé).

Merci, bel essai, mais oui, mais non.
col-lg-1 et col-lg-2 spécivient des largeurs à 100% : leur contenu s'empilera et ne se mettra pas côte à côte.
J'ai essayé de mettre nav dans une div affectée de la class col-3 qui prend 25 % de largeur, mais ça ne met dans cette div de 25 % que le fil d'ariane. Et le reste du contenu vient dessous à 100% de largeur. Les vrais menus de navigation sont dans le header et ce sont des menus déroulants (scroll-down) qui ne seront pas pertinents dans une colonne.

polowigo · 2019-04-18 15:00:50

En fait, tu veux le menu principal du thème Elegant, non ?

Katryne · 2019-04-18 15:08:17

En fait, je souhaiterais, il me plairait bien, enfin si c'était possible ... d'avoir un site responsive en 2 colonnes. La colonne de gauche étant plus étroite, avec les menus et peut-être 1 ou 2 widgets. Comme j'ai avec le thème Clear là : https://photos.revestou.fr/ Mais qui n'est pas responsive. Ou alors rendre Clear responsive.
Avant, je ne me posais pas de problème, j'avais Clear sur ordi et Smart-pocket sur mobiles et tablettes. Mais Smart-pocket n'est plus compatible avec Android 9.
Je ne connais pas le thème Elegant

Dernière modification par Katryne (2019-04-18 15:10:49)

polowigo · 2019-04-18 15:14:42

Katryne a écrit:
Ou alors rendre Clear responsive.

Et tu souhaites quel comportement pour son volet gauche ?

Katryne · 2019-04-18 15:22:22

Qu'il soit fixe au dessus de ... disons par ex 1000px de largeur d'écran et qu'il disparaisse grâce aux media queries pour que les menus s'y transforment en menus déroulant sur les petits écrans.

polowigo · 2019-04-18 16:06:24

À la louche, tu peux essayer, en forkant clear, de rajouter dans son theme.css quelque chose comme

Code:

@media (max-width: 991.98px) {
  #menubar {
    display: none;
  }
  #menubouton{
    display: inline-block;
  }
  .contentWithMenu {
    margin-left: 0;
  }
}

@media (min-width: 992px) {
  #menubar {
    display: block;
  }
  #menubouton{
    display: none;
  }
}

en ayant créé un bouton "menubouton" de classe navbar-toggler comme dans bootstrap darkroom, et ayant pour cible #menubar.

À mon avis, ce n'est pas suffisant mais peut-être un début de piste.

Piwigo.org

Annonce

#1 2019-04-16 22:19:04

Menu avec Bootstrap (darkroom sans doute)

#2 2019-04-17 11:02:47

Re: Menu avec Bootstrap (darkroom sans doute)

#3 2019-04-17 19:59:58

Re: Menu avec Bootstrap (darkroom sans doute)

#4 2019-04-17 20:07:43

Re: Menu avec Bootstrap (darkroom sans doute)

#5 2019-04-18 10:02:32

Re: Menu avec Bootstrap (darkroom sans doute)

Katryne a écrit:

#6 2019-04-18 12:58:52

Re: Menu avec Bootstrap (darkroom sans doute)

polowigo a écrit:

#7 2019-04-18 15:00:50

Re: Menu avec Bootstrap (darkroom sans doute)

#8 2019-04-18 15:08:17

Re: Menu avec Bootstrap (darkroom sans doute)

#9 2019-04-18 15:14:42

Re: Menu avec Bootstrap (darkroom sans doute)

Katryne a écrit:

#10 2019-04-18 15:22:22

Re: Menu avec Bootstrap (darkroom sans doute)

#11 2019-04-18 16:06:24

Re: Menu avec Bootstrap (darkroom sans doute)

Code:

Pied de page des forums