Divi Switch: a multifunctional plugin that wants you to feel good!

Updated on 06/06/2019 | Published on 10/05/2019 | 7 comments

Every time I create a new site with Divi, I often change the same things: remove the grey line under the menu, open the footer icons in a new tab etc... But why didn't I discover Divi Switch before?!

This multifunction plugin allows you to to correct and customize Divi without getting into trouble with the code and the creation of a child theme. It allows you to focus on the most important thing: content and design.

I have tested Divi Switch and I suggest you to discover all its features...

Divi Switch plugin

Advertisement: This article contains affiliate links that you will easily recognize. The classic links are in purple and sponsored links are in pink.

The list of possibilities offered by Divi Switch is long! Here's what you can do with this multifunction plugin....

  1. Modify the Divi Header (header and menu)
  2. Modify the Divi Footer
  3. Act on the main content
  4. Personalize the responsive
  5. Act on the comment section
  6. Customize archive pages
  7. Integrate layouts in specific locations
  8. Downloading SVG files
  9. Export a plugin
  10. Adding options in the customizer

Before going any further, note that Divi Switch is a premium plugin that you can purchase as an annual or lifetime license on the following websites Aspen Grove Studios or from Divi Space.

obtenir Divi - get Divi

1 – Edit the Divi Header

We have already seen, in a previous article, that you can do nice things with the configuration options of the Header of Divi (site header).

But some options remain unavailable in Divi.

And I'm not throwing stones at them, it's a good choice thatElegantThemes fact: not to offer hundreds of options and not to become a gas plant like Ocean WP for example.

But this implies that you will have to make some customizations to get the design you want....

Here's how Divi Switch will help you do it:

Divi Switch personnalise le Header
Divi Switch allows you to customize the "Header" part
  1. Go to the Divi tab > Theme option > Divi Switch > Header
  2. With one click, you can delete the grey line under the main menu.
  3. You can also make the phone number clickable: the one you display in the Top Menu (the menu above the main menu).
  4. If you display your social network icons in the Top Menu, you can open them in a new window (see also how to open the footer icons in a new window)
  5. If you want to center the elements of your Top Menu, you can do it in 1 click.
  6. If you want your logo to look different when the user scans your site (when it goes down below in a page), you can download a different logo here.
  7. You can add text next to the mobile menu icon (hamburger).
  8. You may even decide to display a different logo on each page of your site.
  9. And in addition, if your menu does not suit you, you can replace it with a layout saved in your library. A layout must first be created and saved in your library.
  10. Don't forget to save your changes.

2 - Modify Divi's footer

A personalized footer is often an essential element in the design of a site. We have already seen how to create a footer who reveals himself on the scroll or even manual addition of new icons.

Here's what you can do here:

modifier le footer de Divi
Modify the footer
  1. Go to the Divi tab > Theme option > Divi Switch > Footer
  2. With one click, you can delete the "bullets points", i.e. the smart list that can appear a few times in the footer's widgets.
  3. You can completely delete the bottom of the footer, the one where the credits appear or the icons of the social networks.
  4. An interesting option here: allow the footer to move completely to the bottom of the screen when the page content is too short.
  5. Finally, you can replace the widget area at the bottom of the page with a layout previously saved in your library.

3 - Act on the main content

This tab provides options for various Divi modules or contents.

Options pour personnaliser le Main Content
Options to customize Main Content
  1. Go to the Divi tab > Theme Option > Divi Switch > Main Content.
  2. Delete the grey line that separates the main content of the sidebar
  3. Add a preloader (preloader icon) that allows the user to wait.
  4. Add an animation to the preloader.
  5. Choose the color of the preloader.
  6. Choose the ratio of portfolio images (squares, rectangles etc.).
  7. Do not allow the images from the Divi gallery to open up in a lightbox.
  8. Change the animation of the slider description.
  9. Change the animation of the Slide module and the Video Slider module.
  10. Delete the custom post type "Project" custom post (Post Type Projects).
  11. Add a custom maintenance page: you can choose from your creations saved in your Divi library.
  12. Add a custom 404 error page: choose a layout in your library.

4 - Personalize the responsive

Go to the Divi tab > Theme option > Divi Switch > Mobile.

Options pour personnaliser le responsive de Divi
Options to customize Divi's response

Here you can simply change the responsive level. That is, if you find that the tablet (or mobile) version does not trigger fast enough or vice versa, you can easily change the width of the content in pixels. This is the "breakpoint" or "point of rupture".

You can specify a value for each screen type.

5 - Act on the comment section

Nothing very interesting here... Too bad!

options pour les commentaires
Options for comments
  1. Go to the Divi tab > Theme option > Divi Switch > Mobile
  2. You will be able to place the comments in a switchover.
  3. Record.

6 - Customize archive pages

Here, on the other hand, you can obtain a feature that is missing in the theme: the ability to customize archive pages.

Archive pages are dynamic pages that are automatically generated in WordPress. For example, these are category pages, label pages, author pages, etc.

These pages have a specific URL such as: mywebsite.com/category/the-name-of-your-category.

Divi Switch makes these archive pages sexier:

