nylas-mail icon indicating copy to clipboard operation
nylas-mail copied to clipboard

Support images in signatures editor

Open grinich opened this issue 8 years ago • 22 comments

As reported in https://twitter.com/benlevermore/status/687665975634870272

grinich avatar Jan 14 '16 22:01 grinich

+1

jamesaspence avatar Jan 20 '16 19:01 jamesaspence

+1

emlazo1 avatar Jan 21 '16 22:01 emlazo1

+1

emlazo1 avatar Feb 10 '16 13:02 emlazo1

Hmm — I think we have a couple options here, and we should look at how other clients do it. We currently allow you to paste raw HTML in as your signature, which allows you to use img tags and images hosted on the web.

We could allow you to drag and drop an image into the signature editor, but then we'd need to attach it to the email and we don't currently support inline attachments.

@grinich what did you have in mind here?

bengotow avatar Mar 18 '16 17:03 bengotow

(Potentially blocked on #968)

bengotow avatar Mar 18 '16 17:03 bengotow

Recently a copy-paste of an Email Signature (with Photo) from about.me stopped displaying an image. I looked at the pasted HTML and it missed the URL to the image. I think this is a bug, not an enhancement.

Here is the (organized) HTML that gets generated by Nylas, when I copy the (visual) signature from about.me and paste it into Nylas via the "live preview" (not live HTML). The image won't be displayed in Nylas, nor any other HTML viewer.

<div class="signature-container">
    <div>
        <table border="0" cellspacing="0" cellpadding="0">
            <tbody>
                <tr>
                    <td style="width: auto; height: 20px; font-size: 0px;">
                         
                    </td>
                </tr>
                <tr>
                    <td style="width: auto;">
                        <div style="line-height: 0;">
                            <table border="0" cellspacing="0" cellpadding="0">
                                <tbody>
                                    <tr>
                                        <td style="width: 107px; line-height: 1; vertical-align: top;" align="left" valign="top">
                                            <img style="display: block; width: 0; height: 0; overflow: hidden;" alt="--" width="0" height="0" />
                                            <div>
                                                <img style="margin: 0px; padding: 0px; display: block; border: 1px solid #eeeeee;" alt="" width="105" height="70" />
                                            </div>
                                        </td>
                                        <td style="width: 10px; font-size: 0px;">
                                             
                                        </td>
                                        <td style="width: auto; line-height: 1; padding-bottom: 3px; vertical-align: bottom;" align="left" valign="bottom">
                                            <div style="margin: 0; font-size: 18px; font-weight: bold; color: #333333; font-family: proxima-nova-1,Proxima-Nova, Helvetica, Arial, Sans-Serif;">
                                                Martin Páleník
                                            </div>
                                            <div style="margin: 0; margin-top: 1px; font-size: 12px; color: #2b82ad; font-family: proxima-nova-1,Proxima-Nova, Helvetica, Arial, Sans-Serif;">
                                                <img style="display: block; width: 0; height: 0; overflow: hidden;" alt="https://" width="0" height="0" />
                                                about.me/slovenskyweb
                                            </div>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td style="width: auto; height: 20px; font-size: 0px;">
                        <img style="margin: 0px; padding: 0px; overflow: hidden;" alt="" width="1" height="1" />
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

And here is the (organized) HTML of the signature, that gets generated, when I copy the same (visual) signature from about.me and paste it (visually) into the Online HTML Editor. Here, the image is shown correctly and you can see the URL of the image is inserted as well.

<div class="signature-container">
    <div>
        <table border="0" cellspacing="0" cellpadding="0">
            <tbody>
                <tr>
                    <td>
                         
                    </td>
                </tr>
                <tr>
                    <td>
                        <div>
                            <table border="0" cellspacing="0" cellpadding="0">
                                <tbody>
                                    <tr>
                                        <td align="left" valign="top">
                                            <img alt="--" width="0" height="0" />
                                            <div>
                                                <img src="https://thumbs.about.me/thumbnail/users/s/l/o/slovenskyweb_emailsig.jpg?_1454630413_62" alt="" width="105" height="70" />
                                            </div>
                                        </td>
                                        <td>
                                             
                                        </td>
                                        <td align="left" valign="bottom">
                                            <div>
                                                Martin Páleník
                                            </div>
                                            <div>
                                                <img alt="https://" width="0" height="0" />
                                                about.me/slovenskyweb
                                            </div>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td>
                        <img src="https://about.me/t/sig?u=slovenskyweb" alt="" width="1" height="1" />
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

The signature copied from about.me into Gmail/Inbox works. I got the feeling that Nylas signature worked before as well, but I might be using Gmail/Inbox so I'm not sure.

I am using the latest updated Fedora 24 Workstation, which I installed yesterday, and Nylas, which has also been installed yesterday directly from the website, that is Nylas version 0.4.45-7637265.

ghost avatar Jul 06 '16 06:07 ghost

Another request: https://nylas.zendesk.com/agent/tickets/5406

jackiehluo avatar Jul 29 '16 17:07 jackiehluo

+1

mgohashi avatar Aug 30 '16 22:08 mgohashi

Another request: https://nylas.zendesk.com/agent/tickets/5887

hallamoore avatar Aug 31 '16 18:08 hallamoore

+1

robjac avatar Sep 06 '16 14:09 robjac

Hey all you 'tards giving the '+1' responses; there's a thumbs up button on the original post. Use that for its intended purpose please and quit spamming our inboxes yer junk 'me too' comments.

sysfu avatar Sep 28 '16 23:09 sysfu

for sysfu...

+1

Just unsub? The thumbs up feature is only available on desktop.

robjac avatar Sep 29 '16 15:09 robjac

Another request: https://nylas.zendesk.com/agent/tickets/7124

sachinag-zz avatar Nov 09 '16 22:11 sachinag-zz

It's been a while since this ticket was opened. Is there an ETA?

It's hard to swallow that I'm paying for an email client that doesn't support images in signatures.

AlexDunmow avatar Nov 30 '16 16:11 AlexDunmow

Another request (from me).

GM-Polyakov avatar Jan 04 '17 03:01 GM-Polyakov

Is this fixed yet?

toshitapandey avatar Feb 26 '17 08:02 toshitapandey

Still not fixed, currently not going Pro because if this is the level of support and features then not sure I want to buy $12 a month for something that ignores the simple stuff. Get the basics right guys then worry about all the other nice things - I get Enterprise is probably where you make your money but (I am guessing) there is not a single company who does not put images in their signatures and expecting users to edit HTML and host an image is unrealistic

Sadsurfer avatar Jun 05 '17 08:06 Sadsurfer

Cancelled my subscription due to this issue.

AlexDunmow avatar Jul 14 '17 12:07 AlexDunmow

Stopped using because of this.

akamud avatar Aug 16 '17 13:08 akamud

Bybrand generates beautiful signatures in pure HTML, and can place in the signature area on Nylas. Easy. You will not need to modify the email client, at least i think

ursoforte avatar Aug 19 '17 22:08 ursoforte

As far as I can tell having images embedded in e-mail signatures is already supported. Simply edit the raw HTML to include a img tag with your favorite image.

Say for example that I would like to include a .png image of the following URL https://i.imgur.com/d7MTabz.png. Then the raw HTML is

<img src="https://i.imgur.com/d7MTabz.png">

et voilà! you now have successfully placed an image in your e-mail signature. The caveat is that you have to host the image yourself, which is no biggy.

multivac61 avatar Oct 23 '17 11:10 multivac61

The caveat is that 90% of email clients will block the image, because it's an external URL not an embedded image. Which is a biggy.

Nylas just needs to support inline images in its signatures. This is a pretty common feature that email clients have done for a very very long time. It may not be sexy, but it's necessary.

AlexDunmow avatar Oct 24 '17 03:10 AlexDunmow