fbpx

Tutoriel Divi Supreme : Module Content Toggle

Divi  Supreme Content Toggle, une fonction bien utile qui manque peut-être à votre site :)

Changer de contenu en activant simplement un interrupteur sur votre site Divi ? C’est possible grâce au module Content Toggle de Divi Supreme Pro l’excellent plugin pour Divi. Cette fonction peut être très utile dans bon nombre de cas. C’est ce que je vous présente et vous explique dans ce nouveau tutoriel WordPress Divi Supreme.
Si vous ne connaissez pas Divi Supreme, je vous invite à consulter cette page de mon blog où je passe en revue tous les nouveaux modules et nouvelles extensions qu’apporte ce plugin Divi.

 

Code Promo Divi Supreme
Licence Divi
.

Insertion du module Divi Supreme Content Toggle

    Dans le tutoriel, je crée une nouvelle section, j’insère une rangée à une colonne et dans cette colonne, j’appelle le module Content Toggle. Ce module se comporte comme tout autre module Divi à insérer dans une colonne de rangée.

    Vous remarquez au passage que les modules rajoutés par Divi Supreme ont un fond bleu ce qui les distingue des modules classiques de Divi.

    Amelia booking plugin
    Thinkific one month free
    Module Divi Supreme Content Toggle

    Paramétrage du Contenu du module Content Toggle

      Le principe est simple dans l’onglet contenu, vous avez « Content One  » (Contenu 1) et « Content two » (Contenu 2).

      Ce sont les contenus qui vont apparaitre selon que vous activez ou pas l’interrupteur.

      Chaque contenu peut être appelé soit :
      D’un contenu personnalisé (Custom Content) ce sera du texte entré dans l’encart texte classique.
      D’un contenu enregistré dans la librairie, ce sera ici le contenu complet d’une section. Section qui pourra contenir plusieurs rangées et modules.
      C’est donc très puissant et toute mise en page est possible. (c’est ce contenu que j’utilise dans la vidéo, en créant 2 sections que j’enregistre respectivement dans la librairie pour ensuite les appeler dans « Content 1 » puis « Content2 »).
      D’un contenu appelé par un Shortcode. Il vous est possible aussi de faire apparaître le contenu d’un autre plugin générant des Shortcodes.

      Switcher
      Code Promo Divi Supreme
      Insertion Module Masonry Gallery
      Licence Divi

      Paramétrage du Style du module Content Toggle

        Dans l’onglet « Style » vous allez pouvoir paramétrer principalement 5 choses intéressantes :
        L’interrupteur (Switcher), vous allez pouvoir modifier sa taille et sa couleur de fond selon sa position.

        – Heading one et Heading two (Titre 1 et Titre 2), sont les titres qui apparaissent de part et d’autre de l’interrupteur. Vous pouvez modifier ici, la taille du texte, sa couleur etc.

        – Content one et Content 2 (Contenu 1 et Contenu 2), à cet endroit c’est le design même du contenu que vous pouvez modifier. Vous pouvez par exemple jouer sur les marges, modifier la couleur de fond etc.

        Pour voir le résultat de votre travail, enregistrez votre travail et sortez du Visual Builder.

         

        section1
        Section 2
        Style
        hébergeur web Hostinger
        MalerLite

        Vous serez peut-être également intéressé par ces articles …

        Tutoriel Divi : Inverser les colonnes selon la vue

        Tutoriel Divi : Inverser les colonnes selon la vue

        En vue ordinateur un site web peut avoir un design avantageux mais peut être moins en vue mobile du fait des colonnes d’une rangée qui passent les unes sous les autres.
        On peut alors se trouver avec une suite d’éléments non souhaitée avec par exemple 2 textes ou 2 images à la suite.

        lire plus
        10 extensions Chrome pour améliorer la productivité

        10 extensions Chrome pour améliorer la productivité

        Dans cette vidéo, je vous présente 10 extensions pour le navigateur Chrome afin d’améliorer votre confort, votre rapidité et donc votre productivité lorsque vous surfez sur Internet. Il existe ne nombreuses extensions Chrome, et il peut être difficile de trouver celles qui vont réellement améliorer votre productivité.

        lire plus
        Un menu hamburger 🍔 en vue ordinateur : site WordPress Divi

        Un menu hamburger 🍔 en vue ordinateur : site WordPress Divi

        Sur Internet, le terme de “hamburger menu” désigne un menu de navigation utilisé sur les sites mobiles par souci  de gain de place et d’ergonomie, la largeur de l’écran étant restreinte pour conserver un menu classique. Sur ces périphériques mobiles, on masque alors le menu derrière un bouton à 3 petits traits ressemblant à un hamburger.

        lire plus
        Offrez-moi un café! Merci :)