Question

第一次发帖所以请原谅我，如果我有点生疏了。我不是一个真正的编码人员，而是在entirebuyer.com

为我的wordpress网站提供了一些代码（css）

我遇到的问题是我已经将标题设置为Josefin Sans，但是我为＃34;页面上的小部件添加了自定义CSS＆＃34;插件设置为Raleway，它正在改变网站的格式（特别是标题）。我错过了</div>或者其他什么，或者是代码裤子？我还想知道如何删除电子邮件字段中较暗的边框 - 使其与文本字段保持一致。非常感谢您的帮助。

这是我从Wordpress版本修改的代码：

<!-- Begin MailChimp Signup Form -->
<div id="mailchimp">
<form action="//entirebuyer.us8.list-manage.com/subscribe/post?u=5fd2f295964c6123cd956b17a&amp;id=9d81aec625" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>

<input type="text" size="30" value="Enter Name" name="FNAME" class="name" id="mce-FNAME" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;">
<input type="email" size="30" value="Enter Email" name="EMAIL" class="required email" id="mce-EMAIL" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;">

<div id="mce-responses" class="clear">
<div class="response" id="mce-error-response" style="display:none"></div>
<div class="response" id="mce-success-response" style="display:none"></div>
</div>    <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
<div style="position: absolute; left: -5000px;"><input type="text" name="b_5fd2f295964c6123cd956b17a_9d81aec625" tabindex="-1" value=""></div>
<div class="mailchimp-button"><input type="submit" value="SEND ME £20" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
</div></div>
</form>
</div>
<!--End mc_embed_signup-->

这是我在主题中添加到** CUSTOM CSS 中的代码：**

.mailchimp-button{ text-align: center; }

#mailchimp {
background: none;
color: #282828;
padding: 0px 0px;
    text-align: center;
}


#mailchimp input[type="submit"] {
background: #333333;
font-family: Josefin Sans, Raleway;
font-size: 16px;
font-weight: 600;
color: #fff;
cursor: pointer;z
text-align: center;
width: 100px;
padding: 10px 10px;
border: none;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
}


#mailchimp input[type="submit"]:hover { background: #171717
}

#mailchimp input[type="text"] {
font-family: Josefin Sans, Raleway;
font-size: 16px;color: #8c8989;
margin-bottom: 10px;
padding: 10px 10px;
width: 200px;
border-radius: 10px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
}       

#mailchimp input[type="email"] {
font-family: Josefin Sans, Raleway;
font-size: 16px;
color: #8c8989;
margin-bottom: 10px;
padding: 10px 10px;
width: 200px;
border-radius: 0px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
}}

非常感谢您的帮助。感谢!!!

Answer 1

由于您所需的字体名称中有空格，您需要用引号括起来，如下所示：

#mailchimp input[type="text"] {
    font-family: 'Josefin Sans', Raleway;
}

如果没有引号，浏览器会尝试（不成功）查找名为＆＃39; Josefin＆＃39;或者＆＃39; Sans＆＃39;，因此回退到下一个正确指定的字体，在这种情况下是Raleway。

Answer 2

试试这个插件，它不应该破坏任何小部件的任何风格。

https://wordpress.org/plugins/widget-to-shortcode/

Wordpress＆＃34;页面上的小部件＆＃34;用＆＃34; Mailchimp Form＆＃34; - 造型问题

2 个答案: