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...
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....
- Modify the Divi Header (header and menu)
- Modify the Divi Footer
- Act on the main content
- Personalize the responsive
- Act on the comment section
- Customize archive pages
- Integrate layouts in specific locations
- Downloading SVG files
- Export a plugin
- Adding options in the customizer
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.
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:
- Go to the Divi tab > Theme option > Divi Switch > Header
- With one click, you can delete the grey line under the main menu.
- You can also make the phone number clickable: the one you display in the Top Menu (the menu above the main menu).
- 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)
- If you want to center the elements of your Top Menu, you can do it in 1 click.
- 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.
- You can add text next to the mobile menu icon (hamburger).
- You may even decide to display a different logo on each page of your site.
- 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.
- Don't forget to save your changes.
2 - Modify Divi's footer
Here's what you can do here:
- Go to the Divi tab > Theme option > Divi Switch > Footer
- 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.
- You can completely delete the bottom of the footer, the one where the credits appear or the icons of the social networks.
- An interesting option here: allow the footer to move completely to the bottom of the screen when the page content is too short.
- 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.
- Go to the Divi tab > Theme Option > Divi Switch > Main Content.
- Delete the grey line that separates the main content of the sidebar
- Add a preloader (preloader icon) that allows the user to wait.
- Add an animation to the preloader.
- Choose the color of the preloader.
- Choose the ratio of portfolio images (squares, rectangles etc.).
- Do not allow the images from the Divi gallery to open up in a lightbox.
- Change the animation of the slider description.
- Change the animation of the Slide module and the Video Slider module.
- Delete the custom post type "Project" custom post (Post Type Projects).
- Add a custom maintenance page: you can choose from your creations saved in your Divi library.
- 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.
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!
- Go to the Divi tab > Theme option > Divi Switch > Mobile
- You will be able to place the comments in a switchover.
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:
- Go to the Divi tab > Theme option > Divi Switch > Archives
- You will be able to display the title of your category at the top of the page.
- You can delete the sidebar on the archive pages.
- Add the words "read more" below each element.
- Add a line to separate each element present on the archive.
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.
- Go to the Divi tab > Theme option > Divi Switch > Integration
- You can add a pre-recorded layout above the main content.
- Similarly, to place content after the main content (before comments)
- 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
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.
- Go to the Divi tab > Theme option > Divi Switch > Import-Export
- 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.
- Otherwise, you can export your own settings by entering the name of your plugin.
- The description of the plugin.
- The author of the plugin.
- The URL of the author's site.
- The version of the plugin.
- 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):
- You will be able to change the Mobile Menu icon (the famous Hamburger).
- Add a background image to your header.
- Customize the "back up" button.
- Change the colors and design elements of your archive pages.
Need more resources on Divi? Visit ElegantThemes' blog full of ideas and tutorials!
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!