Puock主题 | 开源多风格自适应

035313
Puock主题 | 开源多风格自适应-榆桦源码网
Puock主题 | 开源多风格自适应
此内容为免费资源，请登录后查看
捐赠0
免费资源

Puock主题是憧憬点滴记忆开发的一款免费开源主题。主题大气精美，笔者亲测好用，遂推荐给大家。

一、主题介绍

主要功能

Puock主题 | 开源多风格自适应插图

21个主要功能

Puock主题 | 开源多风格自适应插图1

缺点：兼容性有待提高，有部分WordPress插件的功能无法使用，比如：Wechat Social登录弹窗无法显示，pure-highlight代码高亮插件、Hermit X音乐插件、Smartideo视频插件、Clipboard文字复制插件无法使用。如果你依赖的插件比较少，且有耐心找到冲突插件的替代方案，这款主题还是非常合适的。真的勇士永远不怕折腾
（因为笔者的插件实在是多，这个主题我用了八天就溜了

二、主题优化

1、添加悬浮按钮

1.1 主代码

<span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">div</span> <span class="token attr-name"><span class="atn">id</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">share</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span>    
  <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">a</span> <span class="token attr-name"><span class="atn">class</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">fgzh</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token attr-name"><span class="atn">onclick</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="pln">showgzh</span><span class="pun">()</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token attr-name"><span class="atn">title</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">公众号</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">a</span><span class="token punctuation"><span class="tag">></span></span></span>  
  <span class="token php language-php"><span class="token delimiter important"><span class="pun"><?</span><span class="pln"><a title="【查看含有[php]标签的文章】" href="http://www.yunziyuan.com.cn/tag/php" target="_blank" rel="noopener noreferrer">php</a></span></span> <span class="token keyword keyword-if"><span class="kwd">if</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token operator"><span class="pun">!</span></span><span class="token function"><span class="pln">is_home</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">)</span></span> <span class="token operator"><span class="pun">&&</span></span> <span class="token punctuation"><span class="pun">(</span></span><span class="token operator"><span class="pun">!</span></span><span class="token function"><span class="pln">is_user_logged_in</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">)</span></span> <span class="token punctuation"><span class="pun">{</span></span> <span class="token delimiter important"><span class="pun">?></span></span></span>
    <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">img</span> <span class="token attr-name"><span class="atn">id</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">qr_img</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token attr-name"><span class="atn">src</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">https://www.jishusongshu.com/images/qr_img.png</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token style-attr language-css"><span class="token attr-name"> <span class="atn">style</span></span><span class="token punctuation"><span class="pun">=</span><span class="atv">"</span></span><span class="token attr-value"><span class="token property"><span class="pln">display</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">block</span></span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span>
    <span class="token php language-php"><span class="token delimiter important"><span class="pun"><?</span><span class="pln">php</span></span> <span class="token punctuation"><span class="pun">}</span></span><span class="token keyword keyword-else"><span class="kwd">else</span></span><span class="token punctuation"><span class="pun">{</span></span> <span class="token delimiter important"><span class="pun">?></span></span></span>
    <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">img</span> <span class="token attr-name"><span class="atn">id</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">qr_img</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token attr-name"><span class="atn">src</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">https://www.jishusongshu.com/images/qr_img.png</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token punctuation"><span class="tag">></span></span></span>  
  <span class="token php language-php"><span class="token delimiter important"><span class="pun"><?</span><span class="pln">php</span></span> <span class="token punctuation"><span class="pun">}</span></span> <span class="token delimiter important"><span class="pun">?></span></span></span>
  <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">a</span> <span class="token attr-name"><span class="atn">href</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">https://jq.qq.com/?_wv=1027&k=5KYuhQa</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token attr-name"><span class="atn">target</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">_blank</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token attr-name"><span class="atn">class</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">tencent</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token attr-name"><span class="atn">title</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">加QQ群</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">a</span><span class="token punctuation"><span class="tag">></span></span></span>
  <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">a</span> <span class="token attr-name"><span class="atn">class</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">mnpg</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token attr-name"><span class="atn">onclick</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="pln">showpg</span><span class="pun">()</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token attr-name"><span class="atn">title</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">小程序</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">a</span><span class="token punctuation"><span class="tag">></span></span></span>  
  <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">img</span> <span class="token attr-name"><span class="atn">id</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">pg_img</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token attr-name"><span class="atn">src</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">https://www.jishusongshu.com/images/pg_img.png</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token punctuation"><span class="tag">></span></span></span>
<span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">div</span><span class="token punctuation"><span class="tag">></span></span></span>

1.2 JS代码

<span class="token operator"><span class="pun"><</span></span><span class="pln">script type</span><span class="token operator"><span class="pun">=</span></span><span class="token string"><span class="str">"text/javascript"</span></span><span class="token operator"><span class="pun">></span></span>
<span class="token keyword keyword-function"><span class="kwd">function</span></span> <span class="token function"><span class="pln">showpg</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">{</span></span> 
  <span class="token keyword keyword-if"><span class="kwd">if</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="pln">document</span><span class="token punctuation"><span class="pun">.</span></span><span class="token function"><span class="pln">getElementById</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token string"><span class="str">"pg_img"</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">.</span></span><span class="pln">style</span><span class="token punctuation"><span class="pun">.</span></span><span class="pln">display</span><span class="token operator"><span class="pun">==</span></span><span class="token string"><span class="str">"block"</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">{</span></span><span class="pln"> 
    document</span><span class="token punctuation"><span class="pun">.</span></span><span class="token function"><span class="pln">getElementById</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token string"><span class="str">"pg_img"</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">.</span></span><span class="pln">style</span><span class="token punctuation"><span class="pun">.</span></span><span class="pln">display</span><span class="token operator"><span class="pun">=</span></span><span class="token string"><span class="str">"none"</span></span><span class="token punctuation"><span class="pun">;</span></span> 
  <span class="token punctuation"><span class="pun">}</span></span>
  <span class="token keyword keyword-else"><span class="kwd">else</span></span><span class="token punctuation"><span class="pun">{</span></span><span class="pln">
    document</span><span class="token punctuation"><span class="pun">.</span></span><span class="token function"><span class="pln">getElementById</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token string"><span class="str">"pg_img"</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">.</span></span><span class="pln">style</span><span class="token punctuation"><span class="pun">.</span></span><span class="pln">display</span><span class="token operator"><span class="pun">=</span></span><span class="token string"><span class="str">"block"</span></span><span class="token punctuation"><span class="pun">;</span></span> 
  <span class="token punctuation"><span class="pun">}</span></span> 
  <span class="token keyword keyword-if"><span class="kwd">if</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="pln">document</span><span class="token punctuation"><span class="pun">.</span></span><span class="token function"><span class="pln">getElementById</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token string"><span class="str">"qr_img"</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">.</span></span><span class="pln">style</span><span class="token punctuation"><span class="pun">.</span></span><span class="pln">display</span><span class="token operator"><span class="pun">==</span></span><span class="token string"><span class="str">"block"</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">{</span></span><span class="pln"> 
    document</span><span class="token punctuation"><span class="pun">.</span></span><span class="token function"><span class="pln">getElementById</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token string"><span class="str">"qr_img"</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">.</span></span><span class="pln">style</span><span class="token punctuation"><span class="pun">.</span></span><span class="pln">display</span><span class="token operator"><span class="pun">=</span></span><span class="token string"><span class="str">"none"</span></span><span class="token punctuation"><span class="pun">;</span></span> 
  <span class="token punctuation"><span class="pun">}</span></span>
