Welcome to the HTML Wallpaper App!


This document will provide you a high level guideline on how to use the HTML Wallpaper app on your iOS 17 device.



1. Goal


With HTML Wallpaper app you can convert any HTML-site to a wallpaper for your lockscreen or homescreen.


You can include any weather API call to your HTML website to bring actual weather data on screen. Join our iNNOVATION discord community (18.000 members) to download out of the box themes or write your own Wallpaper.html.


For HTML Wallpaper to work, you need to download 2 shortcuts, one for lockscreen and one for homescreen. Download-links are available in app.


I highly recommend to add the 2 Lockscreen-Widgets to your lockscreen. You can update the wallpaper with 1-tap on the lockscreen widget. The weather data will be updated on screen within seconds.




2. Download HTML Wallpaper App


Simple scan QR-Code from your iPhone or tap on the App Store link below.


or


Go to App Store.


Kindly open the HTML Wallpaper app and download the HTML Wallpaper shortcuts ( see screenshot below ). Follow on screen instructions.


HTML Wallpaper app: Download HTML Wallpaper shortcut.




3. Short Guideline


You can find the short guideline on how to bring a Wallpaper.html output to a screenshot within the app.


3.1. Download a Theme

I recommend to download one of the themes as a starting point. Starter-kits can be found in the themes tab. You could also write your own Wallpaper.html file and store it in a subfolder of your /iCloud Drive/HTML Wallpaper/ folder.



3.2 Open Settings Tab

Go to the settings tab of this app. You can set your location and the themes you want to apply.



3.3. Choose a Location

For weather services used in Wallpaper.html themes, you need to define a location in the app settings.
In case you want to accept location service supplied by your device toggle GPS on.
In case you denied location services, tap on city to manually select a location.




3.4. Select a Theme

Within settings tab choose a theme for Lockscreen or/and Homescreen.



3.5. Provide Weather API Keys

In case you are using one of the provided themes from the themes tab, you need to add an ApiKey.js file to your /iCloud Drive/HTML Wallpaper/ root folder. Tap on „Add API Key Template“ under point 5 on the Design Tab to automatically generate the ApiKey.js file.



Follow the „Show API Guideline“ to generate your own API key.


Hint: Local weather services like DWD or Yr.no do not require an API key, but those services may provide good weather data for specific regions only.


3.6. Start Using App

Go to lockscreen or homescreen tab and review your output. Tap on the shortcut icon on upper right corner to start the shortcut. On the first run, the shortcut may take longer due to the fact that you have to permit folder access. Kindly accept those.



3.7. Add Lockscreen Widget

Optional, but I highly recommended, add the HTML Wallpaper lockscreen widgets to your lockscreen. With 1-tap on those widgets you can update your lockscreen or homescreen wallpaper with the current weather data within seconds.





4. Support


The beauty of the iNNOVATION discord channel is the 24/7 support. You want to change something on a theme and you do not know how, just ask in the support channel. You may read the FAQ section first.



iNNOVATION discord channel