Summer is in full blast, but it looks like the Font Awesome team does not go on vacation. They just delivered 4 new category packs and that also means there is an update for the FA Icons for Divi plugin.
What’s new in FA Icons for Divi 2.8?
Quite a lot, actually.
Obviously it supports the new icon packs. (Check here.)
Beside using the Font Awesome CDN now you also have the option of Self hosting the icons of FA 5 Free. What is self hosting? It means that the icons will be served from the same server as your site, and not from a server that is part of a Content Delivery Network.
In case you use your WordPress dashboard in a different language than English you can now translate the whole plugin, including the labels on the switches through a css file. (If you want your translation to be included in the next version, send it over, and I’ll be happy to add it. You will find my contact on the Help tab.)
I fixed a bug which caused an error when trying to network activate the plugin on a multi-site installation. (Thanks to Stian for reporting this.)
I updated the URLs on the Help tab because they were pointing to already non-existing pages.
The the FA assets were updated in the plugin to make sure you get the latest icons under all circumstances.
I ran some test to make sure that the plugin works with the latest versions of Divi, Extra, and Divi Builder.
To get all the details of what the plugin does and doesn’t do, please check out the plugin page before making a purchase. This will also help avoid any disappointments and frustrations.
Also the plugin still does not provide a UI for inserting icons into your content, blurbs, etc. To see how you can insert specific icons, please refer to the Examples page of Font Awesome.
Without much fireworks, the plugin now supports Font Awesome version 5.1!
What is new in Font Awesome version 5.1?
Travel category pack
Design category pack
Emoji category pack
Commissions and top requests
and a bunch of improvements
As for the plugin itself
Increased supported Font Awesome 5 version number to v5.1.0
Updated Font Awesome assets
Updated compatible version numbers
To get all the details of what the plugin does and doesn’t do, please check out the plugin page before making a purchase. This will also help avoid any disappointments and frustrations.
Also the plugin still does not provide a UI for inserting icons into your content, blurbs, etc. To see how you can insert specific icons, please refer to the Examples page of Font Awesome.
And the offer is still on for a couple of days
If you use the below coupon code at checkout then you can get my other plugin, the Divi Builder UI Pro plugin for only half the price! Let’s say, until end of June. 🙂
50offbup
Enjoy summer! Or winter, if you happen to be living on the Southern hemisphere. 😉
I couldn’t be more excited to share that FA Icons for Divi Builder 2.6 has just been released and supports the Font Awesome 5 Pro CDN as well! To check what’s new (and for an offer) keep reading!
First of all I’d like talk about the breadcrumbs a little in general. If you don’t know what website breadcrumbs are, they are links usually located somewhere at the top of the page of a website that show your current location on a certain website. I mean which page you currently are viewing and in which category. For example, if you are viewing an automotive website and you may be viewing particularly the “Opel Corsa” page, the breadcrumbs could be something like this: “Small Cars > German Cars > Opel > Corsa”. As you can see, the breadcrumbs may be useful if you have a website that has many pages. And possibly many categories as well.
“So, when you want to display the breadcrumbs navigation links somewhere on your Divi website, just place there this module and it will do its job.”
The Divi theme (you can read more about Divi on https://wpvivo.com – just note that it’s in Spanish) doesn’t have the breadcrumbs feature by default. Luckily, there is someone who has developed a premium plugin to add this feature to Divi. The plugin is called Divi Breadcrumbs Module and I will briefly review it in this article.
After activating the plugin in your WordPress admin panel, you will see a new module among your Divi modules options in the Divi Builder settings. This module will be called Divi Breadcrumbs and will be highlighted with the pink color. So you will surely notice it because of this color.
So, when you want to display the breadcrumbs navigation links somewhere on your Divi website, just place there this module and it will do its job. Then in the settings of this module you have some options. For example, you can choose to hide the homepage or the current page breadcrumb. Or, you can insert custom text for the home breadcrumb. And you can also change the separator icon “>>” to something different. You have 12 options there. In the design settings of the module you can customize the colors as well as the fonts sizes of the texts.
In overall, I think this is a pretty good plugin that does a really nice job. And if I had a website with a lot of content and many categories, I would most likely buy this plugin.
You can get a copy of this plugin here and I hope this review will help you.
Do you use breadcrumbs? Or only on certain types of sites? Or you try to avoid them as much as possible? Let me know in the comments below.
When it comes to work, I’m all about being effective. As effective as possible with as little scrolling and as few clicks as possible.
The design team at Elegant Themes did a great job in designing and further improving on the Divi Builder user interface. It is well organized and quite intuitive. I like working with it in general. And the Visual Builder on the front end was a nice addition recently, however, in most cases I still use the backend with the Divi Builder, it is simply more effective for me.
After working with it for some time – a couple years back – I realized though that there is too much scrolling involved when I need to adjust one thing in a module. So I started thinking and tinkering and wrote about it … But I wanted more!
You can visit the plugin page to read and see what it does and what are the differences between Light and Pro.
I am very proud of this plugin and I really hope it will reach to popularity of Font Awesome for Divi, which has been downloaded more than a 1500 times so far.
While I was doing a new website, for one of the pages I wanted to create a nice 2-column design. The main column would be giving a detailed description about a service, the other column would be the “sidebar” outlining the different services in that area.
It’s quite easy to do with the Divi builder, just choose a section, set the gutter, set the background and you are done.
But what happens if you want to have a more complex layout in the main column, for example start with 1 wide column, then have more columns, while the sidebar remains the same and follows the content all the way to the end? And filling the whole width of the screen?
That is where it gets a bit tricky.
Fortunately it is not at all that hard to do and most of it can be done with the settings in the Divi Builder. Only a few lines of CSS is needed, which you can find in the sidebar (step 12) and you will need to paste it into the Divi > Theme Options > General tab > Custom CSS box.
In the sidebar you can read the detailed steps for creating such a layout.
If you don’t want to bother setting it up, then you can simply download 2 free layouts or purchase the full pack of 9 layouts from the store. (More layouts will likely come soon.) Note though, you will still need to manually paste the CSS snippet!!! Otherwise it will not work.
An in any case I suggest to check the video below which walks you through the setup step by step.
You like it? Or you don’t? Let me know about it in the comments below.
Got questions? Leave a comment at the end of the page or write me.
This is my short version:
Insert specialty section (1/3 – 2/3)
Insert module in the left column
Insert column and module in right column
Open Specialty Section Settings, Content tab
Set background color (this will be the background color of the wider column)
Column 2 CSS Class: tdm-full-special-section-main* * The sidebar should be the one where you can only insert modules, the main should be the one where you can also insert rows with different layouts
Save & Exit
Open Row Module Settings, Design tab
Custom padding: Top 0px
Save & Exit
Open the settings of the Module in the sidebar column, Design tab
Custom padding: Bottom 1em
Save & Exit
Go to Divi > Theme Options > General tab > Custom CSS box and paste in the code
/* TRUE FULL-WIDTH ROW WITH COLORED COLUMNS */
/* Make the row really full width */
.tdm-full-special-section .et_pb_row {
width: 100% !important;
}
/* Adjust sidebar column content for large screens */
@media screen and (min-width: 981px) {
/* Content more narrow than sidebar column */
.tdm-full-special-section-sidebar.narrow .et_pb_module {
max-width: 300px;
}
/* Content floating right, typically when narrow and when on left side */
.tdm-full-special-section-sidebar.float-right .et_pb_module {
float: right;
}
}
Notes: if you want to make the content of the sidebar column less wide, add “narrow” in the CSS class field of the sidebar. If you also want to make it stick to the right, then add also “float-right”.
If you are running a multilingual site with Divi, then you are going to LOVE THIS piece of news!
The teams of WPML / OnTheGoSystems and Divi / Elegant Themes have been working together hard on making their plugins compatible with eachother. It looks like they have achieved their goal and now you are able to translate the pages built with Divi in a few clicks thanks to WPML.
Check out this short intro video to get into the mood of making your site multilingual. 🙂
When I saw the video I was jumping with joy. A client of mine is running a multilingual site with 7 languages at the moment and getting the content translated was kinda difficult. I still need to test the above, but it looks like a gigantic load has been lifted off of multilingual site owners.
If you want to have a very detailed written tutorial, then you can find one in the WPML Documentation library here.
I am sooooo much looking forward to testing and using this! Thanks WPML and thanks Divi!
The Font Awesome for Divi Builder plugin received an important update!!!
Font Awesome has changed their apporach in how the icon library can be included with a site – for good. Until now when a new version of the icon library was released you needed to paste a new code into the head of your site. Now this is over. There is one code (you can generate it here) which you never have to change again and you will always receive the latest and greatest of font icon.
Note: you will need to generate your own Font Awesome embed code here! It is not provided by The Divi Maganize.
This change has also been reflected in the Font Awesome for Divi Builder plugin. Activate it, enter the code received from Font Awesome and you are ready to go – for a loooooooong time. 🙂
Also a new feature of the plugin is a dashboard widget where you will receive news about any updates and news from The Divi Magazine.
Head over to the store to grab the new version, or just click this button below:
The amazing Divi 3.0 is out (for some time now) and fellow Divi enthusiast, Andrej found this the right time to put together an infographic on the history of Divi. Without further ado, here it comes:
![[Update] FA Icons for Divi](https://divi-magazine.com/wp-content/uploads/edd/fa-icons-for-divi-2.6-thumb-1024-1024x675.jpg){kind=icon}
Recent Comments