网站最后更新日期:2018年8月29日
欢迎大家来到畅想资源 AREFLY.COM! 个人网站 更多联络方式
×

給WordPress添加「加載中」動畫

今天教大家一個在你WordPress網站訪問有點慢時,可以提高用戶體驗的純CSS加載中」動畫

外掛(插件)版

一、添加CSS動畫代碼

1、這是最主要的一個步驟,用處時來顯示加載中的動畫

2、把下列代碼添加到你主題的「樣式表 (style.css)」文件內添加下列代碼就可以啦

二、添加顯示代碼

1、這一步的用處是把前面的CSS代碼顯示出來

2、在主題內的「頁首 (header.php)」文件的 <body> 後同樣添加下列代碼

三、添加jQuery漸隱效果

1、這個步驟是用於在網頁加載完成後是加載動畫漸漸消失,而不是一直不停地轉動

2、在「頁尾 (footer.php)」內的 </body> 前添加下列代碼就完咯

預覽

本頁左下角會永遠旋轉「加載中」動畫

wordpress-loading-preview

參考

WordPress页面加载时显示旋转的圆圈

總結

1、完成以上步驟後要清空快取才能顯示效果 :razz:

2、有問題可以回覆 :mrgreen:

觉得这篇文章有用吗?分享一下让更多人受益吧!

© 版权声明:本文章采用“姓名标示-非商业性-相同方式分享 4.0 国际(CC BY-NC-SA 4.0)”于“”发布,转载时须以相同方式发布并注明“原文链接”!

本文固定链接:https://www.arefly.com/wordpress-loading/

本文章由“超级efly”于2013年07月18日发表于“WordPress”分类

你可以发表评论,并在保留原文地址及作者的情况下引用到你的网站

转载请注明:給WordPress添加「加載中」動畫 | 畅想资源

关键字:, ,

給WordPress添加「加載中」動畫:目前有 45 条留言
访客以 25:20 大幅领先博主

评论载入中,请稍等……
  1. 14楼
    feiyaj China Google Chrome Windows

    感谢 一下就成功了

    [回复]
  2. 13楼
    西贝博客 China Safari Mac OS

    哈哈,这个还挺好玩的,炫炫的。

    [回复]
  3. 12楼
    小忆 China Mozilla Firefox Windows

    好文章 对我很有帮助

    [回复]
    • 小忆 China Mozilla Firefox Windows

      随便问一下 进入页面的前几秒有 后面就消失了

      [回复]
  4. 11楼
    四弦 China Google Chrome Windows

    博主同志,经查,你的插件不支持HHVM
    在我的服务器上你的插件导致我博客直接白掉。。。

    [回复]
    • 其實並不只是我的外掛的問題,而是HHVM對PHP的支持始終不是很好,所以如果外掛無法使用,推薦使用純代碼方式自行添加,謝謝! :razz:

      [回复]
      • 四弦 China Google Chrome Windows

        哎……HHVM快是快,就是支持不是很好……
        我原来的主题也不支持,只能弃主题保HHVM

        [回复]
        • 其實速度真的並沒有這麼重要,整體網站的外觀、內容才是最重要的,而且現在PHP也不是很慢吧? :?:

          [回复]
  5. 10楼
    我就有 China Google Chrome Windows

    很喜欢这个,很酷,我把他改了永久转! :mrgreen: