Display Link Text with Inline Image

Hi there @strakerc,

Thanks for reaching out with your interesting question!

I couldn’t find any official word on this in the MailPoet documentation so I ran some tests, and I confirm what you are seeing. If a link contains *both* an image (img tag) and then some text, when embedded in a MailPoet newsletter, the text part is dropped and only the image shows.

However, I did find a workaround. Looking at your inspiration site, A Smart Bear, you can see that the little icon they use to flag their links is actually *a background image for the link* rather than an explicitly embedded image. This means that the link itself is only the actual text; the image appears using CSS rules.

Using this method, when embedded in the MailPoet newsletter the image is dropped but the text remains, so at least your embedded post is readable, and the link still exists and is clear.

Here’s the CSS I used to convert links to have the icon added as a background image (all credit to A Smart Bear):

First add a class to your links:

<a  class="link-with-image">here is my post link</a>

Then add some CSS rules to your theme:

.link-with-image {
	background-image: url(https://mystagingwebsite.com/wp-content/uploads/2024/01/straker-curious-smaller.jpg);
    background-repeat: no-repeat;
    margin-left: .5ex;
    padding-left: 3.4124ex;
}

Wow – I am very impressed with this answer! Seriously – thank you!

I deployed a workaround in the meantime that comically has increased engagement of my emails. Instead of sharing my entire post via email, I now just share the post summary (which has no links).

While I would prefer to share the entire post, this issue coupled with anchor links such as footnotes not being handled well seems to resolve all of my issues (for now). And then I can control the formatting on my site and not worry about the emails!

That said, if I ever go back, I am going to try this out. I’m actually going to add this CSS to my site right now anyway so I don’t forget!

Hi again @strakerc,

Great to hear, glad we could help! Given the other formatting requirements of your posts, sharing just the summary seems like the perfect solution (and bonus engagement boost as well – awesome!).

I’ll go ahead and mark this thread as resolved. Happy mailing!