wordpress文章赞赏插件imwptip
在wordpress插件应用商店,搜索添加imwptip插件后在配置页面上传微信与支付宝的收款二维码,该插件基本不影响wp文章的加载,当然也可以自己编辑主题文件实现。
安装后的插件路径:网站目录/wp-content/plugins/imwptip/
如果觉得该赞赏插件不够美观,可以自己对该赞赏插件进行个性化的样式修改。
修改样式文件:wp-content/plugins/imwptip/assets/imwptip.min.css
#imwp_tip{position:relative;display:block;margin:100px auto 5px;text-align:center;font-size:18px;line-height:60px;z-index:1;width:60px;height:60px;color:#fff;border-radius:45px;background:#bf2c24;letter-spacing:5px;text-indent:5px;cursor:pointer;transition:color .3s,background-color .3s}#imwp_tip:hover{background:#ED4259}#imwp_tip:hover #dot_bottom,#imwp_tip:hover #dot_bottom_top,#imwp_tip:hover #imwp_tip_content{display:block}p#imwp_tip_content{margin:0!important;z-index:1;position:absolute;width:450px;top:-266px;left:-180px;display:none;background:#fff;box-shadow:0 0 10px #ccc;border:1px solid #ccc;border-radius:5px}p#imwp_tip_content .imwp_img{width:220px;height:250px;float:left;font-size:14px;text-align:center;line-height:1em;color:#333}p#imwp_tip_content img{width:200px;height:200px;padding:10px}#dot_bottom,#dot_bottom_top{display:none;position:absolute;z-index:3;top:-15px;left:20px;letter-spacing:0;font-size:0;line-height:0;border-style:solid dashed dashed dashed;border-width:10px;border-color:#ccc transparent transparent transparent;width:0;height:0}#dot_bottom_top{border-width:9px;z-index:20;border-color:#fff transparent transparent transparent;left:21px}
#content-ds {
display: flex;
align-items: center;
justify-content: center;
flex-flow: column;
margin-top: 5px;
}
修改文章中赞赏布局页面:wp-content/plugins/imwptip/classes/imwptip.php
<?php
/**
* admin options
*/
class IMWPTip extends IMWPbase
{
/**
* theme admin
* @var object
*/
protected $tipAdmin;
protected $options;
public function __construct()
{
add_action('admin_menu', array(&$this,'addMenu'));
add_action('the_content', array(&$this, 'addTipsToContent'), 99, 1);
wp_enqueue_style('imwptip', plugin_dir_url(dirname(__FILE__)) .'/assets/imwptip.min.css');
}
/**
* add menus
*/
public function addMenu()
{
$tipAdmin = $this->loadTipAdmin();
$this->options = $tipAdmin->getOption();
add_menu_page('imwptip设置', 'imwptip设置', 'manage_options', 'imwptip', array(&$this,'imwptip'));
if ($this->options['allow_user_qrcode'] == 1) {
if($role = $this->options['allow_userrole']) {
$cap = get_role($role);
$cap = array_pop(array_keys($cap->capabilities));
add_menu_page('打赏设置', '打赏设置', $cap, 'usertip', array(&$this,'usertip'));
}
}
}
/**
* imwptip options
* @return
*/
public function imwptip()
{
if (isset($_POST['allow_user_qrcode'])) {
$tipAdmin = $this->loadTipAdmin();
$tipAdmin->saveOptions();
$this->options = $tipAdmin->getOption();
}
$roles = array_keys(get_editable_roles());
$roles = array_combine($roles, $roles);
$formData = array(
array(
'label' => '默认支付宝赞赏二维码',
'name' => 'alipay_qrcode',
'type' => 'image',
'value' => $this->options['alipay_qrcode'],
'desc' => '上传支付宝支付二维码',
),
array(
'label' => '默认微信赞赏二维码',
'name' => 'wxpay_qrcode',
'type' => 'image',
'value' => $this->options['wxpay_qrcode'],
'desc' => '上传微信支付二维码',
),
array(
'label' => '允许用户设定二维码',
'name' => 'allow_user_qrcode',
'type' => 'select',
'options' => array(
0 => '不允许',
1 => '允许',
),
'value' => $this->options['allow_user_qrcode'],
'desc' => '允许用户在自己的控制面板中设定二维码',
),
array(
'label' => '允许角色',
'name' => 'allow_userrole',
'type' => 'select',
'options' => $roles,
'value' => $this->options['allow_userrole'],
'desc' => '允许权限高于选择的角色设定二维码',
),
array(
'label' => '保存',
'name' => 'submit',
'type' => 'submit',
)
);
$tpldata['form'] = $this->getTableForm($formData);
$this->display('imwptip.php', $tpldata);
}
/**
* user tips page
* @return
*/
public function usertip()
{
$tipAdmin = $this->loadTipAdmin();
if (isset($_POST['allow_user_qrcode'])) {
$tipAdmin->saveUserOption();
}
$options = $tipAdmin->getUserOption();
$formData = array(
array(
'label' => '支付宝打赏二维码',
'name' => 'alipay_qrcode',
'type' => 'image',
'value' => $options['alipay_qrcode'],
'desc' => '上传支付宝支付二维码',
),
array(
'label' => '微信打赏二维码',
'name' => 'wxpay_qrcode',
'type' => 'image',
'value' => $options['wxpay_qrcode'],
'desc' => '上传微信支付二维码',
),
array(
'label' => '允许用户设定二维码',
'name' => 'allow_user_qrcode',
'type' => 'hidden',
'value' => 1,
),
array(
'label' => '保存',
'name' => 'submit',
'type' => 'submit',
)
);
$tpldata['form'] = $this->getTableForm($formData);
$this->display('imwptip.php', $tpldata);
}
/**
* add tips to post content
*/
public function addTipsToContent($content)
{
if (!is_singular()) {
return $content;
}
$options = get_option('imwptip');
if ($options['allow_user_qrcode'] == 1) {
global $authordata;
$meta = json_decode(get_user_meta($authordata->ID, 'imwptip', true), true);
if (isset($meta['alipay_qrcode'])) {
$options['alipay_qrcode'] = $meta['alipay_qrcode'];
}
if (isset($meta['wxpay_qrcode'])) {
$options['wxpay_qrcode'] = $meta['wxpay_qrcode'];
}
}
$tipsContent .= "<p id=\"imwp_tip_content\"><span class=\"imwp_img\"><img src=\"{$options['wxpay_qrcode']}\" />微信赞赏</span><span class=\"imwp_img\"><img src=\"{$options['alipay_qrcode']}\" />支付宝赞赏</span></p>";
$tips = '<div id="imwp_tip">赞赏'.$tipsContent.'<span id="dot_bottom"></span><span id="dot_bottom_top"></span></div>';
$tips .='<div id="content-ds" class="content-ds"><span>「赏不在多,觉得文章有用,就赞赏下吧!」</span></div>';
return $content . $tips;
}
/**
* views
* @param string $template
* @param array $tpldata
*/
protected function display($template, $tpldata = array())
{
require dirname(dirname(__FILE__)) . '/pages/' . $template;
}
/**
* load tips
* @return object
*/
protected function loadTipAdmin()
{
if (isset($this->tipAdmin)) {
return $this->tipAdmin;
}
require dirname(__FILE__) . '/imwptipadmin.php';
return $this->tipAdmin = new IMWPTipAdmin;
}
}
new IMWPTip;
完成后只要启用imwptip赞赏插件,所有文章打开后末尾都会有赞赏区域显示。
另外想到一个问题,如果使用这种赞赏图片,会不会被其他人给替换了?当然如果服务器/wp后台没被黑的化肯定时不存在的了。
基于互联网精神,在注明出处的前提下本站文章可自由转载!
本文链接:https://ranjuan.cn/wordpress文章赞赏插件imwptip/
赞赏
微信赞赏
支付宝赞赏
3条评论