Bootstrap dans Joomla! ?

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

  • Bootstrap dans Joomla! ?

    Bonjour,

    Je suis dans la découverte de Joomla! 4 et du template Cassiopeia. De ce que j'ai pu lire, la promesse d'avoir du Bootstrap dans Joomla! était un des gros arguments pour persuader les utilisateurs à franchir le pas. Du coup, je suis allé voir sur le site officiel de Bootstrap de quoi il en retourne au juste.
    Et, naturellement me semble-t-il, j'ai tenté d'expérimenter sur Joomla! ce que propose Bootstrap. Je n'ai pas mis longtemps pour m'apercevoir que tout Bootstrap ne fonctionne pas en natif sur Joomla!.
    Du coup, je me dis qu'il doit y avoir une raison qui m'échappe dans le fait de ne pas implémenter toutes les possibilités de Bootstrap dans Joomla! et je me demande comment ajouter, par exemple, les fonctions de popover comme il est expliqué sur le site de Bootstrap. Apparemment, il y aurait un appel à faire dans le template mais ça, je ne comprends pas bien comment on peut le faire aisément.
    Il y aurait une piste ?

    Merci par avance.

  • #2
    Effectivement, jusqu'à la version 4 Boostrap était monolithique : on était condamné à charger TOUT le fichier même si on n'utilisait rien, ou juste le carousel p ex.
    Outre le fait que c'était en jQuery si je ne me trompe.

    Avec la version 5, Boostrap
    - est passé en vanilla javascript
    - et permet de ne charger que ce dont on a besoin

    Vu que la performance est reine (cfr Core Web Vitals, ...) c'est top.


    Bref, on peut facilement activer exactement ce qu'on veut du javascript BS5 via les overrides (de template, d'article, de blog, de ce qu'on veut selon le besoin. Moi j'aime l'idée de le faire via un override de Module "custom HTML", pcq du coup on peut l'assigner à une langue et/ou à une série d'élément de menus)

    Dans mon dernier article paru dans le Joomla Community Magazine, je donne un exemple concret de comment injecter le javascript pour un carousel.
    Voir https://magazine.joomla.org/all-issu...-rule-them-all

    Concrètement, c'est juste une ligne :
    Code HTML:
    <?php \Joomla\CMS\HTML\HTMLHelper::_('bootstrap.carousel ', '#' . $carouselContainerId, ['interval' => 3000, 'pause' => 'false']); ?>
    Pour toutes les explications (et les exemples pour les Tabs etc) :
    Présentations : slides.woluweb.be | Coordonnées complètes : www.woluweb.be

    Un message d’erreur sur votre site Joomla... ayez le reflexe de consulter la base de connaissance : https://kb.joomla.fr

    Ce forum, vous l'aimez ? Il vous a sauvé la vie ? Vous y apprenez régulièrement ? Alors adhérer à l'AFUJ, l'Association Francophone des Utilisateurs de Joomla : https://www.joomla.fr/association/adherer

    Commentaire


    • #3
      Bonjour,

      Je te remercie pour ces explications qui m'ont permis de commencer à comprendre un peu le principe. J'avoue que je ne comprends pas tout mais, toutefois, d'une manière empirique, je suis arrivé à faire fonctionner des choses comme "modal" ou "accordion". J'ai encore beaucoup à découvrir et à tenter de comprendre.
      J'ai utilisé l'idée du "custom html" téléchargé sur la page d'explication. Ça semble avoir fonctionné même si je ne suis pas certain de réussir le tour de force qui consisterait à reproduire l'événement.
      Merci beaucoup !
      woluweb aime ceci.

      Commentaire

      Annonce

      Réduire
      Aucune annonce pour le moment.

      Partenaire de l'association

      Réduire

      Hébergeur Web PlanetHoster
      Travaille ...
      X