Title: WP Smart Preloader
Author: catchsquare
Published: <strong>2015 年 12 月 18 日</strong>
Last modified: 2024 年 10 月 27 日

---

搜尋外掛

![](https://ps.w.org/wp-smart-preloader/assets/banner-772x250.jpg?rev=1312662)

這個外掛**並未在最新的 3 個 WordPress 主要版本上進行測試**。開發者可能不再對這個
外掛進行維護或提供技術支援，並可能會與更新版本的 WordPress 產生使用上的相容性問題。

![](https://ps.w.org/wp-smart-preloader/assets/icon-256x256.jpg?rev=1312662)

# WP Smart Preloader

 由 [catchsquare](https://profiles.wordpress.org/catchsquare/) 開發

[下載](https://downloads.wordpress.org/plugin/wp-smart-preloader.1.15.3.zip)

 * [詳細資料](https://tw.wordpress.org/plugins/wp-smart-preloader/#description)
 * [使用者評論](https://tw.wordpress.org/plugins/wp-smart-preloader/#reviews)
 *  [安裝方式](https://tw.wordpress.org/plugins/wp-smart-preloader/#installation)
 * [開發資訊](https://tw.wordpress.org/plugins/wp-smart-preloader/#developers)

 [技術支援](https://wordpress.org/support/plugin/wp-smart-preloader/)

## 外掛說明

WP Smart Preloader is a Simple CSS spinners and throbbers made with CSS and minimal
HTML markup. It offers visual feedback in the event of content being loaded, thereby
managing expectations and reducing the chance of a user abandoning your wordpress
website.

You will find following features with this plugin:

 * Full Responsive with Cross Broser compatible
 * CSS only Preloader no Gif no Image
 * Full Customize.
 * Faster Loading
 * Icon to circle
 * No coding necessary. Activate it and play with its settings and you’re Good to
   go

## 螢幕擷圖

 * [[
 * 1 **WP Smart Preloader Backend Settings**
 * [[
 * 2 **WP Smart Preloader Backend Settings with Custom HTML5 animation and CSS**

## 安裝方式

 1. Download and activate the plugin
 2. Go to `settings` => `WP Smart Preloader`
 3. Choose the Options of your choice
 4. Click `Save changes` button.

Or

 1. Put the plug-in folder `WP Smart Preloader` into [wordpress_dir]/wp-content/plugins/
 2. Go into the WordPress admin interface and activate the plugin
 3. Go to `settings` => `WP Smart Preloader`
 4. Choose the Options of your choice
 5. Click `Save changes` button.

Have fun!!!

## 常見問題集

### What does this plugin do?

 * WP Smart Preloader takes a simple, extendable approach to display Simple CSS 
   spinners and throbbers onto your website

### Still have some questions ?

Please use support forum or you can directly mail us at
 [wearecatchsquare@gmail.com](https://tw.wordpress.org/plugins/wp-smart-preloader/wearecatchsquare@gmail.com?output_format=md)

## 使用者評論

![](https://secure.gravatar.com/avatar/b675b281178c5d586081778ce46cfa88bbd662be2511c19627b1eafe7bbd2303?
s=60&d=retro&r=g)

### 󠀁[Clever but limited](https://wordpress.org/support/topic/clever-but-limited/)󠁿

 [multmediadesigns](https://profiles.wordpress.org/multmediadesigns/) 2024 年 10
月 2 日

Did work out of the install…but, it is on a timer, vs watching for when the actual
heavy loading page completes. I also needed it to run on a particular page and not
the whole site.

![](https://secure.gravatar.com/avatar/b9620b9e6fd29ca376a190453145f8c766c04344ddaa4da10ecd228c56325cff?
s=60&d=retro&r=g)

### 󠀁[Good preloader!](https://wordpress.org/support/topic/good-preloaded/)󠁿

 [silvershine](https://profiles.wordpress.org/silvershine/) 2024 年 3 月 2 日

Once I added the code below to my functions.php file and adjusted the timing it 
works great. I also like the included loading image #1 better than other preloaders.
add_action(‘wp_footer’, function(){ ?> <script> (function($){ $(function () { setTimeout(
function() { jQuery(‘body .smart-page-loader’).fadeOut(500, function() { jQuery(‘
body .smart-page-loader’).css(‘opacity’, 0); }); }, 1500); }); })(jQuery); </script
> <?php });

![](https://secure.gravatar.com/avatar/6cfc8c01f1ea3a75ec6f7dba8f2a014ef4cca4fd63a50fb3c8772e492e472ecc?
s=60&d=retro&r=g)

### 󠀁[It is not a CSS Only Preloader (as advertised)](https://wordpress.org/support/topic/it-is-not-a-css-only-preloader-as-advertised/)󠁿

 [Dennis Bareis](https://profiles.wordpress.org/dbareis/) 2023 年 3 月 8 日

It will cause a blank page to be displayed if Javascript is turned off.

![](https://secure.gravatar.com/avatar/63646ef9cd25c1429291f2b98591f6344bc816d886dd13e56a9fb3c202ad9375?
s=60&d=retro&r=g)

### 󠀁[the best](https://wordpress.org/support/topic/the-best-2097/)󠁿

 [hoceinabbasi](https://profiles.wordpress.org/hoceinabbasi/) 2021 年 6 月 29 日

best preload plugin

![](https://secure.gravatar.com/avatar/b70de00ff3736bfb4cd04b66ba7df41101002a337a8eb7be1007bc18196915b1?
s=60&d=retro&r=g)

### 󠀁[Works perfectly](https://wordpress.org/support/topic/works-perfectly-2154/)󠁿

 [philsimon](https://profiles.wordpress.org/philsimon/) 2020 年 12 月 10 日

This plug-in does exactly what you’d expect. Love it. I installed it on my site.

![](https://secure.gravatar.com/avatar/409c0d733b0fc1a648c9e4a729c2b47cea5a85acb41d72f28c37cce108d14570?
s=60&d=retro&r=g)

### 󠀁[Not the same from months ago](https://wordpress.org/support/topic/not-the-same-from-months-ago/)󠁿

 [Ve Mer](https://profiles.wordpress.org/vmercader/) 2019 年 8 月 1 日

Used to work great, now it’s creating an weird loop while on WP-admin. Wonder why?

 [ 閱讀全部 25 則使用者評論 ](https://wordpress.org/support/plugin/wp-smart-preloader/reviews/)

## 參與者及開發者

以下人員參與了開源軟體〈WP Smart Preloader〉的開發相關工作。

參與者

 *   [ catchsquare ](https://profiles.wordpress.org/catchsquare/)
 *   [ ashokmhrj ](https://profiles.wordpress.org/ashokmhrj/)
 *   [ subedimadhu ](https://profiles.wordpress.org/subedimadhu/)

[將〈WP Smart Preloader〉外掛本地化為台灣繁體中文版](https://translate.wordpress.org/projects/wp-plugins/wp-smart-preloader)

### 對開發相關資訊感興趣？

任何人均可[瀏覽程式碼](https://plugins.trac.wordpress.org/browser/wp-smart-preloader/)、
查看 [SVN 存放庫](https://plugins.svn.wordpress.org/wp-smart-preloader/)，或透過
[RSS](https://plugins.trac.wordpress.org/log/wp-smart-preloader/?limit=100&mode=stop_on_copy&format=rss)
訂閱[開發記錄](https://plugins.trac.wordpress.org/log/wp-smart-preloader/)。

## 變更記錄

#### 1.15.2

frontend script

#### 1.15.2

just changed version 😉

#### 1.15.1

escaping values

#### 1.15

tested upto wordPress 6.0

#### 1.14

resolved deprecated load function

#### 1.13

tested upto WordPress ver 5.6

#### 1.12

Fixed showing loader in elementor active edit state

#### 1.11.6

change ownership

#### 1.11.5

change version
 tested upto WordPress ver 5.2

#### 1.11.4

change version

#### 1.11.3

change version

#### 1.11.2

fixed console error and warning for showing ace editor js

#### 1.11.1

fixed console error for showing ace editor js

#### 1.11

fixed js for removing class name after page loads

#### 1.10

Fixed link for editor for html and css textarea

#### 1.9

Add editor for html and css textarea

#### 1.8

Add Custom animation and css for loader

#### 1.7

fixed js for removing class after page loads

#### 1.6

fixed loader 5 border to transparent

#### 1.5

fixed showing preloader on page loading

#### 1.4

fixed js to load

#### 1.3

fixed css if only home page is selected (checked)

#### 1.2

fixed showing page before preloader

#### 1.1

Added function to delete setting after uninstall/deleting plugin

#### 1.0

Initial version

## 中繼資料

 *  版本 **1.15.3**
 *  最後更新 **2 年前**
 *  啟用安裝數 **6,000+**
 *  WordPress 版本需求 ** 2.8 或更新版本 **
 *  已測試相容的 WordPress 版本 **6.6.5**
 *  語言
 * [English (US)](https://wordpress.org/plugins/wp-smart-preloader/)
 * 標籤:
 * [posts](https://tw.wordpress.org/plugins/tags/posts/)[preload](https://tw.wordpress.org/plugins/tags/preload/)
   [site preloader](https://tw.wordpress.org/plugins/tags/site-preloader/)[wordpress preloader](https://tw.wordpress.org/plugins/tags/wordpress-preloader/)
 *  [進階檢視](https://tw.wordpress.org/plugins/wp-smart-preloader/advanced/)

## 評分

 4.4 星，滿分為 5 星

 *  [  19 個 5 星使用者評論     ](https://wordpress.org/support/plugin/wp-smart-preloader/reviews/?filter=5)
 *  [  2 個 4 星使用者評論     ](https://wordpress.org/support/plugin/wp-smart-preloader/reviews/?filter=4)
 *  [  1 個 3 星使用者評論     ](https://wordpress.org/support/plugin/wp-smart-preloader/reviews/?filter=3)
 *  [  2 個 2 星使用者評論     ](https://wordpress.org/support/plugin/wp-smart-preloader/reviews/?filter=2)
 *  [  1 個 1 星使用者評論     ](https://wordpress.org/support/plugin/wp-smart-preloader/reviews/?filter=1)

[Your review](https://wordpress.org/support/plugin/wp-smart-preloader/reviews/#new-post)

[查看全部使用者評論](https://wordpress.org/support/plugin/wp-smart-preloader/reviews/)

## 參與者

 *   [ catchsquare ](https://profiles.wordpress.org/catchsquare/)
 *   [ ashokmhrj ](https://profiles.wordpress.org/ashokmhrj/)
 *   [ subedimadhu ](https://profiles.wordpress.org/subedimadhu/)

## 技術支援

使用者可在技術支援論壇提出意見反應或使用問題。

 [檢視技術支援論壇](https://wordpress.org/support/plugin/wp-smart-preloader/)

## 贊助

想要支援這個外掛的發展嗎？

 [ 贊助這個外掛 ](https://www.paypal.com/cgi-bin/webscr?cmd=_donations&business=contact%40catchsquare%2ecom&lc=US&item_name=WP%20smart%20preloader&no_note=0&currency_code=USD&bn=PP%2dDonationsBF%3abtn_donate_SM%2egif%3aNonHostedGuest)