<span class="token punctuation"><span class="pun">}</span></span>
<span class="token keyword keyword-function"><span class="kwd">function</span></span> <span class="token function"><span class="pln">showgzh</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">{</span></span> 
  <span class="token keyword keyword-if"><span class="kwd">if</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="pln">document</span><span class="token punctuation"><span class="pun">.</span></span><span class="token function"><span class="pln">getElementById</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token string"><span class="str">"qr_img"</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">.</span></span><span class="pln">style</span><span class="token punctuation"><span class="pun">.</span></span><span class="pln">display</span><span class="token operator"><span class="pun">==</span></span><span class="token string"><span class="str">"block"</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">{</span></span><span class="pln"> 
    document</span><span class="token punctuation"><span class="pun">.</span></span><span class="token function"><span class="pln">getElementById</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token string"><span class="str">"qr_img"</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">.</span></span><span class="pln">style</span><span class="token punctuation"><span class="pun">.</span></span><span class="pln">display</span><span class="token operator"><span class="pun">=</span></span><span class="token string"><span class="str">"none"</span></span><span class="token punctuation"><span class="pun">;</span></span> 
  <span class="token punctuation"><span class="pun">}</span></span>
  <span class="token keyword keyword-else"><span class="kwd">else</span></span><span class="token punctuation"><span class="pun">{</span></span><span class="pln">
    document</span><span class="token punctuation"><span class="pun">.</span></span><span class="token function"><span class="pln">getElementById</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token string"><span class="str">"qr_img"</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">.</span></span><span class="pln">style</span><span class="token punctuation"><span class="pun">.</span></span><span class="pln">display</span><span class="token operator"><span class="pun">=</span></span><span class="token string"><span class="str">"block"</span></span><span class="token punctuation"><span class="pun">;</span></span> 
  <span class="token punctuation"><span class="pun">}</span></span> 
  <span class="token keyword keyword-if"><span class="kwd">if</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="pln">document</span><span class="token punctuation"><span class="pun">.</span></span><span class="token function"><span class="pln">getElementById</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token string"><span class="str">"pg_img"</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">.</span></span><span class="pln">style</span><span class="token punctuation"><span class="pun">.</span></span><span class="pln">display</span><span class="token operator"><span class="pun">==</span></span><span class="token string"><span class="str">"block"</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">{</span></span><span class="pln"> 
    document</span><span class="token punctuation"><span class="pun">.</span></span><span class="token function"><span class="pln">getElementById</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token string"><span class="str">"pg_img"</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">.</span></span><span class="pln">style</span><span class="token punctuation"><span class="pun">.</span></span><span class="pln">display</span><span class="token operator"><span class="pun">=</span></span><span class="token string"><span class="str">"none"</span></span><span class="token punctuation"><span class="pun">;</span></span> 
  <span class="token punctuation"><span class="pun">}</span></span>
<span class="token punctuation"><span class="pun">}</span></span>
<span class="token operator"><span class="pun"><</span></span><span class="token operator"><span class="pun">/</span></span><span class="pln">script</span><span class="token operator"><span class="pun">></span></span>

1.3 CSS样式

