A few weeks ago, we reported that Gmail was experimenting with a brand new, Pinterest-like design for its Promotions tab.
由于图像繁重的设计是如此新，而且我们还没能访问它，所以除了“即将到来”之外，我们对此几乎没有什么要说的。几天前我很幸运enough to be granted beta access (boy did I feel special)!
(If you missed the initial announcement or you just need to jog your memory, you can在此处查看有关新功能的最初帖子。)
当我意识到我们的博客的订户电子邮件以这种新格式的外观时，我的特殊感使我感到完整180。
看到那个小家伙在右下角喊了出来吗？那是我们的博客订户电子邮件。嗯... YUCK。
现在这似乎不是一笔巨大的交易，因为只有某些Beta用户才能访问此功能（你can request your own access here). But once Gmail rolls it out to all, surely you'll want your email to be optimized for the new design.
关于我们的电子邮件的外观，必须做些事情，因此我戴上了侦探帽，并咨询了HubSpot产品开发人员，我们如何使我们的电子邮件看起来像Etsy，Crate＆Barrel，Joss＆Main和Main和Main和在这种新布局中畜牧业。（请注意，Groupon和Vistaprint ...）
如何控制Gmail的促销选项卡中显示了什么图像
While Gmail uses an algorithm that tries to determine the most relevant image from your email to display, if it can't find one it likes, your email will likely be shown with some icky alt text instead of an image -- like ours looks in the screenshot above. And even if Gmail做find an image it likes, it might not be the image你want to feature.
Luckily, if you implementGmail的标记并且只有一点点的HTML Savviness，只要您可以访问电子邮件的HTML，就可以轻松控制您的电子邮件中出现的图像。大多数电子邮件服务提供商应该是这种情况，including HubSpot's Email tool。
在开始之前，请确保您选择的任何图像至少是580 pixels x 400 pixels。Gmail将调整较大图像的大小，但是较小的图像必须是at leastthese dimensions to get featured.
在电子邮件模板级别上指定图像
Any email platform that provides customizable token-based templates (including HubSpot) allows you to use a token as an image URL parameter. That way, you can add Gmail's HTML markup to your电子邮件模板。这对于自动生成和经常发送的博客订户电子邮件之类的电子邮件非常有用。请记住，在模板级别上指定图像将意味着使用该模板发送的每个电子邮件都会在Gmail的促销选项卡中显示同一图像 - 除非您将其覆盖在单个发送中（一分钟内详细介绍）。
Setup on the template level will differ depending on what email platform you're using, but to give you a sense of how simple it is, this is how you'd do it in HubSpot's Email tool:
1）将新的HTML模块添加到您的电子邮件模板中。
不用担心。您在此处放置的代码将被隐藏在实际电子邮件中，因此您不必担心在电子邮件正文中出现的代码。(Click below image to enlarge.)
2) Copy and paste Gmail's HTML markup into your module and replace the image URL (highlighted in red below) with the URL of the image you want to display.
(HubSpot Users: Make sure to check "Allow the default contents of this module to be overridden by the content editor" so you can change what image gets featured in individual emails using this template moving forward. Again, we'll cover that shortly.)
ItemScope物品种类=“http://schema.org/Offer">
itemprop=“image"HREF=“http://www.example.com/product_image.jpg“/>
Designating Images on the Individual Email Level
为一次性定制图像显示什么email sends, set up your email template like you did above by adding a new HTML module with the Gmail markup. Then, if you want to control what image gets displayed for an individual email, in that email's editor, simply replace the image URL that's already in your template with the one you want to be featured.(If you use HubSpot, because you initially enabled your template to "Allow the default contents of this module to be overridden by the content editor," you'll be able to designate a new image for that email send specifically.)
Remember how ugly our email looked in the Promotions tab before? Here's how it looks now ...
Aaah ... much better. And it looks like we need to add Domino's to the list of companies to share this post with ;-)
How to Control What Logo Shows Up in Gmail's Promotions Tab
Gmail还将自动在Gmail Promotions选项卡中在您公司的Google+页面上使用徽标 - 只要您启用了Gobob全站appogle+相关页面窗口小部件即可。查看上面电子邮件的屏幕截图还包括HubSpot链轮徽标吗？那是因为它是我们使用的徽标集线器's Google+ Page。当您单击电子邮件本身时，您可以在右侧看到与Google+相关的小部件。
To enable this for your emails,follow the instructions on Google's support page here。
如何优化发件人名称和主题行
The last couple steps to making sure your emails display nicely in Gmail's Promotions tab are to optimize your email's sender name and subject line. Here are Gmail's guidelines:
- Sender Name:20个字符或更少以避免截断
- Subject Line:75个字符或更少以避免截断
就是这样！请按照这些准则在Gmail Promotions选项卡中获取精美优化的电子邮件，您将不错。
Originally published Apr 7, 2014 11:00:00 AM, updated June 10 2021