PWA — easy way to Progressive Web App

外掛說明

Progressive Web Apps (PWA) is a technology that combines the best of mobile web and the best of mobile apps to create a superior mobile web experience. They are installed on the phone like a normal app (web app) and can be accessed from the home screen.

Users can come back to your website by launching the app from their home screen and interact with your website through an app-like interface. Your return visitors will experience almost-instant loading times and enjoy the great performance benefits of your PWA!

iWorks PWA makes it easy for you to convert your WordPress website into a Progressive Web App instantly!

Once this plugin is installed, users browsing your website from a supported mobile device will see a “Add To Home Screen” notice (from the bottom of the screen) and will be able to ‘install your website’ on the home screen of their device.

iWorks PWA allow to add shortcuts for context menu to be displayed by the operating system when a user engages with the web app’s icon.

iWorks PWA is easy to configure, it takes less than a minute to set-up your Progressive Web App!

螢幕擷圖

  • General configuration.
  • Generic configuration.
  • Apple configuration.
  • Microsoft configuration.
  • Installation app on Android.
  • Shortcuts menu on Android.

安裝方式

There are 3 ways to install this plugin:

1. The super easy way

  1. In your Admin, go to menu Plugins > Add.
  2. Search for iWorks PWA.
  3. Click to install.
  4. Activate the plugin.
  5. A new menu PWA in Settings will appear in your Admin.
  6. A new location PWA Shortcuts Menu in Display location will appear in Appearance -> Menu.

2. The easy way

  1. Download the plugin (.zip file) on the right column of this page.
  2. In your Admin, go to menu Plugins > Add.
  3. Select button Upload Plugin.
  4. Upload the .zip file you just downloaded.
  5. Activate the plugin.
  6. A new menu PWA in Settings will appear in your Admin.
  7. A new location PWA Shortcuts Menu in Display location will appear in Appearance -> Menu.

3. The old and reliable way (FTP)

  1. Upload iworks-pwa folder to the /wp-content/plugins/ directory.
  2. Activate the plugin through the ‘Plugins’ menu in WordPress.
  3. A new menu PWA in Settings will appear in your Admin.
  4. A new location PWA Shortcuts Menu in Display location will appear in Appearance -> Menu.

常見問題集

How can I translate manifest.json values?

