Ideas with images

This is not a complete layout, but a number of content blocks that you can save to your divi Library and use throughout your site. To use them, simply create a new page, and save it as a draft, then load this layout into the page. You can now save any section, row or module to your Divi Library and insert it into your website wherever you wish. (of course you can also do the same trick with any other content blocks you like from the layout pages).

Some items have notes next to them, where we give a few tips for working with them.

For all items with images, it is often important what the dimensions of the image are for it to work well.  See here (just under the video) for more info on where you can find image dimensions of dummy images, so you can create yours to the same dimensions.

 

 

 

 

 

Simple image slider

Created with a slider module.

NOTES: Set your images on the background of each individual slide (so not under image & video). Each slide is presented as image 1, image 2, etc. and there’s a cog wheel for options for each slide. Open that and scroll down to “Background”. This is where you set your images. The slider automatically resizes and crops background images so that they all display at the same size. If you want the whole image to display for each slide, make sure all your images are the same size. Also, by putting more or less empty lines in the content field of the first slide you can control the height of the whole slider.

 

 

 

 

 

Simple image slider

Created with a slider module.

NOTES: Set your images on the background of each individual slide (so not under image & video). Each slide is presented as image 1, image 2, etc. and there’s a cog wheel for options for each slide. Open that and scroll down to “Background”. This is where you set your images. The slider automatically resizes and crops background images so that they all display at the same size. If you want the whole image to display for each slide, make sure all your images are the same size. Also, by putting more or less empty lines in the content field of the first slide you can control the height of the whole slider.

Image strip, looks good at the bottom of pages

Mosaic gallery / image section

This is actually a collection of  image modules, so the images are changed in the individual image modules. The images need to have the correct ratio for it to look good, so there are 4 square images, and one that is rectangular with dimensions 800 x 400 px.

You can change the width of this mosaic by going to the section and adjusting the sizing > use custom width>  and then changing the percentage width.

Round images

Round images can be inserted directly from your divi library, it is one of the premade modules. Insert the Dawn Round image instead of Dawn image.

PLEASE NOTE:  To create round images you should use square images, otherwise the image becomes oval. So make sure the image of your choice is cropped to square.

Pin It on Pinterest