<span class="token selector"><span class="token id"><span class="com">#return-top-bottom</span></span></span><span class="token punctuation"><span class="com">{</span></span><span class="token property"><span class="com">bottom</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">160</span></span><span class="com">px</span><span class="token punctuation"><span class="com">}</span></span>
<span class="token selector"><span class="token id"><span class="com">#share</span></span></span><span class="token punctuation"><span class="com">{</span></span><span class="token property"><span class="com">position</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com">fixed</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">bottom</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">50</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">right</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">12</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">width</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">30</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">zoom</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">1</span></span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">z-index</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">99</span></span><span class="token punctuation"><span class="com">;</span></span><span class="token punctuation"><span class="com">}</span></span>
<span class="token selector"><span class="token id"><span class="com">#share</span></span><span class="com"> a</span></span><span class="token punctuation"><span class="com">{</span></span><span class="token property"><span class="com">background-image</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token url"><span class="com">url(https://www.jishusongshu.com/images/share-bar.png)</span></span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">background-repeat</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com">no-repeat</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">display</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com">block</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">width</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">32</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">height</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">32</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">overflow</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com">hidden</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">text-indent</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com">-</span><span class="token number"><span class="com">999</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">-webkit-transition</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com"> all </span><span class="token number"><span class="com">0.2</span></span><span class="com">s ease-in-out</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">-moz-transition</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com"> all </span><span class="token number"><span class="com">0.2</span></span><span class="com">s ease-in-out</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">-o-transition</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com"> all </span><span class="token number"><span class="com">0.2</span></span><span class="com">s ease-in-out</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">-ms-transition</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com"> all </span><span class="token number"><span class="com">0.2</span></span><span class="com">s ease-in-out</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">transition</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com"> all </span><span class="token number"><span class="com">0.2</span></span><span class="com">s ease-in-out</span><span class="token punctuation"><span class="com">;</span></span><span class="token punctuation"><span class="com">}</span></span>
<span class="token selector"><span class="token id"><span class="com">#share</span></span> <span class="token class"><span class="com">.mnpg</span></span></span><span class="token punctuation"><span class="com">{</span></span><span class="token property"><span class="com">background-position</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">0</span></span> <span class="token number"><span class="com">0</span></span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">position</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com">absolute</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">bottom</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">0</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">border-radius</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">3</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">cursor</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com"> pointer</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">box-shadow</span></span><span class="token punctuation"><span class="com">:</span></span> <span class="token number"><span class="com">0</span></span> <span class="token number"><span class="com">0</span></span> <span class="token number"><span class="com">2</span></span><span class="com">px </span><span class="token number"><span class="com">0</span></span> <span class="token function"><span class="com">rgba</span></span><span class="token punctuation"><span class="com">(</span></span><span class="token number"><span class="com">0</span></span><span class="com">, </span><span class="token number"><span class="com">0</span></span><span class="com">, </span><span class="token number"><span class="com">0</span></span><span class="com">, </span><span class="token number"><span class="com">.12</span></span><span class="token punctuation"><span class="com">)</span></span><span class="com">, </span><span class="token number"><span class="com">0</span></span> <span class="token number"><span class="com">2</span></span><span class="com">px </span><span class="token number"><span class="com">2</span></span><span class="com">px </span><span class="token number"><span class="com">0</span></span> <span class="token function"><span class="com">rgba</span></span><span class="token punctuation"><span class="com">(</span></span><span class="token number"><span class="com">0</span></span><span class="com">, </span><span class="token number"><span class="com">0</span></span><span class="com">, </span><span class="token number"><span class="com">0</span></span><span class="com">, </span><span class="token number"><span class="com">.24</span></span><span class="token punctuation"><span class="com">)</span></span><span class="token punctuation"><span class="com">;</span></span><span class="token punctuation"><span class="com">}</span></span>
<span class="token selector"><span class="token id"><span class="com">#share</span></span><span class="com"> a</span><span class="token class"><span class="com">.mnpg</span></span><span class="token pseudo-class"><span class="com">:hover</span></span></span><span class="token punctuation"><span class="com">{</span></span><span class="token property"><span class="com">background-position</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com">-</span><span class="token number"><span class="com">32</span></span><span class="com">px </span><span class="token number"><span class="com">0</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">border-radius</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">3</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token punctuation"><span class="com">}</span></span>
<span class="token selector"><span class="token id"><span class="com">#share</span></span> <span class="token class"><span class="com">.tencent</span></span></span><span class="token punctuation"><span class="com">{</span></span><span class="token property"><span class="com">background-position</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">0</span></span><span class="com">px -</span><span class="token number"><span class="com">32</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">position</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com">absolute</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">bottom</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">74</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">border-radius</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">3</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">cursor</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com"> pointer</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">box-shadow</span></span><span class="token punctuation"><span class="com">:</span></span> <span class="token number"><span class="com">0</span></span> <span class="token number"><span class="com">0</span></span> <span class="token number"><span class="com">2</span></span><span class="com">px </span><span class="token number"><span class="com">0</span></span> <span class="token function"><span class="com">rgba</span></span><span class="token punctuation"><span class="com">(</span></span><span class="token number"><span class="com">0</span></span><span class="com">, </span><span class="token number"><span class="com">0</span></span><span class="com">, </span><span class="token number"><span class="com">0</span></span><span class="com">, </span><span class="token number"><span class="com">.12</span></span><span class="token punctuation"><span class="com">)</span></span><span class="com">, </span><span class="token number"><span class="com">0</span></span> <span class="token number"><span class="com">2</span></span><span class="com">px </span><span class="token number"><span class="com">2</span></span><span class="com">px </span><span class="token number"><span class="com">0</span></span> <span class="token function"><span class="com">rgba</span></span><span class="token punctuation"><span class="com">(</span></span><span class="token number"><span class="com">0</span></span><span class="com">, </span><span class="token number"><span class="com">0</span></span><span class="com">, </span><span class="token number"><span class="com">0</span></span><span class="com">, </span><span class="token number"><span class="com">.24</span></span><span class="token punctuation"><span class="com">)</span></span><span class="token punctuation"><span class="com">;</span></span><span class="token punctuation"><span class="com">}</span></span>
<span class="token selector"><span class="token id"><span class="com">#share</span></span><span class="com"> a</span><span class="token class"><span class="com">.tencent</span></span><span class="token pseudo-class"><span class="com">:hover</span></span></span><span class="token punctuation"><span class="com">{</span></span><span class="token property"><span class="com">background-position</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com">-</span><span class="token number"><span class="com">32</span></span><span class="com">px -</span><span class="token number"><span class="com">32</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token punctuation"><span class="com">}</span></span>
<span class="token selector"><span class="token id"><span class="com">#share</span></span> <span class="token class"><span class="com">.fgzh</span></span></span><span class="token punctuation"><span class="com">{</span></span><span class="token property"><span class="com">background-position</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">0</span></span><span class="com">px -</span><span class="token number"><span class="com">64</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">position</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com">absolute</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">bottom</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">37</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">border-radius</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">3</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">cursor</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com"> pointer</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">box-shadow</span></span><span class="token punctuation"><span class="com">:</span></span> <span class="token number"><span class="com">0</span></span> <span class="token number"><span class="com">0</span></span> <span class="token number"><span class="com">2</span></span><span class="com">px </span><span class="token number"><span class="com">0</span></span> <span class="token function"><span class="com">rgba</span></span><span class="token punctuation"><span class="com">(</span></span><span class="token number"><span class="com">0</span></span><span class="com">, </span><span class="token number"><span class="com">0</span></span><span class="com">, </span><span class="token number"><span class="com">0</span></span><span class="com">, </span><span class="token number"><span class="com">.12</span></span><span class="token punctuation"><span class="com">)</span></span><span class="com">, </span><span class="token number"><span class="com">0</span></span> <span class="token number"><span class="com">2</span></span><span class="com">px </span><span class="token number"><span class="com">2</span></span><span class="com">px </span><span class="token number"><span class="com">0</span></span> <span class="token function"><span class="com">rgba</span></span><span class="token punctuation"><span class="com">(</span></span><span class="token number"><span class="com">0</span></span><span class="com">, </span><span class="token number"><span class="com">0</span></span><span class="com">, </span><span class="token number"><span class="com">0</span></span><span class="com">, </span><span class="token number"><span class="com">.24</span></span><span class="token punctuation"><span class="com">)</span></span><span class="token punctuation"><span class="com">;</span></span><span class="token punctuation"><span class="com">}</span></span>
<span class="token selector"><span class="token id"><span class="com">#share</span></span><span class="com"> a</span><span class="token class"><span class="com">.fgzh</span></span><span class="token pseudo-class"><span class="com">:hover</span></span></span><span class="token punctuation"><span class="com">{</span></span><span class="token property"><span class="com">background-position</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com">-</span><span class="token number"><span class="com">32</span></span><span class="com">px -</span><span class="token number"><span class="com">64</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token punctuation"><span class="com">}</span></span>  
<span class="token selector"><span class="token id"><span class="com">#qr_img</span></span></span><span class="token punctuation"><span class="com">{</span></span><span class="token property"><span class="com">position</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com">absolute</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">bottom</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">50</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">left</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com">-</span><span class="token number"><span class="com">183</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">display</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com">none</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">max-width</span></span><span class="token punctuation"><span class="com">:</span></span> <span class="token number"><span class="com">300</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">z-index</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">9999</span></span><span class="token punctuation"><span class="com">}</span></span>
<span class="token selector"><span class="token id"><span class="com">#pg_img</span></span></span><span class="token punctuation"><span class="com">{</span></span><span class="token property"><span class="com">position</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com">absolute</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">bottom</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">18</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">left</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com">-</span><span class="token number"><span class="com">183</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">display</span></span><span class="token punctuation"><span class="com">:</span></span><span class="com">none</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">max-width</span></span><span class="token punctuation"><span class="com">:</span></span> <span class="token number"><span class="com">300</span></span><span class="com">px</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">z-index</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">9997</span></span><span class="token punctuation"><span class="com">}</span></span>

2、修改底部信息

首页展示友情链接，其他页面展示信息

2.1 修改页脚

修改footer.php的部分代码

