'How to stop HTML email <img> src attribute from being removed

The IMG src attribute is removed from tag and only ALT text is displayed in HTML email. Below is the container table from the banner that contains the image. This works fine when I display the HTML page in IE or Chrome. But when I run it through GoDaddy, the SRC attribute is deleted and the ALT text is not formatted as indicated in the IMG tag. How do I prevent this from happening?

<table border="0" cellpadding="0" cellspacing="0" width="100%" style="table-layout: fixed; ">
    <tr>
        <td align="center" bgcolor="#efeac9" style="padding: 20px 0 0px 0;">
            <div style="display: none; font-size: 1px; color:#efeac9; line-height: 1px; font-family: Arial, sans-serif; max-height: 0px; max-width: 0px; opacity: 0; overflow: hidden; mso-hide: all;">
                This won't be shown in the design, but will be visible in the inbox preview.
            </div>
            <table border="0" cellpadding="0" cellspacing="0" width="600" class="wrapper">
                <tr>
                    <td>
                        <table border="0" cellpadding="0" cellspacing="0" width="100%">
                            <tr>
                                <td align="left" bgcolor="#efeac9"  class="logo">
                                    <img src="Images/WP_Email_Banner.png" alt="Wisconsin Pollinators" height="252" width="600" border="0" style="display: block;
                                         padding: 0; color: black; font-family: Arial, sans-serif; font-weight: bold;  font-size: 24px; background-color: #efeac9; 
                                         -webkit-border-radius: 10px; border-radius: 10px;" class="fluid-image"/> 
                                    <!--<img src="Images/WP_Email_Banner.png" height="252" width="600" border="0" style="display: block; padding: 0;"/>-->
                                </td>
                            </tr>
                            <tr>
                                <td align="center" bgcolor="#ffffff" style='font-family:Verdana; font-weight: bold; color:#943E58; font-size: 20px; line-height: 24px; padding: 15px 0px 15px 0' class="mobile-title-pad">
                                    WELCOME TO<br />WISCONSIN POLLINATORS
                                </td>
                            </tr>
                        </table>
            </table>
</table>

Thanks for your help!

htmlemail


Solution 1:[1]

I hope you speak for the following image tag:

 <img src="Images/WP_Email_Banner.png" alt="Wisconsin Pollinators" height="252" width="600" border="0" />

First check if the filename is correct.

Then check if the path is correct. If your image folder is outside of your html page use the following format "../Images/WP_Email_Banner.png"

Finally try to upload your image to your ftp client and use the url link in the src atrribute (like http://yourwebsite.com/Images/WP_Email_Banner.png. Check again and if you have problems comment.

Solution 2:[2]

Remove extra options from image tag and try this

<img src="Images/WP_Email_Banner.png" alt="Wisconsin Pollinators" height="252" width="600" style="display:block;" />

And you also using css class. In email it will not work so use inline css as you are already using.

Solution 3:[3]

Please Upload the image on a public url and use its link as img tag's src value. When you send an email with attachment, the HTML content does not have access to the file system, hence local images do not show up as you expect them to be shown. I faced this with Outlook web and solution was to host the images on public URL.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1
Solution 2 devpro
Solution 3 Mayank Singh

Related Questions