react和react2_如何通过WordPress中的后React吸引读者

react和react2

Are you looking to increase the user engagement of your site? Post reactions are an easy way for your readers to leave feedback on your blog without leaving a comment. In this article, we will show you how to add post reactions in WordPress.

您是否想增加网站的用户参与度？ 帖子回复是读者在博客上留下反馈而不发表评论的一种简便方法。 在本文中，我们将向您展示如何在WordPress中添加帖子响应。

Reactions is a feature in the Blogger platform that allowed your visitors an easy and anonymous way to provide feedback on your posts without leaving a comment. When one of our users switched from Blogger to WordPress, they asked us if there was a way to replicate that functionality in WordPress.

Responses是Blogger平台中的一项功能，可让访问者以一种简单且匿名的方式在不发表评论的情况下提供对您的帖子的反馈。 当我们的一个用户从Blogger切换到WordPress时 ，他们问我们是否有办法在WordPress中复制该功能。

Luckily there is a plugin for that.

幸运的是有一个插件。

影片教学 (Video Tutorial)

演示地址

If you don’t like the video or need more instructions, then continue reading.

如果您不喜欢该视频或需要更多说明，请继续阅读。

First thing you need to do is install and activate the Reaction Buttons plugin. Upon activation, you need to visit Settings » Reaction Buttons to configure the plugin settings.

您需要做的第一件事是安装并激活“ Reaction Buttons”插件。 激活后，您需要访问设置»React按钮来配置插件设置。

The first option on the screen is to show reaction buttons, and you want to make sure that it is checked. If you leave it unchecked, then reaction buttons will not be displayed on your site even if the plugin is active.

屏幕上的第一个选项是显示React按钮，并且您要确保已选中它。 如果您取消选中它，那么即使该插件处于活动状态，React按钮也不会显示在您的站点上。

Next, you have the option to choose where you want the buttons to appear. The default option is below the posts.

接下来，您可以选择要在何处显示按钮。 默认选项在帖子下方。

You can also customize the text that would appear before the buttons along with the button labels. The default buttons are Awesome, Interesting, Useful, Boring, Sucks.

您还可以自定义出现在按钮前面的文本以及按钮标签。 默认按钮是“真棒”，“有趣”，“有用”，“无聊”，“糟透了”。

Among other settings, you can decide which WordPress pages the button appears on, restrict one vote per user, exclude categories, and more.

在其他设置中，您可以决定按钮显示在哪个WordPress页面上，限制每位用户一票，排除类别等等。

自定义React按钮的外观 (Customizing The Appearance of Reaction Buttons)

Even though these buttons are pre-styled, it may not match your site’s color scheme. If you want to customize their appearance, then first you must disable the plugin’s default CSS.

即使这些按钮是预先设置的样式，也可能与您的网站的配色不匹配。 如果要自定义外观，则必须先禁用插件的默认CSS。

You can do that on the plugin’s settings page.

您可以在插件的设置页面上执行此操作。

Below the checkbox, you will see the link to the plugin’s reaction_buttons.css stylesheet. Click on that link to copy the elements you have to customize.

下面的复选框，你会看到链接到插件的reaction_buttons.css样式表。 单击该链接以复制您必须自定义的元素。

Next all you have to do is copy and paste your customized CSS in to your theme or child theme’s stylesheet.

接下来，您要做的就是将自定义CSS复制并粘贴到主题或子主题的样式表中。

Here is a sample CSS that we used to add custom background color to the buttons.

这是一个示例CSS，用于将自定义背景色添加到按钮。

/* the reaction buttons region */
div.reaction_buttons{
    margin-top: 20px;
    font-size: 0.8em;
    text-align: left;
}

/* a single button */
div.reaction_buttons .reaction_button {
    line-height: 3.2em;
    padding: 5px;
    margin: 0 3px;
    margin-bottom: 25px;
    cursor: pointer;
background-color:#007fba;
color:#FFF;
}

/* the button while hovering over it */
div.reaction_buttons > .reaction_button:hover {
    background-color: #0F6;
}

/* the button after voting 
div.reaction_buttons > .voted, div.reaction_buttons > .voted:hover {
}
 /*

/* number of votes including parantheses.
.reaction_buttons .reaction_button .count {
}
 */

/* number of votes in between the parantheses.
.reaction_buttons .reaction_button .count_number {
}
 */
 
 
#sidebar div.widget_reaction_buttons h3 {
	margin: 0;
	margin-top: 4px;
	font-size: 1.1em;
}

#sidebar div.widget_reaction_buttons ol {
	margin-left: 25px;
}

This is how the buttons looked on our test site:

这是测试站点上按钮的外观：

We hope this article helped you learn how to add post reactions in your WordPress blog to boost your engagement.

我们希望本文能帮助您学习如何在WordPress博客中添加帖子反馈，以提高您的参与度。

You may also want to check out this tutorial on how to notify users when their comment is approved in WordPress.

您可能还想查看有关如何在WordPress中批准用户评论时通知用户的本教程。

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Google+.

如果您喜欢这篇文章，请订阅我们的YouTube频道 WordPress视频教程。 您也可以在Twitter和Google+上找到我们。

翻译自: https://www.wpbeginner.com/plugins/how-to-engage-readers-with-post-reactions-in-wordpress/

react和react2