给自己的wordpress添加一个打赏的功能是很简单的，微信里面有一个付钱码，我们把付钱码给保存下来，放到自己的站点就行了，通常都是放在文章的底部，这样在用户读完文章之后，觉得对自己的用处很大，或许就会给这篇文章打赏了。,我记得很早的时候，我的blog添加过这样的打赏功能，只可惜一个打赏也没收到，囧，所以对于小blog来说的话，添加打赏基本上不会收到打赏，不过这里本着研究的精神，还是看看怎么给自己的wordpress添加怎么一个打赏功能吧。,方法一:比较专业，操作起来稍显复杂一些,打开万能的function，添加一个function函数，如下所示:,好了，然后我们再在CSS文件里面再加添控制的CSS样式文件，如下:,同样的需要在footer.php文件中添加如下js：,好了，这样wp添加微信的打赏功能就已经做好了，不过这个方法有一定的弊端，就是有的wp主题模板，可能根本就没有footer 底部模板，或者底部模板跟上面的对应不上等等问题，所以我们只需要在我们的文章页底部添加即可，基本大同小异了。,方法二：同时添加微信和支付宝打赏功能,修改相应的文章页面，基本上都是single.php文件，找到END .entry-content 之类的代码，在下面添加如下的代码:,好了，记得把代码中的微信二维码图片和支付宝二维码地址替换成自己的。,这两种方法都是修改代码，我们还可以用最简单的方法就是使用wp万能的插件，是再简单不过了，不过不想要太多插件的朋友就可以使用这种修改代码的方式了，我们还可以自己ps一张打赏图片，然后找到文章模板，简单自定义一下CSS，排版一下放到文章页下面，主要看自己主题什么格式了。,

给自己的wordpress添加一个打赏的功能是很简单的，微信里面有一个付钱码，我们把付钱码给保存下来，放到自己的站点就行了，通常都是放在文章的底部，这样在用户读完文章之后，觉得对自己的用处很大，或许就会给这篇文章打赏了。

我记得很早的时候，我的blog添加过这样的打赏功能，只可惜一个打赏也没收到，囧，所以对于小blog来说的话，添加打赏基本上不会收到打赏，不过这里本着研究的精神，还是看看怎么给自己的wordpress添加怎么一个打赏功能吧。

方法一:比较专业，操作起来稍显复杂一些

打开万能的function，添加一个function函数，如下所示:

  1. //如果是文章页并且不是手机访问，在文章末尾添加一段html代码   
  2. function add_pay($content) {   
  3.    
  4. $pay = <<
  5. class="gave" >   
  6.     "javascript：;" id="gave">打赏   
  7.     class="code" id="wechatCode" style="display: none">   
  8.         "/wp-content/uploads/2015/10/pay.jpg" alt="">   
  9.         
    "m/wp-content/uploads/2015/10/ico-wechat.jpg" alt="微信logo" class="ico-wechat">微信扫一扫，打赏作者吧～
       
  10.     
 //www.xiariboke.net   
    •    
  • PAY;   
  •    
  •  if(is_single() && !wp_is_mobile()){   
  •   $content .= $pay;   
  •  }   
  •  return $content;   
  • }   
  •    
  • add_filter( 'the_content', 'add_pay',10);   

    • 好了，然后我们再在CSS文件里面再加添控制的CSS样式文件，如下:

    1. "text/css">   
    2.     .gave {   
    3.         height: 110px;   
    4.         position: relative;   
    5.         text-align: center;   
    6.     }   
    7.    
    8.     .gave .code::after {   
    9.         border-color: #fff transparent transparent;   
    10.         border-style: solid;   
    11.         border-width: 10px;   
    12.         content: "";   
    13.         height: 0;   
    14.         left: 50%;   
    15.         margin-left: -7.5px;   
    16.         position: absolute;   
    17.         top: 100%;   
    18.         width: 0;   
    19.     }   
    20.     .gave .code {   
    21.         background: #fff none repeat scroll 0 0;   
    22.         border-radius: 5px;   
    23.         bottombottom: 100%;   
    24.         box-shadow: 0 0 15px #e5e5e5;   
    25.         color: #68b3de;   
    26.         display: none;   
    27.         font-size: 13px;   
    28.         height: 160px;   
    29.         left: 50%;   
    30.         margin-left: -110px;   
    31.         padding: 20px;   
    32.         position: absolute;   
    33.         width: 180px;   
    34.     }   
    35.     .gave a {   
    36.         background: #f06363 none repeat scroll 0 0;   
    37.         border-radius: 50%;   
    38.         color: #fff !important;   
    39.         display: inline-block;   
    40.         font-size: 18px;   
    41.         height: 75px;   
    42.         line-height: 75px;   
    43.         text-align: center;   
    44.         width: 75px;   
    45.         text-decoration: none;   
    46.     }   
    47.    
    48.     .gave .code > img {   
    49.         height: 124px;   
    50.         width: 124px;   
    51.         border: medium none;   
    52.         max-width: 100%;   
    53.     }   
    54.   

    同样的需要在footer.php文件中添加如下js：

    1. "text/javascript">   
    2.     document.getElementById('gave').onmouseover = function() {   
    3.         document.getElementById('wechatCode').style.display = 'block';   
    4.     }   
    5.     document.getElementById('gave').onmouseout = function() {   
    6.         document.getElementById('wechatCode').style.display = 'none';   
    7.     }   
    8.   

    好了，这样wp添加微信的打赏功能就已经做好了，不过这个方法有一定的弊端，就是有的wp主题模板，可能根本就没有footer 底部模板，或者底部模板跟上面的对应不上等等问题，所以我们只需要在我们的文章页底部添加即可，基本大同小异了。

    方法二：同时添加微信和支付宝打赏功能

    修改相应的文章页面，基本上都是single.php文件，找到END .entry-content 之类的代码，在下面添加如下的代码:

    1.  "text-align: center;">用"color: #339966;">微信 OR "color: #337fe5;">支付宝 扫描二维码