Objective:

An image grid is actually a module which we insert into an article. This lesson will teach you how to create a module and also how to insert the module to your story article.

NOTICE
Note that using an image grid is only practical if you have 4 or more photos to showcase. If you have less than 4, then it is more practical to just add the photos directly to your article using Media Manager.

Things to prepare:

Before creating your image grid, it is best to prepare all the content you will be needing.

1. Optimize the file images for web use. Watch Optimize Images to learn how to make your photos ideal for web use.
2. Make sure you follow our file naming convention for photos.
3. Upload the photo(s) to images/news folder. Read Uploading Media to understand how to do this.

Step process:

1. Navigate to Extensions > Modules
2. Filter the list by typing "News:" in the filter text box
3. Make a duplicate of the top module in the list
4. Open the copy and enter a new Title following the same naming convention
5. Click on Particles
6. Replace the Album Name with the same title as the module name
7. Each New Item represents a photo image. Add or delete the number of photos needed for your module.
8. Assign a photo image to each New Item
9. Click 'Apply' when done
10. Click 'Save & Close'
11. Note down the ID number of the module you just created.  The ID number can be found at the last column of that module in the Module Manager listing.
12. Go to Content > Articles
13. Filter the list to the article you wish to insert the module
14. Open that article and scroll to the last sentence in that article and press Enter to go down one line.
15. Insert the module you just created by typing [module-###] but replace the ### with the Module ID number which you noted earlier
16. Save & close the article
17. Go to the front end and open that article you just edited
18. The image grid module should appear now at the end of the article.
    
    
    Watch the Video