<span class="token php language-php"><span class="token delimiter important"><span class="pun"><?</span><span class="pln">php</span></span> <span class="token keyword keyword-if"><span class="kwd">if</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token function"><span class="pln">is_home</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token operator"><span class="pun">&&</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token operator"><span class="pun">!</span></span><span class="token function"><span class="pln">wp_is_mobile</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">)</span></span> <span class="token punctuation"><span class="pun">{</span></span> <span class="token delimiter important"><span class="pun">?></span></span></span>
            <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">div</span> <span class="token attr-name"><span class="atn">class</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">col-md-6</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span>
                <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">div</span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">span</span> <span class="token attr-name"><span class="atn">class</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">t-md pb-2 d-inline-block border-bottom border-primary</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">i</span> <span class="token attr-name"><span class="atn">class</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">czs-link-l</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">i</span><span class="token punctuation"><span class="tag">></span></span></span> <span class="token php language-php"><span class="token delimiter important"><span class="pun"><?</span><span class="pln">php</span></span> <span class="token function"><span class="pln">_e</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token single-quoted-string string"><span class="str">'友情链接'</span></span><span class="token punctuation"><span class="pun">,</span></span> <span class="token constant"><span class="pln">PUOCK</span></span><span class="token punctuation"><span class="pun">)</span></span> <span class="token delimiter important"><span class="pun">?></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">span</span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">div</span><span class="token punctuation"><span class="tag">></span></span></span>
                <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">div</span> <span class="token attr-name"><span class="atn">class</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">more-link mt20 t-md</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span>
                    <span class="token php language-php"><span class="token delimiter important"><span class="pun"><?</span><span class="pln">php</span></span>
                    <span class="token variable"><span class="pln">$link_cid</span></span> <span class="token operator"><span class="pun">=</span></span> <span class="token function"><span class="pln">pk_get_option</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token single-quoted-string string"><span class="str">'index_link_id'</span></span><span class="token punctuation"><span class="pun">,</span></span><span class="token single-quoted-string string"><span class="str">''</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">;</span></span>
                    <span class="token keyword keyword-if"><span class="kwd">if</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token operator"><span class="pun">!</span></span><span class="token function"><span class="pln">empty</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token variable"><span class="pln">$link_cid</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">{</span></span>
                        <span class="token function"><span class="pln">preg_match_all</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="str">'</span><span class="token operator"><span class="str">/</span></span><span class="token operator"><span class="str"><</span></span><span class="str">a </span><span class="token punctuation"><span class="str">.</span></span><span class="token operator"><span class="str">*</span></span><span class="token delimiter important"><span class="pun">?></span></span></span><span class="pln">.*?<\/a>/', wp_list_bookmarks(array(
                            'category'=>$link_cid,
                            'category_before'=>'',
                            'title_li'=>'',
                            'show_images'=>0,
                            'echo'=>0                            
                        )), $links);
                        foreach ($links[0] as $link){
                            echo $link;
                        }
                    }
                    $link_page_id = pk_get_option('link_page','');
                    if(!empty($link_page_id)){
                        echo '</span><span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">a</span> <span class="token attr-name"><span class="atn">target</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">_blank</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token attr-name"><span class="atn">href</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="token punctuation"><span class="atv">'</span></span><span class="atv">.get_page_link($link_page_id).</span><span class="token punctuation"><span class="atv">'</span></span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span><span class="pln">'.__('更多链接', PUOCK).'</span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">a</span><span class="token punctuation"><span class="tag">></span></span></span><span class="pln">';
                    }
                    </span><span class="pun">?></span>                    
                <span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">div</span><span class="token punctuation"><span class="tag">></span></span></span>
            <span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">div</span><span class="token punctuation"><span class="tag">></span></span></span> 
            <span class="token php language-php"><span class="token delimiter important"><span class="pun"><?</span><span class="pln">php</span></span> <span class="token punctuation"><span class="pun">}</span></span><span class="token keyword keyword-else"><span class="kwd">else</span></span><span class="token punctuation"><span class="pun">{</span></span> <span class="token delimiter important"><span class="pun">?></span></span></span>
            <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">div</span> <span class="token attr-name"><span class="atn">class</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">col-md-6</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span>
                <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">div</span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">span</span> <span class="token attr-name"><span class="atn">class</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">t-md pb-2 d-inline-block border-bottom border-primary</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">i</span> <span class="token attr-name"><span class="atn">class</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">czs-link-l</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">i</span><span class="token punctuation"><span class="tag">></span></span></span> <span class="token php language-php"><span class="token delimiter important"><span class="pun"><?</span><span class="pln">php</span></span> <span class="token function"><span class="pln">_e</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token single-quoted-string string"><span class="str">'关注我们'</span></span><span class="token punctuation"><span class="pun">,</span></span> <span class="token constant"><span class="pln">PUOCK</span></span><span class="token punctuation"><span class="pun">)</span></span> <span class="token delimiter important"><span class="pun">?></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">span</span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">div</span><span class="token punctuation"><span class="tag">></span></span></span>
                <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">div</span> <span class="token attr-name"><span class="atn">class</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">more-link mt20 t-md</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span>                    
                    <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">div</span> <span class="token attr-name"><span class="atn">class</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">footer-col footer-col-sns</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span>
                    <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">div</span> <span class="token attr-name"><span class="atn">class</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">footer-sns</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span>     
                        <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">a</span> <span class="token attr-name"><span class="atn">href</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">https://github.com/songshuxiao</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token attr-name"><span class="atn">target</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">_blank</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token attr-name"><span class="atn">rel</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">nofollow</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span>
                            <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">i</span> <span class="token attr-name"><span class="atn">class</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">fa fa-github</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">i</span><span class="token punctuation"><span class="tag">></span></span></span>
                        <span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">a</span><span class="token punctuation"><span class="tag">></span></span></span>              
                        <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">a</span> <span class="token attr-name"><span class="atn">href</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">https://jq.qq.com/?_wv=1027&k=5KYuhQa</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token attr-name"><span class="atn">target</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">_blank</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token attr-name"><span class="atn">rel</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">nofollow</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span>
                            <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">i</span> <span class="token attr-name"><span class="atn">class</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">fa fa-qq</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">i</span><span class="token punctuation"><span class="tag">></span></span></span>
                        <span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">a</span><span class="token punctuation"><span class="tag">></span></span></span>
                        <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">a</span> <span class="token attr-name"><span class="atn">class</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">sns-wx</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token attr-name"><span class="atn">href</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">javascript:;</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span>
                            <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">i</span> <span class="token attr-name"><span class="atn">class</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">fa fa-wechat</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">i</span><span class="token punctuation"><span class="tag">></span></span></span>
                            <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">span</span><span class="token style-attr language-css"><span class="token attr-name"> <span class="atn">style</span></span><span class="token punctuation"><span class="pun">=</span><span class="atv">"</span></span><span class="token attr-value"><span class="token property"><span class="pln">background</span><span class="pun">-</span><span class="pln">image</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token url"><span class="pln">url</span><span class="pun">(</span><span class="pln">https</span><span class="pun">:</span><span class="com">//www.jishusongshu.com/img/jsssgzh.jpg)</span></span><span class="token punctuation"><span class="com">;</span></span></span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">span</span><span class="token punctuation"><span class="tag">></span></span></span>
                        <span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">a</span><span class="token punctuation"><span class="tag">></span></span></span>
                        <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">a</span> <span class="token attr-name"><span class="atn">href</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">https://weibo.com/yangchunniaoyu</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token attr-name"><span class="atn">target</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">_blank</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token attr-name"><span class="atn">rel</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">nofollow</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span>
                        <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">i</span> <span class="token attr-name"><span class="atn">class</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">fa fa-weibo</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">i</span><span class="token punctuation"><span class="tag">></span></span></span>
                        <span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">a</span><span class="token punctuation"><span class="tag">></span></span></span>
                        <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">a</span> <span class="token attr-name"><span class="atn">href</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">https://mail.qq.com/cgi-bin/qm_share?t=qm_mailme&email=jishusongshu@qq.com</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token attr-name"><span class="atn">target</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">_blank</span><span class="token punctuation"><span class="atv">"</span></span></span> <span class="token attr-name"><span class="atn">rel</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">nofollow</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span>
                            <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">i</span> <span class="token attr-name"><span class="atn">class</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">fa fa-envelope</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">i</span><span class="token punctuation"><span class="tag">></span></span></span>
                        <span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">a</span><span class="token punctuation"><span class="tag">></span></span></span>
                    <span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">div</span><span class="token punctuation"><span class="tag">></span></span></span>
                    <span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">div</span><span class="token punctuation"><span class="tag">></span></span></span>
                <span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">div</span><span class="token punctuation"><span class="tag">></span></span></span>
            <span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">div</span><span class="token punctuation"><span class="tag">></span></span></span> 
<span class="token php language-php"><span class="token delimiter important"><span class="pun"><?</span><span class="pln">php</span></span> <span class="token punctuation"><span class="pun">}</span></span> <span class="token delimiter important"><span class="pun">?></span></span></span>

注意如果你想展示的友链图片显示，请把'show_images'=>0,删除

2.2 添加样式

