wordpress文章赞赏插件imwptip

在wordpress插件应用商店，搜索添加imwptip插件后在配置页面上传微信与支付宝的收款二维码，该插件基本不影响wp文章的加载，当然也可以自己编辑主题文件实现。

安装后的插件路径：网站目录/wp-content/plugins/imwptip/

如果觉得该赞赏插件不够美观，可以自己对该赞赏插件进行个性化的样式修改。

修改样式文件：wp-content/plugins/imwptip/assets/imwptip.min.css

1#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}
2#content-ds {
3    display: flex;
4    align-items: center;
5    justify-content: center;
6    flex-flow: column;
7    margin-top: 5px;
8}

修改文章中赞赏布局页面：wp-content/plugins/imwptip/classes/imwptip.php

  1<?php
  2/**
  3 * admin options
  4 */
  5class IMWPTip extends IMWPbase
  6{
  7 
  8	/**
  9	 * theme admin
 10	 * @var object
 11	 */
 12	protected $tipAdmin;
 13 
 14	protected $options;
 15 
 16	public function __construct()
 17	{
 18		add_action('admin_menu', array(&$this,'addMenu'));
 19		add_action('the_content', array(&$this, 'addTipsToContent'), 99, 1);
 20		wp_enqueue_style('imwptip', plugin_dir_url(dirname(__FILE__)) .'/assets/imwptip.min.css');
 21	}
 22 
 23 
 24	/**
 25	 * add menus
 26	 */
 27	public function addMenu()
 28	{
 29		$tipAdmin = $this->loadTipAdmin();
 30		$this->options = $tipAdmin->getOption();
 31		add_menu_page('imwptip设置', 'imwptip设置', 'manage_options', 'imwptip', array(&$this,'imwptip'));
 32		if ($this->options['allow_user_qrcode'] == 1) {
 33			if($role = $this->options['allow_userrole']) {
 34				$cap = get_role($role);
 35				$cap = array_pop(array_keys($cap->capabilities));
 36				add_menu_page('打赏设置', '打赏设置', $cap, 'usertip', array(&$this,'usertip'));
 37			}
 38		}
 39	}
 40 
 41	/**
 42	 * imwptip options
 43	 * @return
 44	 */
 45	public function imwptip()
 46	{
 47		if (isset($_POST['allow_user_qrcode'])) {
 48			$tipAdmin = $this->loadTipAdmin();
 49			$tipAdmin->saveOptions();
 50			$this->options = $tipAdmin->getOption();
 51		}
 52		$roles = array_keys(get_editable_roles());
 53		$roles = array_combine($roles, $roles);
 54		$formData = array(
 55			array(
 56				'label' => '默认支付宝赞赏二维码',
 57				'name' => 'alipay_qrcode',
 58				'type' => 'image',
 59				'value' => $this->options['alipay_qrcode'],
 60				'desc' => '上传支付宝支付二维码',
 61				),
 62			array(
 63				'label' => '默认微信赞赏二维码',
 64				'name' => 'wxpay_qrcode',
 65				'type' => 'image',
 66				'value' => $this->options['wxpay_qrcode'],
 67				'desc' => '上传微信支付二维码',
 68				),
 69			array(
 70				'label' => '允许用户设定二维码',
 71				'name' => 'allow_user_qrcode',
 72				'type' => 'select',
 73				'options' => array(
 74					0 => '不允许',
 75					1 => '允许',
 76				),
 77				'value' => $this->options['allow_user_qrcode'],
 78				'desc' => '允许用户在自己的控制面板中设定二维码',
 79				),
 80			array(
 81				'label' => '允许角色',
 82				'name' => 'allow_userrole',
 83				'type' => 'select',
 84				'options' => $roles,
 85				'value' => $this->options['allow_userrole'],
 86				'desc' => '允许权限高于选择的角色设定二维码',
 87				),
 88 
 89			array(
 90				'label' => '保存',
 91				'name' => 'submit',
 92				'type' => 'submit',
 93				)
 94			);
 95		$tpldata['form'] = $this->getTableForm($formData);
 96		$this->display('imwptip.php', $tpldata);
 97	}
 98	
 99	/**
100	 * user tips page
101	 * @return
102	 */
103	public function usertip()
104	{
105		$tipAdmin = $this->loadTipAdmin();		
106		if (isset($_POST['allow_user_qrcode'])) {
107			$tipAdmin->saveUserOption();
108		}
109		$options = $tipAdmin->getUserOption();
110 
111		$formData = array(
112			array(
113				'label' => '支付宝打赏二维码',
114				'name' => 'alipay_qrcode',
115				'type' => 'image',
116				'value' => $options['alipay_qrcode'],
117				'desc' => '上传支付宝支付二维码',
118				),
119			array(
120				'label' => '微信打赏二维码',
121				'name' => 'wxpay_qrcode',
122				'type' => 'image',
123				'value' => $options['wxpay_qrcode'],
124				'desc' => '上传微信支付二维码',
125				),
126			array(
127				'label' => '允许用户设定二维码',
128				'name' => 'allow_user_qrcode',
129				'type' => 'hidden',
130				'value' => 1,
131				),
132			array(
133				'label' => '保存',
134				'name' => 'submit',
135				'type' => 'submit',
136				)
137			);
138		$tpldata['form'] = $this->getTableForm($formData);
139		$this->display('imwptip.php', $tpldata);
140	}
141 
142	/**
143	 * add tips to post content
144	 */
145	public function addTipsToContent($content)
146	{
147		if (!is_singular()) {
148			return $content;
149		}
150		$options = get_option('imwptip');
151		if ($options['allow_user_qrcode'] == 1) {
152			global $authordata;
153			$meta = json_decode(get_user_meta($authordata->ID, 'imwptip', true), true);
154			if (isset($meta['alipay_qrcode'])) {
155				$options['alipay_qrcode'] = $meta['alipay_qrcode'];
156			}
157			if (isset($meta['wxpay_qrcode'])) {
158				$options['wxpay_qrcode'] = $meta['wxpay_qrcode'];
159			}
160		}
161		$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>";		
162		$tips = '<div id="imwp_tip">赞赏'.$tipsContent.'<span id="dot_bottom"></span><span id="dot_bottom_top"></span></div>';
163		$tips .='<div id="content-ds" class="content-ds"><span>「赏不在多，觉得文章有用，就赞赏下吧！」</span></div>';
164		
165		
166	
167		return $content . $tips;
168	}
169 
170	/**
171	 * views
172	 * @param  string $template
173	 * @param  array  $tpldata 
174	 */
175	protected function display($template, $tpldata = array())
176	{
177		require dirname(dirname(__FILE__)) . '/pages/' . $template;
178	}
179 
180 
181	/**
182	 * load tips
183	 * @return object
184	 */
185	protected function loadTipAdmin()
186	{
187		if (isset($this->tipAdmin)) {
188			return $this->tipAdmin;
189		}
190		require dirname(__FILE__) . '/imwptipadmin.php';
191		return $this->tipAdmin = new IMWPTipAdmin;
192	}
193}
194 
195new IMWPTip;

完成后只要启用imwptip赞赏插件，所有文章打开后末尾都会有赞赏区域显示。

另外想到一个问题，如果使用这种赞赏图片，会不会被其他人给替换了？当然如果服务器/wp后台没被黑的化肯定时不存在的了。

染卷不卷'blog

wordpress文章赞赏插件imwptip

染卷

3 条评论

发表评论取消回复

染卷

3 条评论

发表评论 取消回复

发表评论取消回复