HTML Code - unbelievable no-use feature, what's the point?

Hi all,

I have sadly seen that this is a known issue, but unfortunately I could not understand the solution from the previous threads, so please kindly help if you’re able to.

PROBLEM: Using the Emails & Broadcast feature I created an email, but Infusionsoft by Keap does not support the functionality to add more than 3 images on the same row side by side regardless of the size of images. For example I needed to insert 4 images of our own design as our SOCIAL MEDIA icons in the same row next to each other linking to our social media accounts. We do not wish to use the Infusionsoft by Keap social media logos that are colourful. Sadly I cannot insert more than 3 images next to each other on the same row as this is not supported, even though the social media icon images are TINY.

SOLUTION: I called the Infusionsoft by Keap support team and they proudly explained to me that I could use the HTML Code snipet feature to achieve what I was trying to do. After training myself using W3 SCHOOLS and GOOGLE I successfully wrote the CODE below:

Welltodo Twitter Welltodo Facebook Welltodo Instagram Welltodo LinkedIn

I inserted the code into the HTML Code clock and guess what?

Infusionsoft by Keap stripped it out in both preview and actual send!

So please could you help?

We are actually considering dropping Infusionsoft by Keap as we can hardly get the results we require from a CRM / Email Marketing / Marketing Automation / Sales solution.

Thanks a lot in advance for all your help!
Roxy

I am trying to add some spaces to the HTML code I wrote to break it, so that you can all see the code I wrote instead of what happened above…

< div align=“center” valign=“middle” >
< table style=“width:100%” >
< tbody >
< tr align=“center” valign=“middle” >
< td>< a href=“https://twitter.com/welltodoglobal” target=“_blank”>< img src=“https://www.welltodoglobal.com/wp-content/uploads/2019/06/twitter-square-brands.svg” alt=“Welltodo Twitter” width=“30” height=“30”>< /a>
< td>< a href=“WELLTODO” target=“_blank”>< img src=“https://www.welltodoglobal.com/wp-content/uploads/2019/06/facebook-square-brands.svg” alt=“Welltodo Facebook” width=“30” height=“30”>< /a>
< td>< a href=“https://www.instagram.com/welltodoglobal” target=“_blank”>< img src=“https://www.welltodoglobal.com/wp-content/uploads/2019/06/instagram-brands.svg” alt=“Welltodo Instagram” width=“30” height=“30”>< /a>
< td>< a href=“https://www.linkedin.com/company/welltodoglobal” target=“_blank”>< img src=“https://www.welltodoglobal.com/wp-content/uploads/2019/06/linkedin-brands.svg” alt=“Welltodo LinkedIn” width=“30” height=“30”>

Hi, @Roxy_Deniz_Ozalp. I would convert those images to 30x30 png or similar.
SVG is still not widely supported in email clients. I currently don’t use an email client that will display them correctly. A Guide for SVG Support in Email | CSS-Tricks - CSS-Tricks.

Here is the code cleaned up a bit. Just remember to close all tags (including <img></img> which is a but unconventional)

   <table align="center">
<tr>
<td><a href="https://twitter.com/welltodoglobal">
	<img src="https://via.placeholder.com/30x30"></img></a></td>
<td><a href="https://www.facebook.com/welltodoglobal">
	<img src="https://via.placeholder.com/30x30" alt="Welltodo Twitter"></img></a></td>
<td><a href="https://www.instagram.com/welltodoglobal">
	<img src="https://via.placeholder.com/30x30" alt="Welltodo Twitter"></img></a></td>
<td><a href="https://www.linkedin.com/company/welltodoglobal">
	<img src="https://via.placeholder.com/30x30" alt="Welltodo Twitter"></img></a></td></tr></table>

Thanks so much for cleaning up the code and for your help!

I will replace the images with png versions.

However, I still don’t think that the code will be accepted as Infusionsoft by Keap’s HTML Code feature strips out tables! This is what’s causing the problem. I don’t understand why a table is not acceptable. How else can I place 4 x tiny (30x30 px) social media icon images side by side?

Can anyone help with the actual problem?

Thanks a lot!