AeroSpin CSS Loading Spinners

AeroSpin CSS Loading Spinners adds a smooth, professional loading overlay to your WordPress site whenever visitors navigate between pages or submit forms. Choose from 100 unique spinner styles, customize the visual behavior, control overlay timing, exclude specific links or paths, and preview changes from a clean settings panel.

AeroSpin CSS Loading Spinners is designed for site owners, freelancers, agencies, and developers who want a lightweight loading experience without adding heavy libraries or external frontend dependencies. Built by WPClearPath.com, AeroSpin CSS Loading Spinners focuses on practical usability, accessibility, clean code, and dependable WordPress behavior.

Features

• 100 spinner styles across 8 categories: Classic, Dots, Bars, Shapes, Animated, Text, Colorful, and Indicators
• Live preview in the settings screen
• Primary and secondary color controls
• Spinner size control from 16px to 240px
• Overlay opacity control
• Overlay blur control
• Fade-out speed setting
• Minimum display time setting
• Z-index control for visual conflict resolution
• Exclude links by CSS selector
• Exclude pages by URL path
• Show or hide on external links
• Show or hide on WordPress admin bar links
• Show or hide on standard form submissions
• Automatically ignores common file downloads, email links, phone links, hash links, and new-tab links
• WooCommerce cart, checkout, and account page safeguards
• Reduced-motion support for visitors who prefer less animation
• Accessible overlay state using ARIA attributes
• Vanilla JavaScript on the frontend
• No frontend jQuery dependency
• Works with most WordPress themes and standard page builders
• Includes a discrete link to WPClearPath.com from the plugin screen and settings sidebar

Security and Accessibility Notes

AeroSpin CSS Loading Spinners uses a narrow spinner HTML allowlist instead of broad post-content HTML sanitization. Settings are normalized through a central schema before saving and before frontend output. Frontend dynamic styling is served via an external stylesheet endpoint (admin-post.php?action=acls_dynamic_css or legacy pure_css_spinners_dynamic_css) to eliminate inline <style> injection, fully support strict Content Security Policy (CSP) environments, and leverage browser caching. Frontend configuration is exported through encoded configuration data instead of misusing translation-only localization patterns for general configuration.

Spinner markup, colors, timing values, paths, selectors, and display options are sanitized before use. The loading overlay uses ARIA state updates and respects browser-level reduced-motion preferences. Visitors who prefer reduced motion receive a simplified animation experience.

Debugging and Output Safety

The plugin files are designed to avoid accidental output during plugin load and activation. Files should be saved as UTF-8 without BOM and should not include closing PHP tags. During debugging, AeroSpin CSS Loading Spinners can store a small option-based bootstrap debug log when WP_DEBUG is enabled. This helps diagnose unexpected activation output without writing directly to custom log files from production plugin code.

Usage

1. Install and activate the plugin.
2. Go to AeroSpin Spinners in your WordPress admin sidebar (or Settings → AeroSpin CSS Loading Spinners).
3. Choose your preferred spinner style from the style grid.
4. Customize size, color, overlay opacity, blur, timing, and exclusions.
5. Save settings.

Excluding Specific Links

Add the class no-acls-spinner (or no-pure-css-spinner, no-cps-spinner) to any <a> tag to skip the spinner for that specific link. Example:

<a href="/example/" class="no-acls-spinner">Example Link</a>

You can also use Exclude Link Selectors in the settings panel to skip entire groups of links using CSS selectors. Examples:

• .no-loader
• .skip-spinner a
• #special-link

Excluding Specific Pages

Use Exclude URL Paths to prevent the spinner from loading on selected paths. Examples:

• /contact
• /shop/cart
• /checkout

Each path should be placed on its own line.

Custom CSS Notice

Earlier versions included an editable Custom CSS textarea. During the 1.1.4 security-focused repair pass, active Custom CSS editing was paused while the plugin moves away from inline CSS and toward safer external stylesheet handling. Existing saved Custom CSS values are preserved, but the settings UI no longer encourages inline style injection.

WPClearPath.com Resources

Explore AeroSpin CSS Loading Spinners, documentation, updates, and more WordPress tools from WPClearPath.com:

https://wpclearpath.com