让自己的网站支持第三方支付能力(支持支付宝与微信支付)

前言

对于建站,相信很多小伙伴,一方面是希望自己有个知识的沉淀的载体,另一种程度上也是建立自我品牌的开始,当然也希望网站能够带来一些隐性或者显性的收入,例如:吸引广告商,贴片广告,付费阅读,自产自卖等

您将在本篇中读完get到

• 在vuepress中如何注入全局组件

• 实现置顶与置底的效果

• 实现圆环涟漪动画

• 在自己的网站中添加支付能力,同时支持支付宝与微信支付功能（通用）

不会后端,也能轻松实现网站具备支付宝与微信支付的能力,本篇适用于小白,适合在自己的网站中玩玩的

省去扫码这一环节，避免手机浏览器无法扫码、难以扫码而错失打赏的问题，支持电脑端、手机端、微信APP等多种场景

让您的网站日进斗金不是梦~

写作不易,不喜勿喷,本篇部分内容为付费,感谢分享,有的人见到了付费,就会喷,但有的人见到了,哦，原来还可以这么搞的,便会花小额涨知识,于是会想方设法加到自己的网站上去的.

 

在vuepress中注入全局组件

当你浏览https://coder.itclan.cn/网站时,你会发现,在网站的任何一处,下拉滚动条时,右下角都会出现一个小图标或者网站的右侧,都有一个固定的展示信息栏

在vuepress中是支持编写自定义组件的,并且全局范围内都可以使用,如下所示,当网页内容滚动大于60时,小图片就会显示,小于60时就会隐藏

在/.vuepress/components/ShangPic.vue,创建一个全局的xxxx.vue组件 具体代码如下所示:

<template>
  <div class="shang-wrap">
    <a target="_blank" href="https://www.zhi12.cn/paycenter/reward/widget?entity=user&id=33813">
      <img height