options pour les pages d'archive
Options to customize archive pages
  1. Go to the Divi tab > Theme option > Divi Switch > Archives
  2. You will be able to display the title of your category at the top of the page.
  3. You can delete the sidebar on the archive pages.
  4. Add the words "read more" below each element.
  5. Add a line to separate each element present on the archive.
  6. Backup

7 - Integrate layouts in specific locations

This is ideal if you need to display promotional items in strategic locations, which you can later change with a single click.

Possibilité d'insérer un layout
Possibility to insert a layout at the beginning or end of the post
  1. Go to the Divi tab > Theme option > Divi Switch > Integration
  2. You can add a pre-recorded layout above the main content.
  3. Similarly, to place content after the main content (before comments)
  4. The same goes for adding a layout before the content of your articles.

Note: these layouts will be added on all pages in the same way.

8 - Downloading SVG files

Divi Switch - Onglet Avancé
Divi Switch - Advanced Tab

The Divi tab > Theme option > Divi Switch > Advanced will allow you to allow SVG files to be downloaded to your media library.

9 - Export the parameters as a plugin

That's a brilliant idea! The Import/Export tab allows you to create a plugin on the fly. This will contain all the options you have set up with the Divi Switch plugin.

This means that you could create a "basic" plugin that adds many pre-registered customizations and that you can install it on all your sites. Without having to install Divi Switch and set it up again.

In addition, if you install this plugin on your customers' sites, they will not be able to modify the Divi Switch options since they have been embedded in the extension itself.

Divi Switch - Onglet Import Export
Divi Switch - Import Export tab
  1. Go to the Divi tab > Theme option > Divi Switch > Import-Export
  2. You can use the import function which will save you time in configuration. This means that you already have a plugin created from Divi Switch and it is also installed.
  3. Otherwise, you can export your own settings by entering the name of your plugin.
  4. The description of the plugin.
  5. The author of the plugin.
  6. The URL of the author's site.
  7. The version of the plugin.
  8. Then, you can click on Export Plugin to download it locally and install it on another site.

10 - Add options in the customizer

In addition to all the options listed above, you will find additional options in the customizer (in the Appearance tab > Customize):

Options supplémentaires dans le customizer
Additional options in the customizer
  1. You will be able to change the Mobile Menu icon (the famous Hamburger).
  2. Add a background image to your header.
  3. Customize the "back up" button.
  4. Change the colors and design elements of your archive pages.

Need more resources on Divi? Visit ElegantThemes' blog full of ideas and tutorials!

In conclusion....

Divi Switch is a plugin that can be used at various levels of customization. Many of them can be done "by hand" if you know a little bit about CSS and PHP. Others, are a little more complex... However, if putting your hands in the code doesn't make you vibrate, this premium plugin is really a must-have for Divi users. It also represents a significant time saving!

Customiser Divi avec Divi Switch
Divi Switch - plugin pour Divi
plus d'astuces pour Divi
Divi Switch to customize Divi Theme

You should like it too:

Popups for Divi : un plugin gratuit très malin !

Popups for Divi: a very clever free plugin!

Free plugins for Divi are quite rare, but "Popups for Divi" is very effective and easy to use. This plugin converts any Divi section into a pop-up window. I'll explain how to use it.

7 Commentaires

  1. valeriemersiervalerie

    Merci pour ce condensé d’infos sur Divi Switch.
    Est-ce que dans le temps avec les multiples MAJ Divi, le plug ne sera pas, très vite, obsolète ? C’est une question sûrement bête, mais celui-ci regroupe tellement de fonctions différentes que je me dis que s’il bug, le site entier bug.
    Quel est votre avis sur la question ?
    Merci de votre retour,

  2. Lycia Diaz

    Hello Valerie ! C’est une bonne question ! Je pense que ce plugin est maintenu par une équipe sérieuse. Et comme c’est un plugin premium, c’est dans leur intérêt de le maintenir correctement. Si c’était un plugin gratuit, j’aurais un peu plus de doute… Mais tu peux peut-être leur poser la question…

  3. valeriemersiervalerie

    Merci Lycia… je vais les interroger à ce sujet.

  4. Pascal

    Bonjour Lycia et merci pour votre site.

    Lors de l’installation de ce plugin ma page par Accueil ( la seule pour l’instant) à complètement bugger.

    Le logo est énorme, le menu prend la moitié de la page, le bouton de recherche ce retrouve en dessous du header et impossible de modifier le header. En désactivant le plugin tous reviens correctement. Avez vous une réponse à cela ?

  5. Lycia Diaz

    Salut Pascal.
    J’ai pas trop de réponse à te donner… J’ai testé ce plugin avant la version 4.0.x de Divi, est-ce que cela pourrait venir de là ? Sinon, je pense plutôt à un paramétrage. As-tu paramétré le plugin lui-même ? Cela pourrait rentrer dans l’ordre, je suppose…

  6. Pascal


    J’ai trouvé la solution. Cela venait du plugin ithemes security. Pour cela il faut decocher la protection php des plugins.

    Bonne soirée

  7. Lycia Diaz

    Ah super Pascal pour le tuyau !
    Bonne soirée.

Soumettre un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

Pin It on Pinterest

Share This