<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">footer</span><span class="pun">-</span><span class="pln">sns</span></span> <span class="token class"><span class="pun">.</span><span class="pln">fa</span></span> </span><span class="token punctuation"><span class="pun">{</span></span>
  <span class="token property"><span class="pln">display</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="kwd">inline</span><span class="pun">-</span><span class="pln">block</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">position</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">relative</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">width</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">40</span></span><span class="lit">px</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">height</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">40</span></span><span class="lit">px</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">font</span><span class="pun">-</span><span class="pln">size</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">20</span></span><span class="lit">px</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">line</span><span class="pun">-</span><span class="pln">height</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">40</span></span><span class="lit">px</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">border</span><span class="pun">-</span><span class="pln">radius</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">50</span><span class="pun">%</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">text</span><span class="pun">-</span><span class="pln">align</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">center</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">background</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token function"><span class="pln">rgba</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token number"><span class="lit">255</span></span><span class="pun">,</span><span class="token number"><span class="lit">255</span></span><span class="pun">,</span><span class="token number"><span class="lit">255</span></span><span class="pun">,</span><span class="token number"><span class="pun">.</span><span class="lit">1</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">color</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token function"><span class="pln">hsl</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token number"><span class="lit">0</span></span><span class="lit">deg</span> <span class="token number"><span class="lit">0</span><span class="pun">%</span></span> <span class="token number"><span class="lit">100</span><span class="pun">%</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">z</span><span class="pun">-</span><span class="pln">index</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">0</span></span><span class="token punctuation"><span class="pun">;</span></span>
<span class="token punctuation"><span class="pun">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">sns</span><span class="pun">-</span><span class="pln">wx</span></span> </span><span class="token punctuation"><span class="pun">{</span></span>
  <span class="token property"><span class="pln">position</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">relative</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">overflow</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">hidden</span><span class="token punctuation"><span class="pun">;</span></span>
<span class="token punctuation"><span class="pun">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">sns</span><span class="pun">-</span><span class="pln">wx</span></span><span class="pln"> span</span><span class="pun">,</span><span class="token class"><span class="pun">.</span><span class="pln">sns</span><span class="pun">-</span><span class="pln">wx</span></span><span class="token pseudo-class"><span class="pun">:</span><span class="pln">hover</span></span><span class="pln"> span </span></span><span class="token punctuation"><span class="pun">{</span></span>
  <span class="token property"><span class="pun">-</span><span class="pln">webkit</span><span class="pun">-</span><span class="pln">transition</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">all </span><span class="token number"><span class="pun">.</span><span class="lit">2</span></span><span class="lit">s</span><span class="pln"> ease</span><span class="pun">-</span><span class="kwd">out</span> <span class="token number"><span class="pun">.</span><span class="lit">1</span></span><span class="lit">s</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pun">-</span><span class="pln">o</span><span class="pun">-</span><span class="pln">transition</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">all </span><span class="token number"><span class="pun">.</span><span class="lit">2</span></span><span class="lit">s</span><span class="pln"> ease</span><span class="pun">-</span><span class="kwd">out</span> <span class="token number"><span class="pun">.</span><span class="lit">1</span></span><span class="lit">s</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">transition</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">all </span><span class="token number"><span class="pun">.</span><span class="lit">2</span></span><span class="lit">s</span><span class="pln"> ease</span><span class="pun">-</span><span class="kwd">out</span> <span class="token number"><span class="pun">.</span><span class="lit">1</span></span><span class="lit">s</span><span class="token punctuation"><span class="pun">;</span></span>
<span class="token punctuation"><span class="pun">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">sns</span><span class="pun">-</span><span class="pln">wx</span></span><span class="pln"> span </span></span><span class="token punctuation"><span class="pun">{</span></span>
  <span class="token property"><span class="pln">position</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">absolute</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">z</span><span class="pun">-</span><span class="pln">index</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">1</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">top</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pun">-</span><span class="token number"><span class="lit">170</span></span><span class="lit">px</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">left</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">0</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">margin</span><span class="pun">-</span><span class="pln">left</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pun">-</span><span class="token number"><span class="lit">57</span></span><span class="lit">px</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">width</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">150</span></span><span class="lit">px</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">height</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">150</span></span><span class="lit">px</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">background</span><span class="pun">-</span><span class="pln">color</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token hexcode"><span class="com">#fff</span></span><span class="token punctuation"><span class="com">;</span></span>
  <span class="token property"><span class="pln">background</span><span class="pun">-</span><span class="pln">size</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">95</span><span class="pun">%</span></span> <span class="kwd">auto</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">background</span><span class="pun">-</span><span class="pln">position</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">50</span><span class="pun">%</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">background</span><span class="pun">-</span><span class="pln">repeat</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="kwd">no</span><span class="pun">-</span><span class="pln">repeat</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pun">-</span><span class="pln">webkit</span><span class="pun">-</span><span class="pln">box</span><span class="pun">-</span><span class="pln">shadow</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">0</span></span> <span class="token number"><span class="lit">0</span></span> <span class="token number"><span class="lit">5</span></span><span class="lit">px</span> <span class="token number"><span class="lit">1</span></span><span class="lit">px</span> <span class="token function"><span class="pln">rgba</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token number"><span class="lit">0</span></span><span class="pun">,</span><span class="token number"><span class="lit">0</span></span><span class="pun">,</span><span class="token number"><span class="lit">0</span></span><span class="pun">,</span><span class="token number"><span class="pun">.</span><span class="lit">3</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">box</span><span class="pun">-</span><span class="pln">shadow</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">0</span></span> <span class="token number"><span class="lit">0</span></span> <span class="token number"><span class="lit">5</span></span><span class="lit">px</span> <span class="token number"><span class="lit">1</span></span><span class="lit">px</span> <span class="token function"><span class="pln">rgba</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token number"><span class="lit">0</span></span><span class="pun">,</span><span class="token number"><span class="lit">0</span></span><span class="pun">,</span><span class="token number"><span class="lit">0</span></span><span class="pun">,</span><span class="token number"><span class="pun">.</span><span class="lit">3</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">opacity</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">0</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">filter</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token function"><span class="pln">alpha</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="pln">opacify</span><span class="pun">=</span><span class="token number"><span class="lit">0</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">;</span></span>
<span class="token punctuation"><span class="pun">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">sns</span><span class="pun">-</span><span class="pln">wx</span></span><span class="pln"> span</span><span class="token pseudo-element"><span class="pun">:</span><span class="pln">after</span></span> </span><span class="token punctuation"><span class="pun">{</span></span>
  <span class="token property"><span class="pln">position</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">absolute</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">bottom</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pun">-</span><span class="token number"><span class="lit">16</span></span><span class="lit">px</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">left</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">50</span><span class="pun">%</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">width</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">0</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">height</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">0</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">margin</span><span class="pun">-</span><span class="pln">left</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pun">-</span><span class="token number"><span class="lit">8</span></span><span class="lit">px</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">line</span><span class="pun">-</span><span class="pln">height</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">0</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">border</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">8</span></span><span class="lit">px</span><span class="pln"> solid transparent</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">border</span><span class="pun">-</span><span class="pln">top</span><span class="pun">-</span><span class="pln">color</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token hexcode"><span class="com">#fff</span></span><span class="token punctuation"><span class="com">;</span></span>
  <span class="token property"><span class="pln">content</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token string"><span class="str">""</span></span><span class="token punctuation"><span class="pun">;</span></span>
<span class="token punctuation"><span class="pun">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">sns</span><span class="pun">-</span><span class="pln">wx</span></span><span class="token pseudo-class"><span class="pun">:</span><span class="pln">hover</span></span> </span><span class="token punctuation"><span class="pun">{</span></span>
  <span class="token property"><span class="pln">overflow</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">visible</span><span class="token punctuation"><span class="pun">;</span></span>
<span class="token punctuation"><span class="pun">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">sns</span><span class="pun">-</span><span class="pln">wx</span></span><span class="token pseudo-class"><span class="pun">:</span><span class="pln">hover</span></span><span class="pln"> span </span></span><span class="token punctuation"><span class="pun">{</span></span>
  <span class="token property"><span class="pln">top</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pun">-</span><span class="token number"><span class="lit">165</span></span><span class="lit">px</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">opacity</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">1</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">filter</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token function"><span class="pln">alpha</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="pln">opacify</span><span class="pun">=</span><span class="token number"><span class="lit">100</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">;</span></span>
