Importing to Outlook
This article applies to the Email builder in all BEE Pro plans.
Do you need to send the email you designed in BEE using Microsoft Outlook? Here's everything you need to know in order to accomplish this.
- Note that this tutorial is intended for BEE Pro users. Your images must be hosted through BEE Pro or an external service provider in order to use this workflow.
- This workflow applies to desktop Outlook clients on Windows only. The necessary option to accomplish this is not available on Outlook for Mac. (If this is frustrating for you, we encourage you to let Microsoft know.)
- This tutorial is based on a Microsoft Community post.
If you'd prefer to see a visual example of how this works, you can start with our video tutorial:
Before you start, you need to enable the "Insert as Text" Attachment option for your Outlook application. You can do so by following the steps below:
- Navigate to File > Options > Quick Access Toolbar
- Set the "Choose Commands From" dropdown list to "All Commands"
- Navigate to "Attach File" and click “Add”
- Click "OK" to confirm.
Once the correct option has been enabled within your Outlook application, you can import the HTML file by performing the steps below:
- Open a new composition window.
- Click the "Attach File" option now found on the top ribbon of the compose window.
- Select your HTML file.
- Choose insert as text.
You're all set to send your email through Outlook! Keep in mind that using Outlook as a sending platform may impact the functionality of your design in other email clients.
If you have any questions, feel free to contact us.
Comments
17 comments
So basically Outlook Mac isn't usable with these HTML Templates?
Hi Craig! As far as we know, Outlook for Mac doesn't include the necessary option to import an HTML email. However, if this is causing issues, you could always use their web client to send an email created in BEE. If you're interested in a tutorial for this, please let us know.
Buttons with links don't work after importing to Outlook using this method - we have to create new buttons with images for the links to work instead. Is this a known issue?
Hi Phil, sorry to hear that you encountered this! This is a known issue. Newer versions of Outlook modify our button source code and change it into an image instead. This happens because many versions of their email client use Microsoft Word as a rendering engine.
Our tests show that this removes the attached URL, effectively breaking the button. Unfortunately, we can't prevent Outlook from doing this, but we have a couple of workarounds we can share!
Thanks Willow - that worked perfectly.
Hi Willow, I tried importing HTML from Bee into gmail client using the instructions above. When I send that email, the responsive elements do not work properly (basically the column on the right side become really thin), whereas when I send the email directly from Bee it works really well. What can I do about it?
Hey there! Unfortunately, the issue you described is common when using email clients to send HTML emails. Email clients typically modify the source code according to what they natively support. The change to the HTML can result in rendering issues, such as the loss of mobile responsiveness.
If you're using an email client to send designs created in BEE, we recommend using single-column designs to avoid rendering issues. For the best compatibility with multi-column designs, we recommend using a professional sending platform.
The images don't show up anymore when an email is inserted as text on Outlook Desktop. On the browser version of outlook the images display. Any help with this?
Hi Alicia,
Unfortunately this is an issue with Outlook that often happens: it can be the size of the images and resizing them could help.
Another thing that you can do on Outlook side is to ensure that the email client does not have any settings in place that are blocking the images from displaying. Outlook is known to have security settings in place by default for images and buttons with links attached.
I found this article that could help as it's related to the same issue: https://answers.microsoft.com/en-us/outlook_com/forum/all/outlook-365-desktop-installation-not-showing-all/a9f3241d-eac7-4598-b1e9-52bfd9a828e5
This doesn't work in the newest version of outlook (2023). The insert option no longer offers an "insert as text."
Hello there,
I have 2 problems with the templates imported this way. First, after importing, I see a thin grey horizontal line between some of the rows, not all of them. Second, many times after sending, some of the recipients receive the email with big gaps between rows, like if the rows were separated by thick horizontal transparent lines. The height of these is the same amongst all rows.
Are there any workarounds to avoid the issues above?
Hello Mark,
I have done a quick internet search and found a Microsoft community thread for this problem as the new version of Outlook does not include the "Insert as text" feature.
There they suggested following this tutorial: https://www.linkedin.com/pulse/how-insert-html-source-code-outlook-emails-maurizio-la-cava/
Hello Zoltán,
May I ask what version of Outlook you are using?
And if you could share a screenshot of the issue?
Thank you in advance.
Hello Roisin,
Our Outlook version 2108, we get it as part of MS Office 365.
Please find a screenshot of the large gaps attached.
There is no more "insert as text" option in the latest outlook. It's just "open."
Hello Zoltán,
Thank you for the information.
The issue is caused by a bug in their system which they should fix.
It seems to be well-known in the Outlook community, here is a link where the bug is described: https://learn.microsoft.com/en-us/answers/questions/1074277/white-horizontal-lines-randomly-appearing-in-outlo
Hello Mark,
I'm not sure you saw my comment from earlier, I will paste it below:
I have done a quick internet search and found a Microsoft community thread for this problem as the new version of Outlook does not include the "Insert as text" feature.
There they suggested following this tutorial: https://www.linkedin.com/pulse/how-insert-html-source-code-outlook-emails-maurizio-la-cava/
Please sign in to leave a comment.