WP Advanced PWA

A comprehensive Progressive Web App plugin for WordPress by MiMDigital

---

WP Advanced PWA transforms your WordPress site into a robust Progressive Web App, combining multiple preloading styles, advanced color customizations, and on-the-fly image generation for streamlined PWA adoption. Designed for performance, user engagement, and easy configuration – whether for blogs, business sites, or custom themes.

---

Table of Contents

• Features
• Installation
• Configuration
• Customizing Your PWA
• Image Generation
• Preloading Styles
• Color Customization
• Troubleshooting
• FAQ
• Contributing
• Credits
• License

---

Features

• Multiple Preloading Styles: Choose how your PWA preloads resources for optimal performance and effect.
• Manifest Generation: Automatically generates a Web App Manifest, allowing users to install your site as an app.
• Service Worker: Comes with a customizable service worker to enable offline functionality, caching, and push notifications.
• Image Generation: Dynamically create app icons, splash screens, and PWA-required images in various sizes.
• Advanced Color Customization: Set theme, background, and UI colors to match your brand.
• HTTPS Ready: Works seamlessly on HTTPS/SSL-enabled sites.
• Easy Customization: Override templates and style PWA components with WordPress Customizer support.

---

Installation

1. Download & Upload

   • Download the latest zip from GitHub releases.
   • Upload and extract it in your WordPress site's /wp-content/plugins/ directory.

2. Activate

   • Go to your WordPress dashboard.
   • Navigate to Plugins > Installed Plugins.
   • Find "WP Advanced PWA" and click Activate.

3. Configure

   • Go to Settings > WP Advanced PWA to configure the plugin.

---

Configuration

After activation:

• Visit Settings > WP Advanced PWA.
• Customize your app title, short name, description, start URL, display mode, and orientation.
• Upload a base icon (512x512 recommended); other sizes are auto-generated.
• Set theme, background, and loading colors in the interface.
• Choose your preferred preloading style.
• (Optional) Preview your manifest and PWA installability features.

The plugin automatically generates or updates:

• /manifest.json
• service-worker.js
• All PWA compliant images/icons

---

Customizing Your PWA

• Colors & Styles: Use the plugin settings page to configure theme and background colors.
• App Name & Short Name: Determines how your app appears on user's devices and splash screens.
• Icons & Splash Screens: Upload a high-resolution image; others will be generated automatically for different devices.
• Preloading Style Selection: Choose between classic spinner, skeleton loading, fade-in, and more.

Advanced users can enqueue their own CSS or JS to further style/extend PWA elements.

---

Image Generation

The plugin takes a single app icon upload and generates:

• All required icon sizes for manifests (e.g., 192x192, 512x512, 1024x1024)
• Splash screens for iOS/Android
• Favicon and shortcut icons
• You can replace generated images by uploading new ones in the plugin settings.

---

Preloading Styles

WP Advanced PWA offers multiple built-in preloading mechanisms, including (depending on your configuration and theme):

• Spinner: Displays a circular loading spinner while fetching content.
• Skeleton Screen: Shows a skeleton UI to smooth perceived load time.
• Fade-In: Content fades into view for a slick experience.
• Custom: (Developers) Implement custom loading UIs via filters or hooks.

---

Color Customization

Set your brand's palette for:

• Background color: Shown behind splash screens and before data loads.
• Theme color: Sets browser address bar/app bar colors.
• Loading indicator color

Supports HEX, RGB, and HSL values.

---

Troubleshooting

• Service Worker not registering?
  • Make sure your site is served over HTTPS.
  • Clear any conflicting plugins related to service workers.
• Manifest errors?
  • Check the output of /manifest.json by visiting it in your browser.
  • Ensure all required fields and images/icons are set up.
• Theme compatibility?
  • Works with most modern themes. For custom issues, check the support section or open an issue.

---

FAQ

Q: Will my site be installable as an app on Android and iOS?
A: Yes, as long as you configure the manifest and icons properly; iOS provides limited PWA support.

Q: Can I use my own service worker?
A: Advanced users can override the service worker template by copying /wp-content/plugins/wp-advanced-pwa/templates/service-worker.js to their theme.

Q: Where can I find documentation and support?
A: See the docs folder or open an issue on GitHub.

---

Contributing

We welcome contributions! To report bugs, request features, or submit pull requests:

1. Fork this repository.
2. Create a new branch (git checkout -b feature-xyz).
3. Commit your changes.
4. Push to the branch and open a pull request.

See CONTRIBUTING.md for details.

---

Credits

Developed by MiMDigital.

---

License

This plugin is licensed under the MIT License.

---

Enjoy leveraging the best of Progressive Web App technology on WordPress with WP Advanced PWA by MiMDigital!