如何在 WordPress 中自定义 Subscribe2 按钮的外观？

Question

我是 WordPress 的新手，没有 PHP 或 CSS 经验...

我想在我的博客中使用Subscribe2 插件，以及iNove 主题。当我添加小部件时，订阅/取消订阅按钮以“经典”方式呈现，这使得页面非常难看（博客位于：http://www.adlerr.com）

如何自定义按钮的外观？如果我得到正确的指示，我已经准备好编写一些 PHP/CSS...

输出按钮的代码在这里：

$this->form = "<form method=\"post\" action=\"\"><p>" . __('Your email:', 'subscribe2') 
. "<input type=\"text\" name=\"email\" value=\"" . __('Enter email address...', 
'subscribe2') . "\" size=\"20\" onfocus=\"if (this.value == '" . __('Enter email     
address...', 'subscribe2') . "') {this.value = '';}\" onblur=\"if (this.value == '')     
{this.value = '" . __('Enter email address...', 'subscribe2') . "';}\" /></p><p><input 
type=\"submit\" class=\"button\" name=\"subscribe\" value=\"" . __('Subscribe', 
'subscribe2') . "\" />&nbsp;<input type=\"submit\" class=\"button\" name=\"unsubscribe\" 
value=\"" . __('Unsubscribe', 'subscribe2') . "\" /></p></form>\r\n";

还有一些按钮会正确定位here：右下角，“提交评论”按钮，即“按钮”类：

生成提交评论按钮的代码是：

<input name="submit" type="submit" id="submit" class="button" tabindex="5" 
value="<?php _e('Submit Comment', 'inove'); ?>" />

我应该怎么做才能使订阅/取消订阅按钮看起来像“提交评论”按钮？

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

Answer 1

无样式按钮和有样式按钮的区别在于，无样式按钮没有 class="button" 的属性。

您应该能够登录到 WP，点击插件，点击订阅 2 插件上的编辑，然后找到输入类型=提交按钮的位置，并向其中添加 class="button"。

<input type="submit" class="button" value="Subscribe" name="subscribe"/>
<input type="submit" class="button" value="Unsubscribe" name="unsubscribe"/>

编辑：在您的 css 文件中，您需要创建一个名为 button 的类：

.button {
  background-color: #e0ffff;
  color: #ffffff;
}

您需要将这些值更改/添加到适合您的内容。您可以了解更多关于css at w3schools 的信息。您可能需要查看背景、文本、字体和框模型。

好的，这次我明白了！

将 style.css 中的第 949 行更改为：

#submitbox #submit, .button {

将 style.css 中的第 960 行更改为：

#submitbox #submit:hover, .button:hover {