It is only possible with WPML package.

  1. Install and activate WPML Multilingual CMS and WPML String Translation plugins.
  2. Save manifest.json data on WP Admin -> Settings -> WPA.
  3. Open WP Admin -> WPML -> String translation`.
  4. Select domain iworks-pwa.
  5. Translate strings.

How can I add a context menu?

The shortcuts member defines an array of shortcuts or links to key tasks or pages within a web app. A user agent can use these values to assemble a context menu to be displayed by the operating system when a user engages with the web app’s icon.

  1. Install Menu Icons by ThemeIsle plugin.
  2. Go to WPA -> Appearance -> Menu.
  3. Open “Menu Icon Setting” from the “Add menu items” column (it should be on the bottom).
  4. Be sure you have “Image” checked.
  5. Create a custom menu and set “Display location” to “PWA Shortcuts Menu”.
  6. Add item.
  7. Select icon – it is recommended that you use a single 192×192 pixel icon.
  8. Save the menu.

What is “Add to Home screen”?

Add to Home screen (or A2HS for short) is a feature available in modern browsers that allows a user to “install” a web app, ie. add a shortcut to their Home screen representing their favourite web app (or site) so they can subsequently access it with a single tap.

A2HS is supported in all mobile browsers, except iOS web view. It’s also supported in some Chromium desktop browsers.

使用者評論

2022 年 6 月 22 日 1 則留言
Simple, quick, clean and easy. I hope this plugin gets continued development with additional features and cleanliness like similiar plugins. Would be great to customize the "pop up" text, and download stats. 10 out of 10 for what it is. Nice job!

Top

2022 年 6 月 11 日 1 則留言
I expressed it in the title in three words!
2022 年 3 月 21 日 1 則留言
I see no additional bloat on my site.
2022 年 3 月 21 日 1 則留言
This must be one of the best PWA plugins for WordPress. It's simple, effective and with some more performance optimizations from the developer, it will be just perfect. Thanks @iworks for developing it!
閱讀全部 11 則使用者評論

參與者及開發者

以下人員參與了開源軟體〈PWA — easy way to Progressive Web App〉的開發相關工作。

參與者

〈PWA — easy way to Progressive Web App〉外掛目前已有 2 個本地化語言版本。 感謝全部譯者為這個外掛做出的貢獻。

將〈PWA — easy way to Progressive Web App〉外掛本地化為台灣繁體中文版

對開發相關資訊感興趣?

任何人均可瀏覽程式碼、查看 SVN 存放庫,或透過 RSS 訂閱開發記錄

變更記錄

1.5.3 (2022-11-16)

  • Fixed translation string.
  • Added id property to manifest.json. Read more.
  • Added manifest.json property name limit on plugin install to 45 characters.
  • Added manifest.json property short_name limit on plugin install to 15 characters.

1.5.2 (2022-09-26)

  • Fixed issue with “apple-touch-icon” – it wasn’t used even defined.
  • Updated iWorks Rate to 2.1.1.

1.5.1 (2022-09-10)

  • Added check for a tag meta with the “viewport” value. Add it if it is missing. Props for Bert
  • Changed iWorks Rate Module repository to GitHub.

1.5.0 (2022-08-03)

  • Added Add to Home screen button to show browser prompt to install “app”. Check Browser compatibility.
  • Added google campaign track to “start_url” in the manifest.json file.

1.4.3 (2022-05-06)

  • Fixed issue with Microsoft Square Icon. Props for chickendipper.
  • Fixed issues lower than 8 PHP. Props for bamsik001.
  • Added cache for HTML head with Microsoft data.

1.4.2 (2022-04-08)

  • Added params defaults to function called in action wp_nav_menu_item_custom_fields to avoid PHP warning for an improper call. Props for vmaxs
  • Added permanent hide for menu pointer when a user visits the PWA Settings page.

1.4.1 (2022-04-05)

  • Updated iWorks Options to 2.8.3. (Fixed PHP 7.x compatibility).

1.4.0 (2022-04-05)

  • Added Menu Icons by ThemeIsle plugin integration for PWA Shortcuts.
  • Added a message when the site permalink is installed in a sub-directory – this plugin does not support it.
  • Added PWA Shortcuts Menu. Read more about PWA Shortcuts.
  • Updated iWorks Options to 2.8.3.

1.3.3 (2022-03-22)

  • Replaced cache function o proper one.
  • Fixed problem with deleting general icon.

1.3.2 (2022-03-22)

  • Fixed wrong option name.

1.3.1 (2022-03-22)

  • Added /ieconfig.xml link on debug tab.
  • Fixed long site title on the offline page. Props for tanohex.
  • Fixed missed translation domain in a few strings.
  • Improved usage of the transient cache. Props for tanohex.
  • Removed images from debug tab.

1.3.0 (2022-03-16)

  • Added object cache for settings.
  • Fixed protected $option_name_icons warning.

1.2.3 (2022-02-23)

  • Removed console.log from JavaScript files.

1.2.2 (2022-02-21)

  • Added filter `iworks_plugin_get_options’ to allow filtering plugin core configuration.
  • Added OG — Better Share on Social Media plugin integration.
  • Added plugin information into PWA script elements.
  • Added purpose “any maskable” to the biggest icon. Props for vmaxs.
  • Updated iWorks Options to 2.8.2.
  • Updated iWorks Rate to 2.1.0.

1.2.1 (2022-02-16)

  • Added a message when the site permalink is “plain” – this plugin does not support it.
  • Updated iWorks Options to 2.8.1.

1.2.0 (2022-02-15)

  • Added the ability to change the text of the offline page.
  • Added version to cache control.
  • Added WPML plugin integration.
  • Moved worker JavaScript from PHP class to separate template.

1.1.6 (2022-01-27)

  • Added screenshots to readme.txt.
  • Removed debug functions.

1.1.5 (2022-01-27)

  • Added Apple Pinned Tab Icon.
  • Added Apple Launch Icon Title.
  • Added Microsoft Pinned Site.
  • Added Microsoft Live Tile for IE11.
  • Added HTML prefetch for manifest.json.
  • Refactored options.

1.1.4 (2022-01-24)

  • Fixed typo.

1.1.3 (2022-01-24)

  • Fixed class load order issue.

1.1.2 (2022-01-24)

  • Added method_exists to check iWorks Option Class has method set_plugin.
  • Changed plugin name into “PWA — easy way to Progressive Web App”.
  • Cleared manifest.json from unwanted values.
  • Improved handle /manifest.json.

1.1.1 (2022-01-23)

  • Added configuration for Apple Splash Screen Icons.
  • Added configuration for Apple Touch Icon.
  • Added configuration for IE11.
  • Added configuration for Microsoft Tile Icons.

1.1.0 (2022-01-21)

  • Added configuration for the application name.
  • Added configuration for application colours.
  • Added configuration for application description.
  • Added configuration for application display.
  • Added configuration for application icons.
  • Added configuration for application orientation.
  • Added configuration for application short name.
  • Changed plugin name from “iWorks PWA” to “PWA — simple way to Progressive Web App”.
  • Updated iWorks Options to 2.8.0.
  • Updated iWorks Rate to 2.0.6.

1.0.0 (2022-01-04)

  • First stable release.
  • Added check for the non-SSL site – SSL is required for PWA.
  • Added “Rate” module.
  • Fixed duplicates in offline URLs set.
  • Bumped offline version to 2.

0.0.2 (2021-04-26)

0.0.1 (2021-03-18)

  • Init.