Title: KineticHub Page Loader Author: kinetichub Published: June 29, 2026 Last modified: June 29, 2026 --- Search plugins ![](https://ps.w.org/kinetichub-page-loader/assets/banner-772x250.png?rev=3589870) ![](https://ps.w.org/kinetichub-page-loader/assets/icon-256x256.png?rev=3589870) # KineticHub Page Loader By [kinetichub](https://profiles.wordpress.org/kinetichub/) [Download](https://downloads.wordpress.org/plugin/kinetichub-page-loader.1.1.0.zip) * [Details](https://wordpress.org/plugins/kinetichub-page-loader/#description) * [Reviews](https://wordpress.org/plugins/kinetichub-page-loader/#reviews) * [Installation](https://wordpress.org/plugins/kinetichub-page-loader/#installation) * [Development](https://wordpress.org/plugins/kinetichub-page-loader/#developers) [Support](https://wordpress.org/support/plugin/kinetichub-page-loader/) ## Description KineticHub Page Loader lets you display a branded loading screen as your WordPress site is being rendered. It covers the page with your logo, site name, or a tagline– then cleanly fades out and removes itself from the DOM once the page is ready. It is designed to improve the **perceived first impression** of your site by showing polished, intentional branding instead of a blank white page during the initial load. It does not improve server response time or actual page speed. The loader is built with CSS-first animations and visual effects, vanilla JavaScript, and no external dependencies. It includes display rules for audience targeting, frequency controls, and exclusions for specific pages, URL paths, and WooCommerce pages. It respects user accessibility preferences, cleans up after itself, and is safe to use alongside caching plugins. **Key highlights:** * No jQuery dependency * No external fonts, CDN assets, or remote requests * CSS-first visual effects and seven polished presets * Logo effects: fade, grayscale reveal, and soft scale * Logo shapes: original, rounded corners, and circle * Animated loading ring with style, color, speed, and thickness controls * Display rules: visitors only, site-wide or homepage, excluded post/page IDs, excluded URL paths * WooCommerce-safe exclusions for cart, checkout, and account pages * Show frequency: every page load, once per session, or once per day * No-flash suppression for once-per-session and once-per-day modes * Respects `prefers-reduced-motion` – animations are collapsed for users who prefer reduced motion * Loader is removed from the DOM after hiding, so it has no lasting impact on the page * No focus trap – keyboard and screen reader users are not locked into the loader * Maximum timeout safety – the loader always disappears, even if a resource never loads * Compatible with classic themes, block themes, and WooCommerce ### Features * **Enable / disable** the loader from the settings screen * **Display on:** entire site or homepage only * **Audience:** everyone, or visitors only (hides the loader for logged-in users) * **Show frequency:** every page load, once per session, or once per day * **Excluded post/page IDs:** suppress the loader on specific posts or pages by ID * **Excluded URL paths:** suppress the loader on specific URL paths * **WooCommerce exclusions:** optionally exclude cart, checkout, and account pages when WooCommerce is active * **Logo:** upload via the WordPress media library * **Text fallback:** shown when no logo is set; falls back to the site name if empty * **Tagline:** optional short line displayed beneath the logo or text * **Logo effects:** fade in, grayscale reveal, or soft scale entrance animation * **Logo shapes:** original, rounded corners, or circular logo frame * **Loading ring:** animated ring around the logo with solid, dashed, dual, or glow styles; adjustable color, thickness, and speed * **Seven animation presets:** each is a CSS-only visual effect with no JavaScript dependency * **Colors:** background, accent, and text colors with optional gradient background * **Timing controls:** minimum display time, maximum timeout, and fade-out duration * **Visibility:** independently enable or disable the loader on desktop and mobile ### Included Loader Styles 1. **Minimal Pulse** – Content breathes gently while an accent dot pulses below 2. **Logo Fade** – Content rises and fades in; a pulsing accent line signals loading 3. **Gradient Sweep** – An animated gradient flows across the background 4. **Soft Orb** – A radial glow breathes behind the logo and content 5. **Progress Bar Minimal** – A thin bar advances across the top as the loader waits 6. **Circular Brand Ring** – Logo displayed in a circle with two counter-rotating accent rings 7. **Logo Color Reveal** – Logo animates from grayscale to full color as the loader displays All presets automatically collapse to an instant transition when `prefers-reduced- motion: reduce` is detected. ## Installation 1. Upload the `kinetichub-page-loader` folder to `/wp-content/plugins/`, or install directly through the WordPress plugin directory. 2. Activate the plugin through the **Plugins** screen in WordPress. 3. Go to **Settings -> Page Loader** to configure your loader. 4. Upload your logo, choose a preset, set your colors, and save. ## FAQ ### Does this make my website faster? No. KineticHub Page Loader does not improve server response time or optimize assets. It creates a branded loading layer that can improve the **perceived first impression** of your site while the page finishes rendering in the background. ### Does it work with caching plugins? Yes. The loader HTML is output server-side and cached normally. Session and daily- limit tracking are handled entirely client-side using `sessionStorage` and `localStorage`, so no server-side session state is needed and full-page-cache compatibility is maintained. ### Does it use jQuery? No. The frontend script is plain vanilla JavaScript with no library dependencies. ### What happens if JavaScript is disabled? A `