CODEWITHSUNDEEP
pythonhtml
pez
pez

Reputation: 4235

Python - Embedded Image in HTML SMTP email

I'm generating emails using Python's smtplib, and I'm trying to re-create a signature to place at the bottom of each email. Below is a highly detailed and masterful recreation of this signature:

signature

The text portion I've already got figured out.

body = """\
    <html>
        <head></head>
        <body>
            stuff
        </body>
    </html>
    """

Which I then attach to the message:

message_body = MIMEText(body, 'html')

message.attach(message_body)

What I can't seem to figure out is how to then embed the images so they're formatted like in the picture above. The lines in the picture are just to show alignment, but they don't exist in the signature itself. The images also contain hyperlinks.

I've tried something like adding this to the very end of the <body> tag to at least recreate the smaller images at the bottom:

<img src="C:\Users\Me\Desktop\image1.png">

<img src="C:\Users\Me\Desktop\image2.png">

I don't get any errors, but also nothing shows up when the email is sent. I don't know how I would begin formatting the larger image that should sit to the left of the text in the signature.

I can successfully include these images in the email as attachments using MIMEImage, but I don't want them as attachments, so that didn't work.

After the images are embedded as above, I assume I could just do something like this to add in the hyperlinks:

<a href="https://www.example.com">
<img src="img1.png" alt="example.com">
</a>

I'm new to HTML so these are uncharted waters for me, and I'm not sure what to do. I've read a lot of questions here that also mention base64 encoding, but I don't know if it applies to this situation.

Any help would be appreciated. Thanks!

Edit: New question posted here to address the issue that, once encoded and sent, the images in the sent email are showing up as blank.

Upvotes: 0

Views: 2032

Answers (1)

pydvlpr
pydvlpr

Reputation: 321

If you want to use embedded images in your html you need to base64 encode them before.

A html image tag would look like this then

<img src="data:image/jpg;base64,THEBASE64CODE" alt="image"high="30" width="30" />

There for you have to read the image file and base64-encode it with pythons base64.

Otherwise you need to refer to a ressource in the web which contains your images.

<img src="http://yourwebserver.org/image.jpg" alt="image" high="30" width="30" />

The first solution needs to send your images with every email. This increases the emails size.

The second solution needs to have a public web ressource and the the receiver system will load the images when after opening the email (if his/her email programm do not block it).

In your case I would try to design the email in plain html with your preferred editor and webbrowser. Thereafter I would try to modify the img-Tags with one of the given solutions.

Some additional infos for yout email-design:

Html tables can be very usefull to structure the data representation

<table border="1" >

<tr>
    <td>IMG left</td>
    <td colspan="2">

        your text that could be very long and usefull to your recipient<br><br>
        you should encode the mail text for html within your python application<br><br>

        otherwise you will have problems with newline and so on.
    </td>
<tr>
    <td></td>
    <td>IMG center</td>
    <td>IMG rigth</td>
</tr>
</table>

Replace the IMG with your img-Tag. Put your mail text into the text-section. Remove the border="1" to remove the borders of the html-table.

For HTML-encoding have a look at pythons HTMLParser

Upvotes: 1

Related Questions