In this step you need to determine the design you want and prepare your photos.
Remove gutter from divi moduel.
This plugin adds a new module to the divi builder it allows to easily insert titles without going through the text module.
In the divi gallery module settings click the gray plus icon to add 12 images to the gallery.
Titles and headers are an integral part of your post design and readability.
Divi s gallery module means that you can create a ravishing gallery of pictures in a grid format with little effort.
With divi you ll be able to alter the gutter width to manage the spacing between grid objects or pictures.
In this tutorial we re going to create the above designs using css styles.
I have two divi rows each row contains 3 columns each column contains a blurb module item.
Text version of this divi wordpress tutorial.
That is why divi has the gutter width option for each row.
Hey this is jimi blevins.
Optional values for gutter width range from 1 to 4.
This tutorial will quickly show you how to reduce the gutter width and remove the spacing between your columns in divi for wordpress.
Gutter width is just a fancy term for the margin between columns within a row.
This plugin helps you insert and customize titles as you wish.
Nevertheless even with 4 gutter width.
And maybe crucial design aspect of a grid is spacing.
With the divi builder deployed go ahead and create a new regular section with a one column row and add a divi gallery module to the row.
In the following tutorial i ll use the divi blurb module to make things a little simpler.
I ve got a really quick tutorial for you today.
Reducing divi builder module spacing this post may contain referral links which may earn a commission for this site this post covers some of the ways you can increase reduce or eliminate the space around divi modules rows and sections to get the right amount of white space for your design.
Now create your other 7 modules either by duplicating and editing the first or if you want different types of modules create those and be sure to add the css.
It is difficult to adequately build a grid with correct margins on the fly.
It helps ease the pain for spacing out columns evenly.
Divi tutorial blurb module hover effects.
Add your module adjust the content as needed and then in the advanced tab give the module two classes of ds grid item and ds grid item1 separated by a space this is a grid item.
Prepare your photos and design elements.
In those blocks i used font awesome icons as i needed a drupal icon.
Divi gallery module is easier to use.
Enable use custom gutter width set.
We ve created a snippet that you can copy and paste to your divi websites.
