Mailchimp shot in Blocs

Hi folks

I have searched and didn’t find much. Can I use Blocs to create an HTML email for a Mailchimp mail shot?

Thanks in advance

I assume so. I thought they were just plain html emails without any bells and whistles, but it’s a while since I used MC.

I don’t know about mail chimp because I don’t use it, so I don’t know how you submit an HTML email to them. However, you can use blocs to create an impressive HTML email directly from your email client. Clearly, you have to create your email page, which can be done in blocs, but you should observe a few rules. Firstly try and keep the page width between 600 and 800 px wide. If you don’t do this, your page will use the breakpoints to display the email as best it can in the width of the email client window - best to make it more predictable by keeping the biggest breakpoint within the 600 - 800 range. Secondly, don’t use any fancy features such as animation etc. keep it simple text and images. Finally, you have to upload your email page and all its associated files and folders to a folder on your server. Once you’ve done that, simply open the page in your web browser (Safari is probably best for this) And select file/share/email this page from the Safari menu. This will open your HTML file in your email client and will allow you to send it to multiple addresses (note: there may be a limit placed by your hosting company on the number of emails you can send to at one time - so observe their rules)

Thats all there is to it - no need to use a third party service at all.

When the email is received, it will display your page and a link just in case the content of your page cannot be read by a recipient. You can add some text in front of the link advising people to click the link if they are having problems viewing the email. The link will take them to the page on your server.

Blocsapp uses bootstrap. My understanding is that email HTML should only use vanilla HTML and no frameworks, in which case it will not be usable for email HTML.

Someone tell me if this is wrong.

1 Like

I’ve used pages created in Blocs quite often to send promotional emails and haven’t experienced any major problems. Of course, there may be some email clients that can’t display the content delivered by the server, but for those people, they have a link to click.

Essentially, the email client is simply acting as a web browser so is normally able to display the page regardless of the app or framework used to create it. (at least that’s my understanding of how it works).

The best way to see for yourself is to visit any webpage that you’ve created in Blocs - preferably one with no special features (predominantly text and images) and send it as an email to yourself using Safari’s share option. Then check the email in various email clients and see how it looks. If there is anything out of place it will probably be more to do with the page you chose to test on. However, once you can see that a webpage is deliverable from a blocs created site, it’s relatively easy to create a more simplified HTML page better suited for email. Below is a screenshot of how a blocs webpage displays when delivered to my email client.



** If you want broad support across email clients then the supported HTML & CSS is largely limited compared to a full web based experience. Most email clients block Javascript all together. Email clients are not the same as browsers.

Given the existence of malicious types of mail such as spam, fishing, scam, I bet your not gonna experience the same clickthrough rate with that fallback link compared to what it could be verse creating a proper email correctly.

For the reasons** I outlined above I would advise the opposite, no.

You are correct.

You are, of course correct. However, I think I did make the point that the mail shouldn’t contain fancy elements - just text and images. But to clarify, no animations, no pre-loader, no lazy loading and no elements that rely on javascript. I’ve never had any issues with css or inline styling - almost every formatted email I receive uses styling options of some sort or another, otherwise they wouldn’t display as they do.

When it comes to uploading, you would exclude the js folder altogether and for a real belt and braces approach, you would remove the javascript code from the bottom of the output blocs page in any text or code editor. What you’ll be left with a simple HTML page.

Why not just use MailChimps provided design/editor/templates? They have tons of wonderful resources to fully accommodate your email requirements as part of their entire platform.

I did not suggest that there is an absence of CSS, just that the supported specification of both HTML and CSS is less than that of regular web browsers generally.

But is it simple enough to support the list of all relative modern email clients? Have you tested across a wide range of email clients outside of what Apple offers? There are tools that let you see how your email will look across email clients, MailChimp has one that is discussed here. Stated there its known concerning email clients not being one size fits all regarding what they support.

I commented on this same topical matter (Blocs & Emails) a few years back, Norm even liked the comment. I would guess unless something has changed since, it would remain the case. Another interesting approach would be look at the source of the emails you get regarding the app update releases and the newsletter emails you receive from Blocs. They do not use Blocs output so that may tell people something in and of itself perhaps.

:smile: So not to get too in-depth, but for instance look at this site and note that it uses Bootstrap and how simple the Bootstrap page markup is. Now toggle from preview to “code” view. See how the Bootstrap markup is gone and its now instead a few DIVs and mostly table based with all inline CSS. Thats how they can provide and state “it works in every email client”. You can read more about that tool here.

But that tool offers an example of why would all that rework be needed, if instead you can just use tools like Blocs along with the process you described above and have success across all email clients?

Also have a read through this article, note the section “Tables are still the standard”. This article was from 2007 (I believe) and last updated in June 2020 yet they didn’t remove/update that aspect of the article. Of course DIVs can be used if done properly, but it should be interesting to most that they did not remove/update that section in the article.

Here are a few more relative articles to read.

Have a look at some various email support tables as well.

It should become understandable that emails are still not the same as web pages, email cleint support differs from regular web browsers and even amongst each other. Plus not everyone uses Apple products or Apple email clients, GMAIL is the #1 client yet it itself does not support all the same as some others do.

So @hendon52, please understand I’m not trying to discredit your statements just offering further discussion that it may not be as easy as you have described and people should likewise consider these things. Also I don’t mind being fully corrected if someone wishes to demonstrate otherwise. People are of course free to fully disagree and proceed however they wish. If I stand in error I wish to be informed. :wink:

1 Like