javascript - 如何将 CSS 添加到我的 `mailchimp` 弹出表单？

Question

我正在使用 mailchimps 弹出式订阅表单。我尽可能地设计了 mailchimp 中的内容。我想在弹出窗口中添加更多 CSS，我已尝试将 CSS 添加到已加载到我网站中的 CSS 工作表，但即使使用 !important 等，表单也不会在弹出窗口中选取它。

mailchimp 的代码是:

<script type="text/javascript" src="//s3.amazonaws.com/downloads.mailchimp.com/js/signup-forms/popup/embed.js" data-dojo-config="usePlainJson: true, isDebug: false"></script>
<script type="text/javascript">require(["mojo/signup-forms/Loader"], function(L) { L.start({"baseUrl":"mc.us8.list-manage.com","uuid":"731f7bb19522a201007a53699","lid":"138afe0d12"}) })</script>

现在，我也尝试在我的页面中添加内联样式进行测试，例如:

<style>
    #mc-EMAIL {
        border:6px solid pink !important;
    }
</style>

我注意到我的 mailchimp 样式来自 this但是 mailchimp 说我无权更改此 CSS 文件。

我确信其他人一定在我面前遇到过我的总体问题:

如何将 CSS 添加到我的 mailchimp 弹出表单？

Answer 1

是不是 Mailchimp 弹出窗口出现了 <iframe>标签？ 如果是，我认为您不能直接使用 css 对其进行自定义。

<强>1。将您的 css 注入(inject) iframe通过 js.

How to Apply CSS to iFrame

<强>2。更改为使用 mailchimp API 与您的自定义弹出窗口 html/css 集成。 它可能需要付出很多努力，但易于维护。 (可以问我)

Mailchimp API DOC

MailChimp API 3.0 and WordPress HTTP API

祝你好运。