Mailchimp mc:repeatable & mc:variant 未按预期工作
Posted
技术标签:
【中文标题】Mailchimp mc:repeatable & mc:variant 未按预期工作【英文标题】：Mailchimp mc:repeatable & mc:variant not working as expected 【发布时间】：2021-03-21 23:54:24 【问题描述】：我一直在尝试让我在 mailchimp 中的自定义电子邮件模板与他们的构建块一起使用。 一直在做文档所说的，但我似乎无法让它工作。
我使用 mc:repeatable="content" 和 mc:variant="random name" 我唯一能做的就是添加一个块或删除一个块。我不能移动他们做另一个我想添加的选择女巫块的地方。
我会怎么做，所以我可以选择我想添加到哪里的女巫块？
这是我一直在使用的代码。一些帮助是受欢迎的，现在试着把我的脑袋绕在这个问题上。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no;">
<meta http-equiv="x-ua-compatible" content="IE=9; IE=8; IE=7; IE=EDGE">
<title>Mailchimp test</title>
<!--[if gte mso 9]>
<style>
/* Target Outlook 2007 and 2010 */
</style>
<![endif]-->
<style type="text/css">
#outlook a
padding:0;
.ExternalClass
width:100%;
.ExternalClass,.ExternalClass p,.ExternalClass span,.ExternalClass font,.ExternalClass td,.ExternalClass div
line-height:100%;
p
margin:0;
padding:0;
font-size:0;
line-height:0;
table td
border-collapse:collapse;
table
border-collapse:collapse;
mso-table-lspace:0;
mso-table-rspace:0;
img
display:block;
outline:none;
text-decoration:none;
-ms-interpolation-mode:bicubic;
a img
border:none;
a
text-decoration:none;
color:inherit;
a.phone
text-decoration:none;
color:#000001 !important;
pointer-events:auto;
cursor:default;
span
font-size:13px;
line-height:17px;
font-family:monospace;
color:#000001;
.show-mobile
display:none !important;
.btn-gold a,.black-anchor a
color:#000000 !important;
.btn-black a,.white-anchor a
color:#ffffff !important;
img
max-width:100%;
height:auto;
@media screen and (max-width: 583px)
.mobile-logo
width:130px !important;
height:35px !important;
@media screen and (max-width: 583px)
.mobile-sign
width:39px !important;
height:40px !important;
@media screen and (max-width: 583px)
.mobile-container-full
width:92% !important;
@media screen and (max-width: 583px)
.mobile-width-full
width:100% !important;
@media screen and (max-width: 583px)
.mobile-block-intro-text-padding
height:30px !important;
@media screen and (max-width: 583px)
.mobile-row
width:100% !important;
display:block !important;
@media screen and (max-width: 583px)
.show-mobile
display:block !important;
@media screen and (max-width: 583px)
.mobile-background-hide-mobile
background:none !important;
@media screen and (max-width: 583px)
.mobile-full-img img
width:100% !important;
height:auto !important;
max-width:100% !important;
</style></head>
<body style="width:100%; margin:0; padding:0; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%;">
<!--*|IF:MC_PREVIEW_TEXT|*-->
<!--[if !gte mso 9]><!--><span class="mcnPreviewText" style="display:none; font-size:0px; line-height:0px; max-height:0px; max-width:0px; opacity:0; overflow:hidden; visibility:hidden; mso-hide:all;">*|MC_PREVIEW_TEXT|*</span>
<!--<![endif]-->
<!--*|END:IF|*-->
<!-- page wrapper -->
<table cellpadding="0" cellspacing="0" border="0" style="margin:0;padding:0;width:100%;line-height:100% !important;">
<tr>
<td valign="top">
<!-- content wrapper -->
<table cellpadding="0" cellspacing="0" border="0" align="center" class="mobile-container-full">
<!-- Building blocks -->
<tr>
<td valign="top" align="left">
<table cellpadding="0" cellspacing="0" border="0" align="center" >
<!-- block intro text -->
<tr mc:repeatable="content" mc:variant="intro text - white background">
<td valign="top" align="left" bgcolor="#ffffff">
<table cellpadding="0" cellspacing="0" border="0" align="center" class="mobile-width-full">
<tr>
<td valign="top" align="left" class="mobile-block-intro-text-padding" style="height:45px;font-size:1px;line-height:1px;"></td>
</tr>
<tr>
<td valign="top" align="left">
<table cellpadding="0" cellspacing="0" border="0" align="center" >
<tr>
<td align="left" valign="top" style="width:30px;font-size:1px;line-height:1px;"></td>
<td align="left" valign="top">
<table cellpadding="0" cellspacing="0" border="0" align="center" >
<tr>
<td valign="top" align="center">
<span style="font-family:Arial, sans-serif;font-size:16px;line-height:20px;color:#C89619;text-transform:uppercase;" mc:edit="intro_text_title">Lorep Ipsum 1</span>
</td>
</tr>
<tr>
<td valign="top" align="center" style="height:16px;font-size:1px;line-height:1px;"></td>
</tr>
<tr>
<td valign="top" align="center">
<span style="font-family:Arial, sans-serif;font-size:12px;line-height:20px;color:#000000;" mc:edit="intro_text_text">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</span>
</td>
</tr>
<tr>
<td valign="top" align="left" style="height:20px;font-size:1px;line-height:1px;"></td>
</tr>
<tr>
<td align="left">
<!-- button -->
<table cellpadding="0" cellspacing="0" border="0" align="center" bgcolor="#C89619" class="mobile-width-full btn-gold">
<tr>
<td align="left" valign="top" style="width:15px;font-size:1px;line-height:1px;"></td>
<td align="left" valign="top">
<table cellpadding="0" cellspacing="0" border="0" align="center">
<tr>
<td valign="top" align="left" style="height:12px;font-size:1px;line-height:1px;"></td>
</tr>
<tr>
<td>
<table cellpadding="0" cellspacing="0" border="0" align="center">
<tr>
<td valign="middle" align="center">
<strong class="black-anchor" style="font-family:Arial, sans-serif;font-size:12px;color:#000000 !important;font-weight:bold;text-decoration:none;" mc:edit="intro_text_link">
Read more
</strong>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td valign="top" align="left" style="height:12px;font-size:1px;line-height:1px;"></td>
</tr>
</table>
</td>
<td align="left" valign="top" style="width:15px;font-size:1px;line-height:1px;"></td>
</tr>
</table>
<!-- end button -->
</td>
</tr>
</table>
</td>
<td align="left" valign="top" style="width:30px;font-size:1px;line-height:1px;"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td valign="top" align="left" class="mobile-block-intro-text-padding" style="height:45px;font-size:1px;line-height:1px;"></td>
</tr>
</table>
</td>
</tr>
<!-- end block intro text -->
<!-- block intro text -->
<tr mc:repeatable="content" mc:variant="intro text - black background">
<td valign="top" align="left" bgcolor="#000000">
<table cellpadding="0" cellspacing="0" border="0" align="center" class="mobile-width-full">
<tr>
<td valign="top" align="left" class="mobile-block-intro-text-padding" style="height:45px;font-size:1px;line-height:1px;"></td>
</tr>
<tr>
<td valign="top" align="left">
<table cellpadding="0" cellspacing="0" border="0" align="center" >
<tr>
<td align="left" valign="top" style="width:30px;font-size:1px;line-height:1px;"></td>
<td align="left" valign="top">
<table cellpadding="0" cellspacing="0" border="0" align="center" >
<tr>
<td valign="top" align="center">
<span style="font-family:Arial, sans-serif;font-size:16px;line-height:20px;color:#C89619;text-transform:uppercase;" mc:edit="intro_text_black_title">Lorem Ipsum 2</span>
</td>
</tr>
<tr>
<td valign="top" align="center" style="height:16px;font-size:1px;line-height:1px;"></td>
</tr>
<tr>
<td valign="top" align="center">
<span style="font-family:Arial, sans-serif;font-size:12px;line-height:20px;color:#ffffff;" mc:edit="intro_text_black_content">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</span>
</td>
</tr>
<tr>
<td valign="top" align="left" style="height:20px;font-size:1px;line-height:1px;"></td>
</tr>
<tr>
<td align="left">
<!-- button -->
<table cellpadding="0" cellspacing="0" border="0" align="center" bgcolor="#C89619" class="mobile-width-full btn-gold">
<tr>
<td align="left" valign="top" style="width:15px;font-size:1px;line-height:1px;"></td>
<td align="left" valign="top">
<table cellpadding="0" cellspacing="0" border="0" align="center">
<tr>
<td valign="top" align="left" style="height:12px;font-size:1px;line-height:1px;"></td>
</tr>
<tr>
<td>
<table cellpadding="0" cellspacing="0" border="0" align="center">
<tr>
<td align="center">
<strong class="black-anchor" style="font-family:Arial, sans-serif;font-size:12px;color:#000000 !important;font-weight:bold;text-decoration:none;" mc:edit="intro_text_black_link">Read more</strong>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td valign="top" align="left" style="height:12px;font-size:1px;line-height:1px;"></td>
</tr>
</table>
</td>
<td align="left" valign="top" style="width:15px;font-size:1px;line-height:1px;"></td>
</tr>
</table>
<!-- end button -->
</td>
</tr>
</table>
</td>
<td align="left" valign="top" style="width:30px;font-size:1px;line-height:1px;"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td valign="top" align="left" class="mobile-block-intro-text-padding" style="height:45px;font-size:1px;line-height:1px;"></td>
</tr>
</table>
</td>
</tr>
<!-- end block intro text -->
</table>
</td>
</tr>
<!-- / Building blocks -->
</table>
<!-- / content wrapper -->
</td>
</tr>
</table>
<!-- / page wrapper -->
</body>
</html>
【问题讨论】：
如果您edit 您的问题并将该代码减少为minimal reproducible example 并清楚地描述问题所在，您可能有更好的机会获得答案......“不工作”没有帮助。会发生什么，您期望会发生什么？有什么错误吗？另见How to Ask。 【参考方案1】：Mailchimp 文档说“自定义编码的电子邮件模板不包括拖放内容块。使用 Mailchimp 的模板语言将可编辑区域添加到自定义编码的电子邮件中。” (https://mailchimp.com/help/about-content-blocks/)
因此，您的体验似乎符合预期：“我唯一能做的就是添加或删除一个块。我无法将它们移动到另一个地方......”
模板语言表明mc:repeatable 和mc:variant 可以一起使用来打开和关闭“变体”——就像您已经做过和体验过的一样。 (https://templates.mailchimp.com/getting-started/template-language/)
总而言之，您的期望是错误的，您可以随意移动积木。该行为仅适用于 MailChimp 的模板。
【讨论】：
您好，感谢您的评论。我们曾经有一个模板可以做到这一点，但这似乎不再适用。我期待的是这样的：(mailchimp.com/help/repeatable-or-variable-content-blocks/…) 正如这里所解释的，应该有一个选项来显示下拉菜单并选择您想要的内容类型。离开一个指示器来改变位置。 我建议联系 MailChimp 客户服务；这可能与他们的新建筑商有关，这与他们现在所说的“经典建筑商”不同？ IE。他们最近可能改变了一些事情【参考方案2】：您绝对可以创建可在自定义模板中重新定位的可重复内容块。来自 Mailchimp 的文档...
如果您编写自己的电子邮件模板，则可以使用 Mailchimp 的模板语言将可重复和可变的内容块添加到您的布局中。这些块可帮助您创建可在 Campaign Builder 中修改的定制设计。即使其他人构建了您的模板，您仍然可以重复、删除、重新定位和编辑内容块。'
位置箭头显示在每个布局变体的左边缘，因此您可以将它们垂直拖放到适当位置。您不能在布局变体中定位元素。
Check out the screenshot for visual reference.
确实发生了一件很奇怪的事情，并且很可能是您的示例的情况，即只有添加三个以上的块时，块才能定位。
https://mailchimp.com/help/repeatable-or-variable-content-blocks/
【讨论】：
您好，谢谢您的回复！问题是我没有看到下拉列表，我什至联系了 mailchimp 的支持，但他们不明白为什么。正如你在这里看到的：ibb.co/Ws7QWVs以上是关于Mailchimp mc:repeatable & mc:variant 未按预期工作的主要内容，如果未能解决你的问题，请参考以下文章
MailChimp API DrewM\MailChimp\MailChimp::call() 调用未定义的方法