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.
- Optimize the file images for web use. Watch Optimize Images to learn how to make your photos ideal for web use.
- Make sure you follow our file naming convention for photos.
- Upload the photo(s) to images/news folder. Read Uploading Media to understand how to do this.
Step process:
- Navigate to Extensions > Modules
- Filter the list by typing "News:" in the filter text box
- Make a duplicate of the top module in the list
- Open the copy and enter a new Title following the same naming convention
- Click on Particles
- Replace the Album Name with the same title as the module name
- Each New Item represents a photo image. Add or delete the number of photos needed for your module.
- Assign a photo image to each New Item
- Click 'Apply' when done
- Click 'Save & Close'
- 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.
- Go to Content > Articles
- Filter the list to the article you wish to insert the module
- Open that article and scroll to the last sentence in that article and press Enter to go down one line.
- Insert the module you just created by typing [module-###] but replace the ### with the Module ID number which you noted earlier
- Save & close the article
- Go to the front end and open that article you just edited
- The image grid module should appear now at the end of the article.
Watch the Video