给博客添加一个投币彩蛋ヾ(≧O≦)〃嗷~

原项目教程原贴
Akilarの糖果屋糖果屋微调合集 | Akilarの糖果屋

前言

本文主要是将原教程HEXO使用的转换为WP使用的HTML代码,并无技术可言,仅供参考

HTML代码

<link
  rel="stylesheet"
  href="https://cdn.huran.xyz/css/coin.css"
  media="defer"
  onload='this.media="all"'
/>
<link
  rel="stylesheet"
  href="https://cdn.huran.xyz/css/coin.min.css"
  media="defer"
  onload='this.media="all"'
/>
<div class="post-reward">
  <button class="tip-button reward-button">
    <span class="tip-button__text">不给糖果就捣蛋</span>
    <div class="coin-wrapper">
      <div class="coin">
        <div class="coin__middle"></div>
        <div class="coin__back"></div>
        <div class="coin__front"></div>
      </div>
    </div>
    <div class="reward-main">
      <ul class="reward-all">
        <li class="reward-item">
          <a
            href="https://img.huran.xyz/2022/04/02/6Ttv7q6u.png"
            rel="external nofollow noreferrer"
            target="_blank"
            ><img
              class="post-qr-code-img"
              src="https://img.huran.xyz/2022/04/02/6Ttv7q6u.png"
              alt="wechat"
          /></a>
          <div class="post-qr-code-desc">WeChat</div>
        </li>
        <li class="reward-item">
          <a
            href="https://img.huran.xyz/2022/04/02/qUgUyBpm.png"
            rel="external nofollow noreferrer"
            target="_blank"
            ><img
              class="post-qr-code-img"
              src="https://img.huran.xyz/2022/04/02/qUgUyBpm.png"
              alt="alipay"
          /></a>
          <div class="post-qr-code-desc">AliPay</div>
        </li>
      </ul>
    </div>
  </button>
</div>
<audio
  id="coinAudio"
  src="https://npm.elemecdn.com/akilar-candyassets/audio/aowu.m4a"
></audio>
<script
  defer
  src="https://cdn.huran.xyz/js/coin.js"
></script>

coin.css

coin.min.css

coin.js

结语

请自行更换HTML中的cssjs链接为自己的链接。如使用中样式位置不对,请自行修改css样式表。

Invitation
HuRan
854262623
created:04/03/2022
Welcome to Candyhome

Use this card to join the candyhome and participate in a pleasant discussion together .

Welcome to Knlde's candyhome,wish you a nice day .

© 版权声明
THE END
喜欢就支持一下吧
点赞7赞赏 分享
评论 共8条

请登录后发表评论