The own Website as a PWA to offer

The conditions for a Progressive Web App The own Website as a PWA to offer

Progressive Web Apps are a handy way of content without App Store permanently on Smartphones to offer. Many popular Content Management systems like WordPress, you can quite easily retrofitted.


With a few tweaks and resources, websites, and Blogs can easily be as Progressive Web Apps offer.
With a few tweaks and resources, websites, and Blogs can easily be as Progressive Web Apps offer.

Who is a successful Blog, a News site or Online runs the Shop, is likely to once in a dream, its content also directly via App to offer. This strengthens customer loyalty, but it has a significant disadvantage: The development of a native App which will be distributed through the App Stores of Google, Amazon and Apple, is not only very time-consuming, but also with a number of technical and legal pitfalls associated.

On top of that, such an App needs to be updated on a regular basis. Much easier and cheaper it is, however, a so-called Progressive Web App. This can be directly and without detours via the App Store from the Website as an App on the Smartphone to install, is functional but in a variety of ways with a real App comparable. However, the effort for the provision of significantly lower.

PWA is supported by most browsers

The idea behind a Progressive Web App is that the web service can be used directly as an App on the Home-Screen of Smartphones or Tablets running, without the detour via the App store, with your approval processes. Such Web-Apps will be installed instead of through the Browser: Opera, Chrome and Edge, this function is already in Apple’s Safari on iOS and iPadOS dominated the PWA technology.

PWA is, where simple information as the App will be deployed, or as an additional offer to an already existing mobile page. Unlike normal Browser-favorites PWAs can store data offline and especially the Push capabilities of a smartphone, tablet, or PC to use.

What Websites are, as a PWA?

Basically, each site can be expanded to include a PWA function, since it is an API, or a vendor-specific technology; Progressive Web Apps are a Supplement, based on standard Web technologies, HTML, CSS, and JavaScript and therefore, so to speak, the cherry on the cake of an existing Web project. This PWA is relatively independent of the third-party.

As a “starting material” is required in a regular modern Website. This should have a responsive Design, using HTTPS sure to be shipped, and of course content. Such a Website as a Progressive Web App is, however, a so-called Service Worker is necessary to: A JavaScript script that the Browser runs in the Background to ensure that the core functions of the Web App such as Caching or Push. Added to this is a so-called App-Manifest: This defines the “Look” of the App, as well as the Icon.

Website transform it into a Progressive Web App

Basically, a Progressive Web App is Manifest from the Website plus the PWA functions necessary Service Worker and App. Both can be retrofitted on any Website. Web developers can create for this purpose, first, the necessary file hierarchy. This is in addition to the Index.html the normal site from a App folder, and the Icons as well as a “Manifesto.json”, and a Service-Worker “sw.js” are located.

A good example of a basic Service Worker file, for example, on Github. The App Manifest file must also be filled with life: Here are simple information such as the Name of the App, the Icon files at different sizes and the so-called Start-URL – in this case, the index.html – can be defined.

Lastly, the Browser will be informed, of course, nor that the Website is available as a Progressive Web App. The Manifest file must be included in the Head of the HTML page and the Service Worker will be included with the script. That’s it: The Website is a PWA-Ready and can be installed from within the Browser as a Web App. The Online service provider Wiredelta has written an interesting How-To, dealing with this procedure.

PWA in WordPress & Co retrofit

Unfortunately, this approach has the PWA-creating a small catch: it requires some skills in web design and is not suitable for dynamically-generated web sites. Therefore, for existing installations of popular Content-Management-systems – first and foremost, WordPress, but also Joomla, Drupal or Typo3 – prefabricated solutions.

Wordpress and other CMS can be conveniently via a plug-in as a PWA offers.

WordPress and other CMS can be conveniently via a plug-in as a PWA offers.(Image: SuperPWA)

The easiest way to Integration in WordPress. Here, there are a variety of Plugins that facilitate the PWA creation significantly. A comprehensive fee-based solution, for example, SuperPWA to make the generation of the PWA to a children’s game.

With a little more background, a simpler, free version of knowledge is possible: PWA for WordPress contains the necessary files for the Web App Manifest and Service Worker. This will need to be adapted to the own needs and in the Theme involved. By the way, this function is also available for Theme developers who want to give their customers a PWA function “out of the box”.

Typo3, Joomla and Drupal can also PWA

A similar principle, but also the PWA Plugins for the popular Content Management systems Drupal, Joomla and Typo3: work here, Too, there are projects which deal with the implementation of PWA in the respective CMS and the installation of the corresponding functions is significantly easier. The PWA Initiative for Typo3 all the necessary Code snippets available to an existing Typo3 Website to PWA-complement functions.

After a similar thought, the PWA project for Drupal moves. For Joomla, it is similar to WordPress, is not only a basic PWA-function, Plug-in, but also paid All-in-One solutions such as miTT PWA.

PWA vs native App: Why both are important

Overall, the implementation of an existing Website as a Progressive Web App, with amazingly little effort. Then, it is only on the Website-the operator to apply this Web App accordingly.

While Chrome and Edge point to any existing PWAs, however, the technology is not yet in the minds of most users: Apps for you from the App or Play Store, which is why it is all the more important, the presence of a PWA, as well as to communicate their use sufficiently.

Who wants to offer his Web Business mainly via the App, should therefore nowadays a two-pronged approach, and its own native Version of the classic App Stores to develop. Website owners however, are simply looking for an additional sales channel, are hereby repealed with a PWA well – especially when you are applying for both online as well as via the Newsletter and explain.


Ready to see us in action:

More To Explore
Enable registration in settings - general
Have any project in mind?

Contact us: