Summary of the new Divi tools to design faster and better • WordPress Help

My name is Gonzalo de la Campa and as always for me it is an honor to write in this wonderful blog of Fernando.

To the mess …

Elegant Themes makes continuous improvements in Divi just like the big Formula 1 teams do in their cars. I put this example because I have always felt that betting on Elegant Themes and Divi was betting on a great team.

In fact we have gone from version 3.0 to version 3.8 in 3 months (from March to June). Imagine the speed of the improvements. Amazing

It will be harder and harder to find updated Divi online courses since the updates are going at a dizzying pace, but that's what the profs are, to give us the batteries and try to give it all chew so that it is as easy as possible.

Girl, that the thing advances that is an outrage 😉

So to make it easier for you to find out about all of them I'll summarize here the latest improvements that have had to do with issues of speed, simplicity and productivity when it comes to designing your website.

and now … to the mess … as Jack said … we go in parts:

In this post I am going to talk about 3 improvements in terms of productivity with Divi:

  1. The new tool of Fluid Styles
  2. The new utility of the Filters by Divi
  3. The wonderful right button (and its novelties) [19659013] Divi Quick Access to go direct to edit what we want
  4. Divi WorkFlow : To create new pages easily
  5. Go back in the version de Divi (security improvement)

1. Saves a lot of time with the new tool from Fluid Styles

Divi now allows to copy all design modifications from one module to another even more quickly and easily.

But not only among modules also between rows and sections.

To give you an idea, if when designing you are making a Price table for example and in a column you apply styles, colors, shadows … then with a simple click you can apply everything to the other columns.

Or for example if you use a background in a section and you want to apply it to a module, row or another section … you do not have to go to that new one section and enter the settings to put that background, directly copies the style and ready.

You can also do it to a set of styles that you have done or only to one in particular such as titles, colors, etc.

If you are one of those who are too lazy to read, do not worry … here is a video of my YouTube channel where I explain it step by step:

[19659003]

2. Find more easily all your modifications with the Filters

Another of the best features of the latest versions of Divi are the Filters.

As usual in the top-of-range visual layouters allow you to change a lot of things (colors, texts, borders, animations, shadows, margins …) with so many options, usability is vital so as not to get lost and get involved in a sea of ​​adjustments and options.

In Divi they have made it very easy with the ] Filters .

Now when you enter a section, row or module, you no longer need to browse all the options to see which ones you have modified, simply click on the filters button and it will show you only the ones you've played.

You can also see the content settings or the responsive ones independently.

But better I'll explain in another of my videos that I've prepared for you and for my followers of my Youtube channel. And of course for my students of my Divi 3 in 1 course which is where they have my support and all the tutorials ordered and updated.

3. The wonderful right button (and its news).

Undoubtedly of these 3 news of productivity with Divi this is the one I like the most . Although the right button is something that has already been several years in Divi, has incorporated these themes of the styles within the utilities that were previously brought.

If you removed the right button in Windows for example … you did the damn ?

Well, with Divi the same thing happens, the day you use it, you can not live without it.

So I do not understand why other visual builders do not put their batteries and copy Divi in this, because it improves usability and saves time when designing that you do not see.

With the right button of Divi we can do many things like:

  1. Test A / B (no need of plugins or bagpipes )
  2. Disable content (so they do not show on mobile …)
  3. Lock content (so it does not get deleted)
  4. Copy styles (and paste all the settings wherever you want)
  5. Copy modules … (and paste them elsewhere on the page)
  6. etc.

But you have another video or my YouTube channel because if a picture is worth a thousand words, a video more than a million hehe

4. Divi Quick Access to go direct to edit what we want

This improvement will help us a lot.

Now when you move the mouse over a module and click on the pencil it will take you directly to where those settings are for that you do not have to look in the options palette.

So cool is this novelty that Fernando has made an exclusive post about it that you can see here: Divi Quick Access, the visual layout as it always should have been

Although a picture is worth a thousand words, look and enjoy. In addition it can also be the other way around, by passing with the mouse through the options palette it tells you what is modified evisually in the module.

 divi quick accesss 1

5. Divi WorkFlow: To create new pages easily

To me personally this update I like a lot for 2 things:

  1. It helps to see in an easy way that 3 things you can do each time you create a new page: [19659058] Customize it from scratch
  2. Import a predefined design
  3. Clone an existing page
  • I also love it because before that there was no Clone an existing page and you had to install a plugin type Duplicate Post (which now you avoid) or you had to open the page you wanted to clone (to take advantage of all that design you had done with the Divi Builder) and save it in the library and then create the new page and import That design that you had saved. The thing is that you also avoid it. No longer do you have to keep all the designs of your pages in the library to be able to reuse them since Divi keeps them for us. And this is something that is used quite frequently and will save us a lot of time when designing webs.
  • Also if you do not want to appear you can go to the options of the visual constructor and make it every time you create a new page, by default go directly to one of those 3 options without giving you to choose:

    6. Back to an earlier version of Divi (security improvement)

    One of the most frustrating things in WordPress and I would dare say that in the computer world in general, is when you update something and update … ZAS, it is jod … something or part of what used to work properly.

    The WordPress world is so wonderful that we have more plugins, more themes, more updates and improvements to the WordPress core and a bigger community, more developers, etc.

    That also means that as on your website you have plugins and theme of different developers sometimes when updating you can find some incompatibility between theme and one of your plugins, especially if you have any that is from a developer unreliable, that does not offer support or that does not update the plugin as WordPress updates progress.

    Well, from version 3.6 of Divi, if you ever update it and it breaks down go, Divi incorporates a wonderful button in DIVI> TOPIC OPTIONS> UPDATES> ROLLBACK TO THE PREVIOUS VERSION that will go back to the version you had of Divi before updating.

    [19659003]

    So from version 3.6 of Divi you can be calmer that if something goes wrong in your web you can go back and recover the previous version of Divi just in one click. Of course, you can not go back to versions before 3.6. This is from now on.

    Having said that, my recommendation is that you always wait a few days before updating but in plugins and themes … because if there are any errors, they usually fix it after removing the update and if you are one of those who update after 15 days for example, you make sure that the errors they have been able to find are possibly already solved.

    So nothing, if for me Divi is one of the most WordPress insurance for its role editor, for being audited by the Sucuri company, for being able to block modules … now we also have the security of being able to return to an earlier version of Divi if something goes wrong and to avoid some other pain of head 😉


    Well, I hope you liked it and all this will help you design more and better with Divi.

    I wait for you down here in the comments to chat while we take a virtual straw, well, in fact I am m s de vinito que de cerveza, jeje

    A big hug, Gonzalo.


    Guest author: Gonzalo de la Campa

    • For a few years he has been working on web design on his website of www.paginaswebempresas.es
    • It also has a SEO positioning agency in Google www.agenciaseoysem.com
    • It is also dedicated to giving WordPress courses Online with Divi at www.cursowp-online.com
    • And finally help people who want to start online with their Premium Program www.emprendit .online with a course that in addition to training includes premium website, SEO positioning, maintenance, hosting … In the latter has collaborated Fernando Tellado and many other great professionals such as Joan Boluda, Diego Artola, Victor Campuzano, Antonio G, Elsa, Maite and Laura López, Isa and Juanmi etc.
    Loading …

    May also help you:

    How to use conditional logic in forms

    One of the most powerful features of the forms module of Divi is the conditional logic that allows to show or hide form fields depending on whether certain conditions are met so let's see how easy it is to use them.

    How conditional logic works

    The first thing is to know the characteristic, that you will find in each field of your form.

    As you see in the previous capture, the first thing is to activate the conditional logic .

    Once done this it decides if the rules (more below) what you apply will be all at once or any of them . This is a vital decision for the operation of logic, and the best teacher is the practice and purpose of your form.

    To finish, start applying rules about existing fields, and this already gives you a clue: you can not apply conditional logic until you have created all the possible fields of your form .

    Operation is simple :

    1. You choose the field to which the rule will apply between created
    2. Defines the conditional logic:
      • is equal to (an option of your chosen field)
      • is not equal to (idem)
      • is greater than (a numerical value of the chosen field)
      • ] is less than (idem)
      • contains (text, etc. of the chosen field)
      • does not contain (idem)
      • is empty (the chosen field)
      • is not empty (idem)
    3. You select the value to which the conditional logic will be applied between the values ​​of the chosen field.

    ] The result is that the field to which you apply the conditional logic will only be seen if the rule or rules defined is met, otherwise it will not be displayed.

    Examples

    The best way to see it it is with examples, so we are going to entangle a little with some representatives.

    The field offers options

    If the field to which you are going to apply the conditional logic is of the drop-down type, checkboxes or radio buttons is almost the most obvious, you just have to choose the conditional logic (equals, is not equal, etc) and choose the field to the value of the available options to which it will be applied .

    So, if the field we are editing is of type checkboxes and you have defined that the rule is that you have chosen the field " I want … " the option " Budget Request ", then this field will be displayed .

    ]

    And in the published form, choosing the option " Budget " will show the field of budget types to which we have applied the conditional logic in addition to all generic fields, with no conditional logic, common to say it in some way.

    Choosing field with conditional logic

    Applied conditional logic

    As you see in the previous example, before selecting a field from the first drop-down are shown the fields without conditional logic (name, email, message) and are only selected by selecting the field with conditional logic, so that – in this case – the client chooses the budget type.

    No is an options field

    The other broad possibility is when the field from which the logic will emerge is not a list of options but something else plan or.

    Imagine, for example, that there is a field for the user to I saw a resume, and if the user chooses it, an additional field is shown to explain its virtues.

    You could also add a field whereby if the email address is from the company itself, it will not be shown, since You have your skills. Something like that …

    In this way, even if the user selects the value " Work with you ", as I have marked apply all the rules, it will only be shown if the mail does not contain ayudawp.com.

    With email

    Without email

    As you see in the screenshots, if you do not enter the email, the aptitude field for the job is shown, but once the enter and match the condition put that field is hidden.

    The examples can be many, and you can complicate the form to infinity, applying rules on rules to create really complex forms, with a lot of answers based on varied conditional logics.

    This makes the forms module of Divi really powerful, for almost any need. For my taste just lacking a file upload field, otherwise, thanks to the conditional logic, is practically perfect.

    Loading …

    May also help you:

    How to adapt Divi, Extra and Bloom to the RGPD

    As it is clear and notorious that there are many users of Divi Extra and even the Bloom newsletters plugin Bloom all of Elegant Themes we are going to do a review of how you can adapt to the RGPD if you use them.

    Deactivate Google Maps API and Google Fonts [19659004] If you do not want your web made with Divi to share your users' data with the Google Maps API and much less through Google Fonts you can disable both possibilities. [19659007] In Divi> Theme Options just do not put a Google Maps API key and disable Google Fonts your theme will use the installed fonts.

    You can also remove the Google Fonts from Divi as we saw the other day . [1 9659007] In Bloom you can also disable Google Fonts in your settings …

    Upload your own sources, or even Google Fonts (private)

    If you want to continue using Google Fonts with Divi you can always upload them manually from the divi you just have to download them and upload them, but they will not use external scripts that extract information from your visitors.

    You can do it with any module, as you see in the following screenshot …

    Excludes the IP address of the subscription banners

    A new functionality of the Optin de Divi that has gone very unnoticed is ] the possibility of not saving the IPs of the users who fill in your forms .

    And it is important, because the IP address is considered by the RGPD as personal data . So if you collect it you must inform, and if you do not want it at all, Divi gives you the option not to collect it .

    Simply uncheck the box " Include IP Address " in the advanced settings tab of the otpin form

    It is not mandatory, you just have to make the decision of what to do, and you will know what to report.

    Also you can do the same in Bloom's subscription forms .

    Protects security in your optin forms

    Another little-known adjustment is the possibility of applying attributes that protect the security of users who fill out your forms .

    And yes, also the RGPD requires you to protect your users' data .

    To do this, also in the Advanced settings tab of module optin p You can apply the attributes external, noopener, noreferrer which will protect your users from the vulnerability known as tabnapping or target blank .

    Data Collection

    Since the last versions, Divi does not collect any data from your users thus helping you to comply with the RGPD.

    Only collects data in tests A / B, which calls multivariate tests for which uses the IP addresses of anonymous visitors to determine which users to serve a test or

    Add the 1st layer of information to your optin forms

    Another new option is the possibility of including a field in the bottom of your optin forms, with your first layer of information. You have it in the content settings of the form.

    Add acceptance boxes

    To comply with the RGPD, now in Divi and Bloom, thanks to the integration with fields Customized, you can add acceptance boxes and also save that consent.

    It is up to each provider how to add them, but in this link you have the procedure for each provider compatible with Divi and Bloom .

    Basically the procedure is as follows:

    1. Add the custom fields in the account of your newsletter service.
    2. Once they exist, when you configure it in Divi and Bloom you can select them.
    3. In the visual constructor choose the one you want, checkbox of acceptance for example, and you add it to your forms

    Add link to your privacy policy

    Once you have your custom field, now also with Divi and Bloom you can add a link to your pol Privacy policy to the text that accompanies the acceptance box, as in the following capture:

    Divi contact forms that comply with the RGPD

    In advance I tell you that , although you can create forms with Divi that comply with the RGPD you have to make a small ñapa / trick .

    First add your form as always and add a new field, choose type Checkboxes and next to the box you put your text in my example with an asterisk at the end, then we see why.

    It's important that the box is not checked in the Options , because the RGPD forbids it, and the field is mandatory.

    Now add a new field, and choose type Text area . In the Title box, you enter your first layer information as required by the RGPD. Again mark the field as mandatory.

    This type of field does not allow formats, but the RGPD does not ask for it either, at least it fits a lot of text and it will not occupy a lot of space in your form. [19659007] With this you already have everything we can do with the fields of the form, and that is that no field allows us to link to our privacy policy.

    The structure of the form will look like this:

    [19659007] To get it, just below the form, add a text module, and that's where we put the text and link to our privacy policy, putting an asterisk first, to relate this field to the previous one of the selection box, so that is understood and each part forms a whole.

    The final structure of our form will be as follows:

    And our Divi form that complies with the RGPD will be this way:

    [19659007] Logically, the first layer of information should be relevant, yours, not the example I have used. If you just save the forms in your email, put it, of course.

    And if, after having seen and tested the above, you do not stop, or want to use a simpler system, you can use the plugin to fulfill the RGPD with Divi, Extra and Bloom .

    You just have to customize your texts in the new settings screen and it will be displayed when the user clicks on your forms optin .

    It looks great, it does not slow down subscriptions, it does not hide your pretty forms, it's easy to configure and will help you easily comply with the RGPD in your subscription forms .

    After clicking on the subscription form the overlay is shown


    As you can see, Elegant Themes has put the batteries in place, and continues to take care of its users, also with compliance with the RGPD, making it easier to add the new elements with the that protect privacy and right os of our users.

    Loading …

    That may also help you: