Annonce

  •  » Styles
  •  » Menu avec Bootstrap (darkroom sans doute)

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

Katryne
Membre
Le Revest-les-Eaux (Provence)
2016-12-03
1633

Menu avec Bootstrap (darkroom sans doute)

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 !


https://album.chauvigne.info/ v.13.8.0  PHP: 8.1.22
http://photos.katrynou.fr/ v.14.1.0 PHP: 8.1.22
Système d'exploitation: Linux - Hébergeur 1&1-Ionos - MySQL: 5.7.38
Bibliothèque graphique: External ImageMagick 6.9.10-23

Hors ligne

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

polowigo
Membre
2019-04-11
143

Re: Menu avec Bootstrap (darkroom sans doute)

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.

Hors ligne

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

Katryne
Membre
Le Revest-les-Eaux (Provence)
2016-12-03
1633

Re: Menu avec Bootstrap (darkroom sans doute)

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.


https://album.chauvigne.info/ v.13.8.0  PHP: 8.1.22
http://photos.katrynou.fr/ v.14.1.0 PHP: 8.1.22
Système d'exploitation: Linux - Hébergeur 1&1-Ionos - MySQL: 5.7.38
Bibliothèque graphique: External ImageMagick 6.9.10-23

Hors ligne

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

Guillaume C
Membre
Belgium
2014-04-08
335

Re: Menu avec Bootstrap (darkroom sans doute)

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)

Hors ligne

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

polowigo
Membre
2019-04-11
143

Re: Menu avec Bootstrap (darkroom sans doute)

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é).

Hors ligne

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

Katryne
Membre
Le Revest-les-Eaux (Provence)
2016-12-03
1633

Re: Menu avec Bootstrap (darkroom sans doute)

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.


https://album.chauvigne.info/ v.13.8.0  PHP: 8.1.22
http://photos.katrynou.fr/ v.14.1.0 PHP: 8.1.22
Système d'exploitation: Linux - Hébergeur 1&1-Ionos - MySQL: 5.7.38
Bibliothèque graphique: External ImageMagick 6.9.10-23

Hors ligne

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

polowigo
Membre
2019-04-11
143

Re: Menu avec Bootstrap (darkroom sans doute)

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

Hors ligne

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

Katryne
Membre
Le Revest-les-Eaux (Provence)
2016-12-03
1633

Re: Menu avec Bootstrap (darkroom sans doute)

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)


https://album.chauvigne.info/ v.13.8.0  PHP: 8.1.22
http://photos.katrynou.fr/ v.14.1.0 PHP: 8.1.22
Système d'exploitation: Linux - Hébergeur 1&1-Ionos - MySQL: 5.7.38
Bibliothèque graphique: External ImageMagick 6.9.10-23

Hors ligne

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

polowigo
Membre
2019-04-11
143

Re: Menu avec Bootstrap (darkroom sans doute)

Katryne a écrit:

Ou alors rendre Clear responsive.

Et tu souhaites quel comportement pour son volet gauche ?

Hors ligne

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

Katryne
Membre
Le Revest-les-Eaux (Provence)
2016-12-03
1633

Re: Menu avec Bootstrap (darkroom sans doute)

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.


https://album.chauvigne.info/ v.13.8.0  PHP: 8.1.22
http://photos.katrynou.fr/ v.14.1.0 PHP: 8.1.22
Système d'exploitation: Linux - Hébergeur 1&1-Ionos - MySQL: 5.7.38
Bibliothèque graphique: External ImageMagick 6.9.10-23

Hors ligne

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

polowigo
Membre
2019-04-11
143

Re: Menu avec Bootstrap (darkroom sans doute)

À 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.

Hors ligne

  •  » Styles
  •  » Menu avec Bootstrap (darkroom sans doute)

Pied de page des forums

Propulsé par FluxBB

github twitter newsletter Faire un don Piwigo.org © 2002-2024 · Contact