侧边栏加入QQ群小小工具

进入 后台 – 外观 – 自定义 – 额外CSS 添加下面文件里的代码:

  1. /*加群小工具*/
  2. .yfx-jiaqun h5 {
  3. font-size: 16px;
  4. line-height: 1.4;
  5. }
  6. .yfx-jiaqun-small {
  7. padding: 15px;
  8. }
  9. .yfx-jiaqun p {
  10. max-width: 80%;
  11. }
  12. .yfx-jiaqun {
  13. letter-spacing: .5px;
  14. }
  15. .yfx-jiaqun .btn {
  16. font-size: 13px;
  17. }
  18. .yfx-jiaqun .btn i {
  19. margin-right: 3px;
  20. }
  21. .yfx-jiaqun .helper-thumb {
  22. position: absolute;
  23. right: 0;
  24. bottom: 0;
  25. }
  26. .yfx-jiaqun-btn-on {
  27. color: #fff;
  28. background: #2c63ff!important;
  29. box-shadow: 0 3px 10px -1px #2c63ff!important;
  30. border: 0;
  31. }
  32. /*加群小工具*/

进入 后台 – 外观 – 小工具 – 拖动自定义html到文章侧边栏 然后添加下面的代码:

 

  1. <section class="yfx-jiaqun">
  2. <div class="yfx-jiaqun-small">
  3. <p>分享最新WordPress教程<br> 共同学习,共同进步,共同成长!</p>
  4. <a href="https://jq.qq.com/?_wv=1027&k=AjrLKYRl" class="btn yfx-jiaqun-btn-on" uk-toggle=""><i class="iconfont icon-qq"></i>QQ交流群</a>
  5. <div class="helper-thumb"><img src="https://z3.ax1x.com/2021/07/14/WZbbL9.png" alt="源分享"> </div>
  6. </div>
  7. </section>

注意:

下图框起来这段需要替换成你自己的加群代码,不替换就会跳转到别人群里面去了,代码去这个网址获取:https://qun.qq.com/join.html