<span class="token punctuation"><span class="pun">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">footer</span><span class="pun">-</span><span class="pln">col</span></span> </span><span class="token punctuation"><span class="pun">{</span></span>
  <span class="token property"><span class="pln">display</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="kwd">inline</span><span class="pun">-</span><span class="pln">block</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">font</span><span class="pun">-</span><span class="pln">size</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">0</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">vertical</span><span class="pun">-</span><span class="pln">align</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">middle</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">color</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token hexcode"><span class="com">#ffffff</span></span><span class="token punctuation"><span class="com">;</span></span>
<span class="token punctuation"><span class="pun">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">footer</span><span class="pun">-</span><span class="pln">col</span></span><span class="pln"> hover </span></span><span class="token punctuation"><span class="pun">{</span></span>
  <span class="token property"><span class="pln">color</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token hexcode"><span class="com">#6199F9</span></span><span class="token punctuation"><span class="com">;</span></span>
<span class="token punctuation"><span class="pun">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">footer</span><span class="pun">-</span><span class="pln">sns</span></span> </span><span class="token punctuation"><span class="pun">{</span></span>
  <span class="token property"><span class="pln">display</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="kwd">inline</span><span class="pun">-</span><span class="pln">block</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">margin</span><span class="pun">-</span><span class="pln">top</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pun">-</span><span class="token number"><span class="lit">10</span></span><span class="lit">px</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">font</span><span class="pun">-</span><span class="pln">size</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">0</span></span><span class="token punctuation"><span class="pun">;</span></span>
<span class="token punctuation"><span class="pun">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">footer</span><span class="pun">-</span><span class="pln">sns</span></span><span class="pln"> a</span><span class="pun">,</span><span class="token class"><span class="pun">.</span><span class="pln">sec</span><span class="pun">-</span><span class="pln">panel</span><span class="pun">-</span><span class="pln">head</span></span><span class="pln"> small </span></span><span class="token punctuation"><span class="pun">{</span></span>
  <span class="token property"><span class="pln">display</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="kwd">inline</span><span class="pun">-</span><span class="pln">block</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">vertical</span><span class="pun">-</span><span class="pln">align</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">top</span><span class="token punctuation"><span class="pun">;</span></span>
<span class="token punctuation"><span class="pun">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">footer</span><span class="pun">-</span><span class="pln">sns</span></span><span class="pln"> a </span></span><span class="token punctuation"><span class="pun">{</span></span>
  <span class="token property"><span class="pln">margin</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">7</span></span><span class="lit">px</span> <span class="token number"><span class="lit">0</span></span> <span class="token number"><span class="lit">7</span></span><span class="lit">px</span> <span class="token number"><span class="lit">10</span></span><span class="lit">px</span><span class="token punctuation"><span class="pun">;</span></span>
<span class="token punctuation"><span class="pun">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">footer</span><span class="pun">-</span><span class="pln">sns</span></span> <span class="token class"><span class="pun">.</span><span class="pln">fa</span></span> </span><span class="token punctuation"><span class="pun">{</span></span>
  <span class="token property"><span class="pln">display</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="kwd">inline</span><span class="pun">-</span><span class="pln">block</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">position</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">relative</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">width</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">40</span></span><span class="lit">px</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">height</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">40</span></span><span class="lit">px</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">font</span><span class="pun">-</span><span class="pln">size</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">20</span></span><span class="lit">px</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">line</span><span class="pun">-</span><span class="pln">height</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">40</span></span><span class="lit">px</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">border</span><span class="pun">-</span><span class="pln">radius</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">50</span><span class="pun">%</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">text</span><span class="pun">-</span><span class="pln">align</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">center</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">background</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token function"><span class="pln">rgba</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token number"><span class="lit">255</span></span><span class="pun">,</span><span class="token number"><span class="lit">255</span></span><span class="pun">,</span><span class="token number"><span class="lit">255</span></span><span class="pun">,</span><span class="token number"><span class="pun">.</span><span class="lit">1</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">color</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token function"><span class="pln">hsl</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token number"><span class="lit">0</span></span><span class="lit">deg</span> <span class="token number"><span class="lit">0</span><span class="pun">%</span></span> <span class="token number"><span class="lit">100</span><span class="pun">%</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">z</span><span class="pun">-</span><span class="pln">index</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">0</span></span><span class="token punctuation"><span class="pun">;</span></span>
<span class="token punctuation"><span class="pun">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">footer</span><span class="pun">-</span><span class="pln">sns</span></span> <span class="token class"><span class="pun">.</span><span class="pln">fa</span></span><span class="pln"> svg</span><span class="pun">,</span><span class="token class"><span class="pun">.</span><span class="pln">footer</span><span class="pun">-</span><span class="pln">sns</span></span> <span class="token class"><span class="pun">.</span><span class="pln">fa</span></span><span class="token pseudo-element"><span class="pun">:</span><span class="pln">before</span></span> </span><span class="token punctuation"><span class="pun">{</span></span>
  <span class="token property"><span class="pln">position</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">relative</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">z</span><span class="pun">-</span><span class="pln">index</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">1</span></span><span class="token punctuation"><span class="pun">;</span></span>
<span class="token punctuation"><span class="pun">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">footer</span><span class="pun">-</span><span class="pln">sns</span></span> <span class="token class"><span class="pun">.</span><span class="pln">fa</span></span><span class="token pseudo-element"><span class="pun">:</span><span class="pln">after</span></span> </span><span class="token punctuation"><span class="pun">{</span></span>
  <span class="token property"><span class="pln">position</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">absolute</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">left</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">0</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">top</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">0</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">width</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">100</span><span class="pun">%</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">height</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">100</span><span class="pun">%</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">background</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token hexcode"><span class="com">#3380ff</span></span><span class="token punctuation"><span class="com">;</span></span>
  <span class="token property"><span class="pln">border</span><span class="pun">-</span><span class="pln">radius</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">50</span><span class="pun">%</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">content</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token string"><span class="str">""</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">opacity</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">0</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">filter</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token function"><span class="pln">alpha</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="pln">opacify</span><span class="pun">=</span><span class="token number"><span class="lit">0</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pun">-</span><span class="pln">webkit</span><span class="pun">-</span><span class="pln">transform</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token function"><span class="pln">scale</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token number"><span class="lit">0</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pun">-</span><span class="pln">ms</span><span class="pun">-</span><span class="pln">transform</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token function"><span class="pln">scale</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token number"><span class="lit">0</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">transform</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token function"><span class="pln">scale</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token number"><span class="lit">0</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">;</span></span>
<span class="token punctuation"><span class="pun">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">footer</span><span class="pun">-</span><span class="pln">sns</span></span> <span class="token class"><span class="pun">.</span><span class="pln">fa</span><span class="pun">.</span><span class="pln">material</span><span class="pun">-</span><span class="pln">icons</span></span><span class="token pseudo-element"><span class="pun">:</span><span class="pln">after</span></span> </span><span class="token punctuation"><span class="pun">{</span></span>
  <span class="token property"><span class="pln">z</span><span class="pun">-</span><span class="pln">index</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pun">-</span><span class="token number"><span class="lit">1</span></span><span class="token punctuation"><span class="pun">;</span></span>
<span class="token punctuation"><span class="pun">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">footer</span><span class="pun">-</span><span class="pln">sns</span></span> <span class="token class"><span class="pun">.</span><span class="pln">fa</span></span><span class="token pseudo-class"><span class="pun">:</span><span class="pln">hover</span></span> </span><span class="token punctuation"><span class="pun">{</span></span>
  <span class="token property"><span class="pln">color</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token hexcode"><span class="com">#fff</span></span><span class="token punctuation"><span class="com">;</span></span>
