如何在 MailChimp 中使用可变内容?

How to use variable content in MailChimp?

我的代码问题

我在处理 Mailchimp 中的变体内容时遇到了一些问题,我不知道我必须如何编写代码才能实现它。 因此,如果有人编写了一些具有可变内容的功能模板,请向我解释结构或提供示例代码,以便我弄清楚它是如何工作的。

我实际上开始认为它不再可用了,因为即使 MailChimp 提供的示例代码也不起作用!

我已经 copy/past MailChimp 在从 MailChimp 获取的基本模板中给出的示例代码。(我在这里找到它 https://blog.mailchimp.com/working-with-variant-selectors/

(我就不放代码了,真的很长)

当我说它不起作用时,我的意思是我可以编辑、删除或复制块,但我无权访问允许您 select 类型的 drop-down 菜单您要添加的内容。

我知道这篇文章已经有 5 年历史了,所以我可能已经更改了一些内容,但这是我在 Internet 上找到的唯一示例... 在这里你可以找到关于这个的唯一更新信息:http://kb.mailchimp.com/templates/code/create-editable-content-areas-with-mailchimps-template-language#Variable-Content-Area(它不是很可靠)

背后的故事:

我正在为我工​​作的公司编写一份可编辑的时事通讯。

时事通讯将包含很多不同的内容,因此我认为为每种类型的内容使用不同颜色的标题背景会很聪明。 例如,营销内容的标题背景为蓝色,IT 为绿色等等...

问题是将有大约 10 种不同类型的内容,而一份时事通讯中只有 3 或 4 种。 所以我认为在模板中放入 10 个块会有点乱,而实际只使用其中的 3 或 4 个块。

遗憾的是,在不改变原始方块的情况下,不可能复制方块并改变其颜色。

所以我认为编写 10 个不同的变量内容会很棒,这样用户可以选择其中一个,添加它,然后根据需要更改颜色。

Post更新:

刚刚看到关于MailChimp可重复或可变内容的文章是5天前编辑的。我想这个选项仍然有效,如果不是,他们会删除关于可变内容的部分。

此处文章:http://kb.mailchimp.com/templates/basic-and-themes/repeatable-or-variable-content-blocks

感谢您的宝贵时间!

我刚刚创建了一个使用可变内容的自定义模板,在解决了一些问题后,它一切正常。

您需要确保:

  • 每个元素的 mc:repeatable 属性匹配
  • 每个可重复元素彼此完全相邻
  • 每个部分的 mc:edit 都是独一无二的(特别是如果您想更改颜色)

下面是一些对我有用的代码:

<table border="0" cellpadding="0" cellspacing="0" id="templateContainer">
<tr>
    <td align="center" valign="top" class="contentWrapper">
        <!-- BEGIN BODY // -->

        <!-- // Begin Module: Item - no top border with image \ -->
        <table class="bodyContent" border="0" cellpadding="0" cellspacing="0" width="100%" mc:repeatable="siwc_600" mc:variant="content with left image - no top border">
            <tr>
                <td colspan="3" height="30"></td>
            </tr>
            <tr>
                <td align="center" valign="top">
                    <img src="http://gallery.mailchimp.com/653153ae841fd11de66ad181a/images/placeholder_180.gif" style="max-width:180px;" mc:label="image" mc:edit="liwc600_image00"/>
                </td>
                <td width="20"></td>
                <td valign="top">
                    <div mc:edit="liwc600_content00">
                        <h1><a href="#" target="_blank" style="text-decoration:none">Content with no top border</a></h1>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse aliquam risus ligula, at dignissim dui condimentum ac. Proin a tortor id eros molestie pretium sit amet
                        at eros. Vivamus faucibus mauris ullamcorper arcu dignissim feugiat.<br/><br/><a href="#" target="_blank" style="font-weight:bold; text-decoration:none">Read more</a>
                    </div>
                </td>
            </tr>
            <tr>
                <td colspan="3" height="30"></td>
            </tr>
        </table>
        <!-- // End Module: Item - no top border with image \ -->

        <!-- // Begin Module: Item - no top border witout image  \ -->
        <table class="bodyContent" border="0" cellpadding="0" cellspacing="0" width="100%" mc:repeatable="siwc_600" mc:variant="content with no image - no top border">
            <tr>
                <td height="30"></td>
            </tr>
            <tr>
                <td valign="top">
                    <div mc:edit="riwc600_content00">
                        <h1><a href="#" target="_blank" style="text-decoration:none">Content with no top border</a></h1>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse aliquam risus ligula, at dignissim dui condimentum ac. Proin a tortor id eros molestie pretium sit amet
                        at eros. Vivamus faucibus mauris ullamcorper arcu dignissim feugiat. Mauris sagittis est diam, et congue erat varius vel. Integer iaculis pharetra sapien, sed varius metus
                        blandit nec.<br/><br/><a href="#" target="_blank" style="font-weight:bold; text-decoration:none">Read more</a>
                    </div>
                </td>
            </tr>
            <tr>
                <td height="30"></td>
            </tr>
        </table>
        <!-- // End Module: Item - no top border without image \ -->

        <!-- // Begin Module: Left Image with Content \ -->
        <table class="bodyContent" border="0" cellpadding="0" cellspacing="0" width="100%"
               mc:repeatable="siwc_600" mc:variant="content with left image">
            <tr>
                <td colspan="3" height="2" bgcolor="#ededed"></td>
            </tr>
            <tr>
                <td colspan="3" height="30"></td>
            </tr>
            <tr>
                <td align="center" valign="top">
                    <img src="http://gallery.mailchimp.com/653153ae841fd11de66ad181a/images/placeholder_180.gif" style="max-width:180px;" mc:label="image" mc:edit="liwc600_image00"/>
                </td>
                <td width="20"></td>
                <td valign="top">
                    <div mc:edit="liwc600_content01">
                        <h1><a href="#" target="_blank" style="text-decoration:none">Standard content with border</a></h1>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse aliquam risus ligula, at dignissim dui condimentum ac. Proin a tortor id eros molestie pretium sit amet
                        at eros. Vivamus faucibus mauris ullamcorper arcu dignissim feugiat. Mauris sagittis est diam, et congue erat varius vel. Integer iaculis pharetra sapien, sed varius metus
                        blandit nec.<br/><br/><a href="#" target="_blank" style="font-weight:bold; text-decoration:none">Read more</a>
                    </div>
                </td>
            </tr>
            <tr>
                <td colspan="3" height="30"></td>
            </tr>
        </table>
        <!-- // End Module: Left Image with Content \ -->

        <!-- // END BODY -->
    </td>
</tr>