WordPress怎樣設置菜單欄旋轉小圖標

最近我在瀏覽別的博客的文章時，無意間發現了一個很好看的小裝飾。那就是在WordPress菜單欄上的小圖標。於是我研究了研究，弄到了設置方法之後決定把它分享出來。

菜單欄的小圖標

設置步驟：

1， 我們先到WordPress後臺--插件--安裝插件頁面 搜索：Font Awesome 4 Menus，下載安裝並啟用。

2， WordPress後臺---外觀---菜單，點開顯示選項，並且勾選上CSS類，於是在下麵的菜單中就有了CSS類（可選）

如圖所示

3， 打開這個圖標選擇網站：https://fortawesome.github.io/Font-Awesome/icons/ 點開一個認為合適的圖標字體，在下會顯示類似這樣的CSS代碼

1. 1 <i class="fa fa-home"></i>

    

4，我們複製代碼中間像“fa fa-home”的內容粘貼到菜單欄的CSS類中，保存之後到網站上查看就OK了。

註：首碼儘量為fa fa-XXXX如果為fas fa-XXXX可能會顯示不出來！！！

菜單欄圖標轉動方法：

首先在主題的CSS代碼中添加如下代碼：

1. 1 <br>
   2 .fa-spin {
   3 animation: 2s linear 0s normal none infinite running fa-spin;
   4 }

    

然後在菜單里，在我們剛纔設置的fa fa-XXXX後面添加上fa-spin就好了，或者是直接添加以下代碼：

1. <i class="fa fa-wordpress fa-spin"></i>WaZty博客

    

保存之後刷新博客，你就能看到旋轉的小圖標了！