I want to add 3 images in a row on my homepage.
Right now the default options (as you know) are either image left or right with accompanying text OR a product collection.
These 3 images will explain our unique value prop and thus products will not work.
Your help would be awesome!
Solved! Go to the solution
This is an accepted solution.
Thanks for reaching out. I'd be happy to show you a simple but effective way to do this. You will need to go into your theme editor and add the "Custom HTML" section to your homepage. The end result will look like the following:
1. Add the "Custom HTML" section
2. Add 3 contents within this section (this will be for each image) and set the container width to 33% (50% if you were doing two images, 25% for 4 images, etc.)
3. Copy and paste the following code into each content column
<div class="row"> <div class="column"> <img src="URLEXAMPLE" alt="Snow" style="width:100%"> </div> </div>
* Replace the URLEXAMPLE in this example code with the image of your choice. You can also change the alt text keyword shown in the code as well
alt="KEYWORD OF CHOICE"
4. Save the changes in the theme editor!
Give this a shot and let me know if it works for you. If there is anything else I can help you with, please let me know.
Great question. Avenue is a third-party theme that isn't directly supported by Shopify, it doesn't appear that they have built-in that functionality within their custom HTML section. You would want to consider hiring a Shopify Expert to code the "Custom HTML" section within that theme to included specified container widths.
However, as a workaround, they do have a section called "Image With Text" that allows you to add images in multiple columns across one row. It also allows you to can link to a specific page for each image.
Let me know if this helps!
Hey @Dirk !
Thanks for reaching out so quickly.
I just realized the theme is Simple and not Avenue *facepalm!
I tried image with text in Simple and there was no option for multiple images to add. Perhaps you have another workaround?
The Simple theme has the container width setting pre-built into the "Custom HTML" section when you edit each individual custom HTML content piece. I made a screen recording here to show that.
Thanks for this! Is there anyway to keep the images in a row for mobile view? Im using it to display icons and it takes up too much space when you change device.