Navbar bootstrap

Réduire
X
 
  • Filtrer
  • Heure
  • Afficher
Tout effacer
nouveaux messages

  • Navbar bootstrap

    Bonjour à tous,

    Est-il possible d'intégrer les navbars proposés sur le site officiel et
    "collapse plugin" est-il intégré dans joomla 3.0 ?
    http://twitter.github.com/bootstrap/...ts.html#navbar

    Merci

  • #2
    Re : Navbar bootstrap

    bonjour,

    Je tourne en rond et je ne comprend pas grand chose à l'utilisation du Navbar responsive de bootstrap.
    je travaille sur le Blank Template (partir de zéro rien de tel...) et j'applique "bêtement" ce que je peut lire :

    Code PHP:
    <div class="navbar">
        <
    div class="navbar-inner">
          <
    div class="container">
           
            <
    class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
              <
    span class="icon-bar"></span>
              <
    span class="icon-bar"></span>
              <
    span class="icon-bar"></span>
            </
    a>
             
            <
    class="brand" href="#">mon logo</a>
             
            <
    div class="nav-collapse">
            <
    jdoc:include type="modules" name="position-1" style="none" />
            </
    div>
           
          </
    div>
        </
    div>
      </
    div
    Pour les menus déroulants suivant ce lien je dois insérer un suffixe CSS de menu (ex:nav-dropdown) car apparemment tout se joue avec les suffixes.

    Mais ça ne fonctionne pas, pourquoi ?
    Merci

    Commentaire


    • #3
      Re : Navbar bootstrap

      Salut,
      la page que tu indiques précise qu'il faut récupérer l'override (la surcharge) de mod_menu du template "strapped" (dont il est question, ce n'est pas un tuto sur bootstrap et joomla, mais un tuto sur le template "strapped"+joomla+bootstrap).
      Bootstrap has several different types of navigation options for you to choose from. To incorporate these a mod_menu override was created to give you several different navigation options.
      Si tu veux "bootstrapper" ton template, il vaudrait mieux comprendre la logique du bidule et télécharger :
      The most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first projects on the web. - twbs/bootstrap

      et regarder dans le dossier docs les différentes possibilités
      Un message d’erreur sur votre site Joomla ... ayez le reflexe de consulter lla base de connaissance : https://kb.joomla.fr

      Ce forum, vous l'aimez ? il vous a sauvé la vie ? Vous y apprenez chaque jour ? Alors adhérez à l'AFUJ https://www.joomla.fr/association/adherer

      Commentaire


      • #4
        Re : Navbar bootstrap

        salut
        si tu regardes dans les données d'exemple le menu haut a la classe " nav-pills" dans paramètres avancés du module de menu >> Suffixe CSS de menu

        si ton template charge bootstrap tu obtiens le menu comme celui de la doc
        suffit de tester avec le template protostar nativement livré avec joomla 3, et le dropdown fonctionne, sauf que pour 1 niveau de sous menu
        Vive Joomla! http://www.joomlack.fr Tutoriels et extensions pour Joomla!. Livre création de template Joomla de plus de 200 pages.
        http://www.template-creator.com Outil de création de templates
        Module Maximenu CK - Megamenu, multicolonnes, chargement de module, description de lien, deroulement animé - Compatible Virtuemart, Hikashop

        Commentaire


        • #5
          Re : Navbar bootstrap

          Non laissez tomber, j'ai l'impression que bootstrap+Joomla limite énormément la personnalisation d'un site web.
          Tous les Templates bootstrap+Joomla que j'ai peu voir se ressemblent. (c'est une horreur)

          bootstrap+Joomla c'est encore trop récent, peu d'information, peu de tutoriel, peu de d’intérêt et peu de conviction.

          Gantry-framework est peut être les seuls à avoir compris les demandes enfin je pense !

          P.S : Et puis vue le nombre de site qui vante le responsive et qui ne l'utilise pas pour eux même, me fait assez rire !

          Commentaire


          • #6
            Re : Navbar bootstrap

            remarque très intéressante, mais tu sais que tu peux ajouter tes propres css pour donner le style que tu veux à ton template.
            si personne ne personnalise c'est normal que tout se ressemble

            Et puis vue le nombre de site qui vante le responsive et qui ne l'utilise pas pour eux même, me fait assez rire !
            on veut des noms ! (non j'déconne ! )

            bootstrap+Joomla c'est encore trop récent, peu d'information, peu de tutoriel, peu de d’intérêt et peu de conviction.
            je suis en train d'écrire mon livre sur les templates joomla 3 et je parle de bootstrap avec un tutoriel qui explique comment l'utiliser et comment compiler les fichiers Less pour faire ses propres css à partir des variables bootstrap. Maintenant si tu as des demandes particulières par rapport à l'utilisation de bootstrap, ça peut etre intéressant d'avoir ton avis sur ce que tu cherches comme documentation
            Vive Joomla! http://www.joomlack.fr Tutoriels et extensions pour Joomla!. Livre création de template Joomla de plus de 200 pages.
            http://www.template-creator.com Outil de création de templates
            Module Maximenu CK - Megamenu, multicolonnes, chargement de module, description de lien, deroulement animé - Compatible Virtuemart, Hikashop

            Commentaire


            • #7
              Re : Navbar bootstrap

              La remarque d'Olima sur le nombre de sites qui vantent le responsive et qui ne l'utilisent pas pour eux mêmes est tout à fait juste.
              J'avais fait, il y a qq mois, une mini recherche perso sur le taux d'adoption du responsive sur les sites francophones (pas forcément Joomla) et c'était un peu la cata. Mais les choses changent.

              Re : les templates des devs connus et leur esthétique, j'apprécie beaucoup celui de gavick et celui de joomlashine - si on enlève les décos de Noel, bien sur - qui sortent de la sempiternelle présentation un bandeau/3 cols en dessous.

              De plus, je trouve que le gros pb de protostar est que tous les styles bootstrap + ceux propres à joomla sont dans le même fichier template.css, ce qui complique un peu la compréhension de bootstrap et de l'utilisation de LESS (Crunch, Crunch, lol).
              Un message d’erreur sur votre site Joomla ... ayez le reflexe de consulter lla base de connaissance : https://kb.joomla.fr

              Ce forum, vous l'aimez ? il vous a sauvé la vie ? Vous y apprenez chaque jour ? Alors adhérez à l'AFUJ https://www.joomla.fr/association/adherer

              Commentaire


              • #8
                Re : Navbar bootstrap

                tous les styles bootstrap + ceux propres à joomla sont dans le même fichier template.css, ce qui complique un peu la compréhension de bootstrap et de l'utilisation de LESS (Crunch, Crunch, lol).
                mon cher Ghazal tu as bien raison
                j'ai moi meme cherché un bout de temps avant de comprendre toute la mécanique et arriver à gérer mes propres CSS Bootstrap, pas forcément évident !
                Vive Joomla! http://www.joomlack.fr Tutoriels et extensions pour Joomla!. Livre création de template Joomla de plus de 200 pages.
                http://www.template-creator.com Outil de création de templates
                Module Maximenu CK - Megamenu, multicolonnes, chargement de module, description de lien, deroulement animé - Compatible Virtuemart, Hikashop

                Commentaire


                • #9
                  Re : Navbar bootstrap

                  Mon expérience perso de Bootstrap avec joomla 2.5 et joomla 3.0 :

                  Comprendre la logique de Bootstrap
                  - en travaillant avec les exemples

                  Comprendre la logique de l'intégration de Bootstrap dans Joomla
                  - protostar
                  - ou faire son template basique avec le recours à la surcharge (override) des fichiers de certaines extensions (comps ou modules)
                  - les suffixes CSS de modules (comme dans l'exemple du template strapped cité plus haut)

                  Comprendre la logique de LESS pour l'adaptation et l'adéquation des CSS Bootstrap/ou autres à mon design Joomla
                  - http://lesscss.org/

                  - les compilateurs
                  1 - les apps
                  * Crunch
                  * simpLESS

                  2 - compilateurs en ligne
                  PHP -->http://leafo.net/lessphp/
                  Autres
                  http://less2css.org/ --> Click "Try it now"


                  PS : une propal de formattage de jsfiddle pour pouvoir montrer des exemples de bootstrap + responsive
                  Démo : http://jsfiddle.net/ghazal/cdvuq/show/
                  Code : http://jsfiddle.net/ghazal/cdvuq

                  PPS : encore merci à Lomart pour :
                  - l'astuce FF pour voir en responsive (Windows->control+shift+m ou Mac->cmd+shift+m)
                  - son insistance sur le fait que comprendre LESS était indispensable
                  Un message d’erreur sur votre site Joomla ... ayez le reflexe de consulter lla base de connaissance : https://kb.joomla.fr

                  Ce forum, vous l'aimez ? il vous a sauvé la vie ? Vous y apprenez chaque jour ? Alors adhérez à l'AFUJ https://www.joomla.fr/association/adherer

                  Commentaire


                  • #10
                    Re : Navbar bootstrap

                    Je vois que mon désespoir ne laisse pas indifférent.

                    Entre temps j’ai "réussi" à placer mon navbar en récupérant la surcharge du template "strapped".

                    Mais J’essaie de reproduire le menu de l’administration de joomla (avec la fameuse class "dropdown")
                    L’intégration n’est vraiment pas simple, une idée ?

                    @ghazal, merci pour les liens intéressants et surtout pour l'astuce !
                    Dernière édition par olima à 12/01/2013, 17h08

                    Commentaire


                    • #11
                      Re : Navbar bootstrap

                      son insistance sur le fait que comprendre LESS était indispensable
                      ghazal, tu penses que j'ai été trop lourd

                      Mais J’essaie de reproduire le menu de l’administration de joomla (avec la fameuse class "dropdown")
                      L’intégration n’est vraiment pas simple, une idée ?
                      Je n'ai pas trouvé d'autre solution que de réécrire un module dérivé de mod_menu
                      J'essaie de faire en sorte qu'il puisse traiter tous les cas de menu, sous-sous-menu et afflix compris
                      Je mettrais cette version à dispo dès que j'ai terminé..ce qui ne devrait pas trop tarder
                      UP, le plugin universel à découvrir sur https//up.lomart.fr
                      bgMax
                      , AdminOrder, MetaData, Zoom, ArtPlug, Custom, Memo, Filter, ... sur http://lomart.fr/extensions

                      Commentaire


                      • #12
                        Re : Navbar bootstrap

                        @lomart
                        Pas du tout, t'avais raison.

                        Au fait, j'ai réglé le pb de menu sur jsbootstrap :
                        [un espace] nav-pills nav-dropdown // sur suffixe CSS de menu
                        pas de suffixe de class CSS
                        Afficher tous les liens : oui

                        @olima, tu peux essayer cette solution
                        Un message d’erreur sur votre site Joomla ... ayez le reflexe de consulter lla base de connaissance : https://kb.joomla.fr

                        Ce forum, vous l'aimez ? il vous a sauvé la vie ? Vous y apprenez chaque jour ? Alors adhérez à l'AFUJ https://www.joomla.fr/association/adherer

                        Commentaire


                        • #13
                          Re : Navbar bootstrap

                          -suffixe "nav-dropdown" indispensable.
                          -Afficher tous les liens : oui

                          Ça fonctionne de cette manière (sans hover) mais comment configure t-on le "Type de lien de menu" dans ce cas?

                          Commentaire


                          • #14
                            Re : Navbar bootstrap

                            Type de mise en page ?
                            Si ca fonctionne, reste avec defaut dans un premier temps.
                            Dans le template "strapped", le dev propose plusieurs surcharges, il faut les associer :
                            default.php avec default_url.php, etc ...
                            default.bak.php avec default_url.bak.php, etc ...
                            et etc... lol
                            Il faut donc un peu tatonner. J'ai testé, ce n'est pas forcément concluant.
                            Mais tu peux toujours essayer.
                            Un message d’erreur sur votre site Joomla ... ayez le reflexe de consulter lla base de connaissance : https://kb.joomla.fr

                            Ce forum, vous l'aimez ? il vous a sauvé la vie ? Vous y apprenez chaque jour ? Alors adhérez à l'AFUJ https://www.joomla.fr/association/adherer

                            Commentaire


                            • #15
                              Re : Navbar bootstrap

                              Peu concluant c'est le mot

                              D’ailleurs cela me mène a me poser une petite question sur l’intérêt de l'utilisation du «hover» sur smartphones et tablettes.

                              L'événement est-il capté sur tous les supports ?

                              Commentaire

                              Annonce

                              Réduire
                              Aucune annonce pour le moment.

                              Partenaire de l'association

                              Réduire

                              Hébergeur Web PlanetHoster
                              Travaille ...
                              X