<span class="token punctuation"><span class="pun">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">footer</span><span class="pun">-</span><span class="pln">sns</span></span> <span class="token class"><span class="pun">.</span><span class="pln">fa</span></span><span class="token pseudo-class"><span class="pun">:</span><span class="pln">hover</span></span><span class="token pseudo-element"><span class="pun">:</span><span class="pln">after</span></span> </span><span class="token punctuation"><span class="pun">{</span></span>
  <span class="token property"><span class="pun">-</span><span class="pln">webkit</span><span class="pun">-</span><span class="pln">transform</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token function"><span class="pln">scale</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token number"><span class="lit">1</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pun">-</span><span class="pln">ms</span><span class="pun">-</span><span class="pln">transform</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token function"><span class="pln">scale</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token number"><span class="lit">1</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">transform</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token function"><span class="pln">scale</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token number"><span class="lit">1</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">opacity</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">1</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">filter</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token function"><span class="pln">alpha</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="pln">opacify</span><span class="pun">=</span><span class="token number"><span class="lit">100</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pun">-</span><span class="pln">webkit</span><span class="pun">-</span><span class="pln">transition</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">all </span><span class="token number"><span class="pun">.</span><span class="lit">5</span></span><span class="lit">s</span> <span class="token function"><span class="pln">cubic</span><span class="pun">-</span><span class="pln">bezier</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token number"><span class="pun">.</span><span class="lit">3</span></span><span class="pun">,</span><span class="token number"><span class="lit">0</span></span><span class="pun">,</span><span class="token number"><span class="lit">0</span></span><span class="pun">,</span><span class="token number"><span class="lit">1.3</span></span><span class="token punctuation"><span class="pun">)</span></span> <span class="token number"><span class="lit">0</span></span><span class="lit">s</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pun">-</span><span class="pln">o</span><span class="pun">-</span><span class="pln">transition</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">all </span><span class="token number"><span class="pun">.</span><span class="lit">5</span></span><span class="lit">s</span> <span class="token function"><span class="pln">cubic</span><span class="pun">-</span><span class="pln">bezier</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token number"><span class="pun">.</span><span class="lit">3</span></span><span class="pun">,</span><span class="token number"><span class="lit">0</span></span><span class="pun">,</span><span class="token number"><span class="lit">0</span></span><span class="pun">,</span><span class="token number"><span class="lit">1.3</span></span><span class="token punctuation"><span class="pun">)</span></span> <span class="token number"><span class="lit">0</span></span><span class="lit">s</span><span class="token punctuation"><span class="pun">;</span></span>
  <span class="token property"><span class="pln">transition</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">all </span><span class="token number"><span class="pun">.</span><span class="lit">5</span></span><span class="lit">s</span> <span class="token function"><span class="pln">cubic</span><span class="pun">-</span><span class="pln">bezier</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token number"><span class="pun">.</span><span class="lit">3</span></span><span class="pun">,</span><span class="token number"><span class="lit">0</span></span><span class="pun">,</span><span class="token number"><span class="lit">0</span></span><span class="pun">,</span><span class="token number"><span class="lit">1.3</span></span><span class="token punctuation"><span class="pun">)</span></span> <span class="token number"><span class="lit">0</span></span><span class="lit">s</span><span class="token punctuation"><span class="pun">;</span></span>
<span class="token punctuation"><span class="pun">}</span></span>

3、修改名片样式

3.1 修改侧栏文件

wp-content/themes/Puock/inc/fun/widget.php第599行开始修改row mt10块

<span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">div</span> <span class="token attr-name"><span class="atn">class</span></span><span class="token attr-value"><span class="token punctuation"><span class="pun">=</span></span><span class="token punctuation"><span class="atv">"</span></span><span class="atv">mt10 author_count</span><span class="token punctuation"><span class="atv">"</span></span></span><span class="token punctuation"><span class="tag">></span></span></span> 
     <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">ul</span><span class="token punctuation"><span class="tag">></span></span></span>                   
         <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">li</span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">span</span><span class="token punctuation"><span class="tag">></span></span></span><span class="pln">文章数</span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">span</span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">strong</span><span class="token punctuation"><span class="tag">></span></span></span><span class="token php language-php"><span class="token delimiter important"><span class="pun"><?</span><span class="pln">php</span></span> <span class="token function"><span class="pln">the_author_posts</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token punctuation"><span class="pun">)</span></span><span class="token punctuation"><span class="pun">;</span></span> <span class="token delimiter important"><span class="pun">?></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">strong</span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">li</span><span class="token punctuation"><span class="tag">></span></span></span>
         <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">li</span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">span</span><span class="token punctuation"><span class="tag">></span></span></span><span class="pln">浏览量</span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">span</span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">strong</span><span class="token punctuation"><span class="tag">></span></span></span><span class="token php language-php"><span class="token delimiter important"><span class="pun"><?</span><span class="pln">php</span></span> <span class="token keyword keyword-echo"><span class="pln">echo</span></span> <span class="token function"><span class="pln">get_total_views</span></span><span class="token punctuation"><span class="pun">(</span></span><span class="token punctuation"><span class="pun">)</span></span> <span class="token delimiter important"><span class="pun">?></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">strong</span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">li</span><span class="token punctuation"><span class="tag">></span></span></span>                    
         <span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">li</span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">span</span><span class="token punctuation"><span class="tag">></span></span></span><span class="pln">评论数</span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">span</span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"><</span></span><span class="tag">strong</span><span class="token punctuation"><span class="tag">></span></span></span><span class="token php language-php"><span class="token delimiter important"><span class="pun"><?</span><span class="pln">php</span></span> <span class="token keyword keyword-echo"><span class="pln">echo</span></span> <span class="token variable"><span class="pln">$comment_num</span></span> <span class="token delimiter important"><span class="pun">?></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">strong</span><span class="token punctuation"><span class="tag">></span></span></span><span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">li</span><span class="token punctuation"><span class="tag">></span></span></span>
     <span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">ul</span><span class="token punctuation"><span class="tag">></span></span></span>
<span class="token tag"><span class="token punctuation"><span class="tag"></</span></span><span class="tag">div</span><span class="token punctuation"><span class="tag">></span></span></span>

3.2 添加样式

