Customer experience | Sales, Customer Insights,...

Multiple images in a row in Marketing Email

(1) Share

Report

Posted on by Hamid Hassan

Hi,

I am creating a marketing email, I want to place multiple images in a row.

Tried with placing multiple column section and placing images in it, but its not adjusting in mobile devices.

I want it to display like this.

Please Help.

Regards,

Hamid Hassan

I have the same question (0)

All responses (5)

Answers (0)

cloflyMao 25,210 on at

Like (0)

Report
Hi Hamid.

Because column control is responsive design, therefore when we're viewing marketing email in small width screen, those 4 columns images will become to 4 rows.

You could take steps below to set them to be on in same row.

1. Set columns of section to 4.

2. You may need to format source code of Marketing Email with following website:

https://webformatter.com/html

3. Add custom class to container element of four images.

4. Find @media query, add a rule for custom class:

.imageContainer { width: 25% !important; }

Result of test email(iPhone XR Gmail app):

Regards,

Clofly

Was this reply helpful? Yes No
Hamid Hassan 72 on at

Like (0)

Report

Thanks Clofly,

nice to see your reply. But I want to build like below image.

Stuck in social media icons. I have customized the section by my self, but it is not working as required on mobile. as given below image of mobile view. I want to display in a row like big screen because there is alot of space in left and right.

Please help.

Was this reply helpful? Yes No
cloflyMao 25,210 on at

Like (0)

Report

Hi Hamid,

Could you share me source code of your Marketing Email if possible? It will be helpful for me to find where should be modified.

In addition, you could take my method as reference:

add custom class name to your social icon container elements, then add rule to custom class: force width of social icon container to 25% when screen width is smaller than 768px.

Regards,

Clofly

Was this reply helpful? Yes No
Suggested answer

Preeti Rana on at

Like (0)

Report

Hi Hamid,

As mentioned above, this is primarily to make the email more responsive on mobile devices. Can you please create a support ticket for this issue so that the team can investigate the source file?

Guidance on creating ticket: https://mbs.microsoft.com/customersource/northamerica/CRM/support/support-lifecycle/CRMSupport

Please email us the ticket number on d365mktcomm@microsoft.com to follow up. :)

Thanks,

Preeti Rana

Was this reply helpful? Yes No
sinehelth 45 on at

Like (0)

Report

Hi Hamid

Did you have any luck building the footer?

I am trying to achieve this in a content block, but keep getting stuck.

Was this reply helpful? Yes No