<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">author_count</span></span><span class="pln"> ul </span></span><span class="token punctuation"><span class="pun">{</span></span><span class="token property"><span class="pln">display</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pun">-</span><span class="pln">moz</span><span class="pun">-</span><span class="pln">flex</span><span class="token punctuation"><span class="pun">;</span></span><span class="token property"><span class="pln">display</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pun">-</span><span class="pln">ms</span><span class="pun">-</span><span class="pln">flex</span><span class="token punctuation"><span class="pun">;</span></span><span class="token property"><span class="pln">display</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pun">-</span><span class="pln">o</span><span class="pun">-</span><span class="pln">flex</span><span class="token punctuation"><span class="pun">;</span></span><span class="token property"><span class="pln">display</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">flex</span><span class="token punctuation"><span class="pun">;</span></span><span class="token property"><span class="pln">text</span><span class="pun">-</span><span class="pln">align</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">center</span><span class="token punctuation"><span class="pun">;</span></span><span class="token property"><span class="pln">margin</span><span class="pun">-</span><span class="pln">left</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">0</span></span><span class="token punctuation"><span class="pun">;</span></span><span class="token punctuation"><span class="pun">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">author_count</span></span><span class="pln"> ul li </span></span><span class="token punctuation"><span class="pun">{</span></span><span class="token property"><span class="kwd">float</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">left</span><span class="token punctuation"><span class="pun">;</span></span><span class="token property"><span class="pln">list</span><span class="pun">-</span><span class="pln">style</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">none</span><span class="token punctuation"><span class="pun">;</span></span><span class="token property"><span class="pln">width</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">33.333</span><span class="pun">%</span></span><span class="token punctuation"><span class="pun">;</span></span><span class="token property"><span class="pln">border</span><span class="pun">-</span><span class="pln">right</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">1</span></span><span class="lit">px</span> <span class="token hexcode"><span class="com">#efefef</span></span><span class="com"> solid</span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">padding</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">8</span></span><span class="com">px </span><span class="token number"><span class="com">0</span></span><span class="token punctuation"><span class="com">;</span></span><span class="token property"><span class="com">font-weight</span></span><span class="token punctuation"><span class="com">:</span></span><span class="token number"><span class="com">300</span></span><span class="token punctuation"><span class="com">;</span></span><span class="token punctuation"><span class="com">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">author_count</span></span><span class="pln"> ul li</span><span class="token pseudo-class"><span class="pun">:</span><span class="kwd">last</span><span class="pun">-</span><span class="pln">child</span></span> </span><span class="token punctuation"><span class="pun">{</span></span><span class="token property"><span class="pln">border</span><span class="pun">-</span><span class="pln">right</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">1</span></span><span class="lit">px</span><span class="pln"> solid transparent</span><span class="token punctuation"><span class="pun">;</span></span><span class="token punctuation"><span class="pun">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">author_count</span></span><span class="pln"> ul li span </span></span><span class="token punctuation"><span class="pun">{</span></span><span class="token property"><span class="pln">display</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">block</span><span class="token punctuation"><span class="pun">;</span></span><span class="token property"><span class="pln">font</span><span class="pun">-</span><span class="pln">size</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token number"><span class="lit">14</span></span><span class="lit">px</span><span class="token punctuation"><span class="pun">;</span></span><span class="token property"><span class="pln">color</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="token hexcode"><span class="com">#999</span></span><span class="token punctuation"><span class="com">;</span></span><span class="token punctuation"><span class="com">}</span></span>
<span class="token selector"><span class="token class"><span class="pun">.</span><span class="pln">author_count</span></span><span class="pln"> ul li strong </span></span><span class="token punctuation"><span class="pun">{</span></span><span class="token property"><span class="pln">font</span><span class="pun">-</span><span class="pln">weight</span></span><span class="token punctuation"><span class="pun">:</span></span><span class="pln">bold</span><span class="token punctuation"><span class="pun">;</span></span><span class="token punctuation"><span class="pun">}</span></span>

4、顶栏登录选项

未登录则顶栏显示登录选项

在wp-content/themes/Puock/inc/fun/core.php第589行添加代码

<span class="token keyword keyword-else"><span class="kwd">else</span></span> <span class="token punctuation"><span class="pun">{</span></span>
        <span class="token variable"><span class="pln">$out</span></span> <span class="token punctuation"><span class="pun">.</span></span><span class="token operator"><span class="pun">=</span></span> <span class="token single-quoted-string string"><span class="str">'<li><a data-no-instant class="p-2" data-toggle="tooltip" title="用户登录" href="/wp-login.php">登录</a></li>'</span></span><span class="token punctuation"><span class="pun">;</span></span>
    <span class="token punctuation"><span class="pun">}</span></span>
© 版权声明

1. 本站所有资源来源于用户上传和网络，如有侵权请邮件联系站长118194359@qq.com！

2. 分享目的仅供学习和交流，下载后请在24小时内删除！

3. 严禁非法商业使用和违反国家法律，后果自负！

4. 本站提供的资源仅包含源码、模板、插件等，不提供技术服务，敬请理解！

5. 如有下载链接失效、无法下载或存在广告，请联系管理员处理！

6. 本站资源售价只是赞助，用于维持日常运营所需费用！

7. 如遇到加密压缩包，请使用WINRAR解压，解压遇到问题请联系管理员！

8. 源码未经详细测试和修改，请使用前自行甄别，无法分辨病毒和误报的部分源码。
9. 源码为可复制产品，不提供退款。

THE END
网站源码
# 免费# wp# im# ps# 功能# 文件# 视频# 代码# 主题# 插件# 图片# 开源# 小程序# 登录# 优化# 亲测# WordPress# 音乐# 公众号# qq# CSS# java# 大气# WordPress插件
喜欢就支持一下吧
点赞13 分享
榆桦资源网的头像-榆桦源码网超凡捐助大使
小蓝视频破解+去梆梆加固教程-榆桦源码网
小蓝视频破解+去梆梆加固教程
小蓝视频破解+去梆梆加固教程
4年前 3.7W+
【教程】绿巨人3.2破解详细教学-榆桦源码网
【教程】绿巨人3.2破解详细教学
【教程】绿巨人3.2破解详细教学
4年前 1.3W+
榆桦资源网推广计划，推广可获高额奖励（会员优惠活动即将开始）-榆桦源码网
榆桦资源网推广计划，推广可获高额奖励（会员优惠活动即将开始）
榆桦资源网推广计划，推广可获高额奖励（会员优惠活动即将开始）
4年前 1.1W+
[精品软件] 乐咔相机V1.00相机功能强大-榆桦源码网
[精品软件] 乐咔相机V1.00相机功能强大
[精品软件] 乐咔相机V1.00相机功能强大
4年前 1.1W+
【发展期会员优惠】功能介绍&需求调查-榆桦源码网
【发展期会员优惠】功能介绍&需求调查
【发展期会员优惠】功能介绍&需求调查
4年前 7608
【精品源码】SR自动连刷暗雷lei-榆桦源码网
【精品源码】SR自动连刷暗雷lei
【精品源码】SR自动连刷暗雷lei
3年前 7535
相关推荐
【精品源码】SR自动连刷暗雷lei-榆桦源码网
【精品源码】SR自动连刷暗雷lei
【精品源码】SR自动连刷暗雷lei
3年前 7535
【榆桦首发】价值150元 HYBBS模板大牛窝社区ND_mobile手机模板v2.7.2 免授权-榆桦源码网
【榆桦首发】价值150元 HYBBS模板大牛窝社区ND_mobile手机模板v2.7.2 免授权
【榆桦首发】价值150元 HYBBS模板大牛窝社区ND_mobile手机模板v2.7.2 免授权
4年前 5912
二开最新漫画小说听书三合一分销平台完整源码/整合免签约支付接口/搭建教程/火车头采集接口-榆桦源码网
二开最新漫画小说听书三合一分销平台完整源码/整合免签约支付接口/搭建教程/火车头采集接口
二开最新漫画小说听书三合一分销平台完整源码/整合免签约支付接口/搭建教程/火车头采集接口
3年前 3948
【榆桦亲测完整版】2021最新个人免签支付Java版 雨荷云码支付码支付易支付个人/企业支付宝微信二维码收款app监控-榆桦源码网
【榆桦亲测完整版】2021最新个人免签支付Java版 雨荷云码支付码支付易支付个人/企业支付宝微信二维码收款app监控
【榆桦亲测完整版】2021最新个人免签支付Java版 雨荷云码支付码支付易支付个人/企业支付宝微信二...
4年前 3292
【榆桦亲测】无限坐席在线客服系统源码-榆桦源码网
【榆桦亲测】无限坐席在线客服系统源码
【榆桦亲测】无限坐席在线客服系统源码
3年前 3231
【大话西游2】单机虚拟机一键服务端单机-榆桦源码网
【大话西游2】单机虚拟机一键服务端单机
【大话西游2】单机虚拟机一键服务端单机
3年前 3205
评论 抢沙发

请登录后发表评论

    暂无评论内容

默认头像

免费内容
图片