In this tutorial will be explained how to create, edit and publish a WebApp (Mobile Website).
How to CREAT a WebApp?
First of all you have to be login into your SeattleClouds account.
1. You should click on 'Templates' menu
2. Choose 'Progresive Web App' category of application from. This category is for WebApps and PWA.
2.1. You can also choose templates from other categories in order to create a WebApp:
2.2. If you have a native application and want to have a similar one as WebApp, you can change the target (Native iPhone, Native iPad, Native Android, Native Kindle) of this existing application by duplicating it.
If you want to duplicate an application to WebApp you should open desired app and choose the option 'Duplicate this app' from 'Application Dashboard' :
NOTE! WebApp can't contain Native Tabs, so when you'll duplicate an existing app into WebApp pages 'tab1.html' will be renamed as 'index.html' and it will stay as start-up page.
The start-up page of WebApp (duplicated) could be blank, but do not worry, you can rename any page you want into 'index.html', it will be shown as start-up page.
How to EDIT a WebApp?
As you can see 'Application Dashboard' is different to a Native application, here settings like: Navigation Settings, App Store Proprieties, Statistics, Page Settings, Monetization Ads, Geofences, App Style, App Multimedia were removed.
These settings were removed as WebApps use only HTML based pages and obviously there is no need for these options.
The WebApp can't have native features, here are the page types supported on WebApp:
HTML, Button Menu, Color Menu, Content Menu, Grid Menu, Image Menu, Large Button Menu, Magazine Menu, Menu, Sample Menu, Side Bar Menu, Stripes Menu, WebKit Menu, WebKit Submenu, About Us, Audio Stream, Calculator, Form, Drag & Drop, jQueryMobile, Radio Stream, WebKit details, Image Area, RSS.
'Application Dashboard' menu:
1 - Edit this Web App - here you can edit, add, delete pages from applications (exactly as for native apps)
2 - Web App Settings - here you can find 'General Settings', 'SMTP' and 'FTP' settings and possibility to edit APP.XML file.
General Settings allow following functionalities:
Generate Progressive Web Application - here you can 'Enable Push Notifications' and edit details about your app (names, description, colors that are used, display mode, orientation and language)
Enable offline mode - allow the WebApp to be changed on the device, so it will work in offline mode. It will be possible to install on device and it will work as a native app.
Open links in the same window - all pages of PWA will be opened in the same window, a new tab won't be opened in the browser when you will navigate through application.
4 - Design Properties - here you can edit style of your app in 'Properties' menu or edit directly in CSS file (style.css).
5 - Media - in this submenu you upload Application icon and Favicon.
6 - Advanced options - here you have possibility to Backup application and Restore from Backup app, Synchronize app or Duplicate this app.
7 - Support - you can take advantages of SeattleClouds support for technical and sales questions, you can order custom work or open a support ticket.
8 - Application embed code - individual code of application that you have created.
9 - Ready to Publish -> - clicking on this button you could submit the app if it is just created or you can update existing app on World Wide Web (www) as Mobile Website.
How to PUBLISH a WebApp?
You can publish a WebApp on a domain or a subdomain.
After your application is ready, click 'Ready to Publish', after that in fields you will have to insert yourdomain orsubdomain, short and long title for PWA. The URL link you set will be the direct link for your Web App.
1. To host your WebApp on SeattleClouds server you should go to your DNS management console, create a CNAME record and point it to the following domain: webapps.seattleclouds.com .
After you manage to set the domain for your application, click 'Publish', your domain will be verified and will be published.
Now there is a generated linkto access your PWA in browser and a QR code to access on mobile phone.
It might take some time till the domain is set up to our server (up to 1-2 hours).
Also you can find the direct link of your application in 'App Dashboard' (click on 'Done' button to be redirected to Application Dashboard).
In case you want to unpublish the application from your domain, click the 'Unpublish' button.
You can make changes to your application after it is published. You should go to 'Application Dashboard' and make changes that are needed. After your app is ready you should republish it.
If WebApp is installed on device, to see changes you need to republish it only on Website and open the app on the device.
Creating, Editing and Publishing a WebbApp
In this tutorial will be explained how to create, edit and publish a WebApp (Mobile Website).
How to CREAT a WebApp?
First of all you have to be login into your SeattleClouds account.
1. You should click on 'Templates' menu
2. Choose 'Progresive Web App' category of application from. This category is for WebApps and PWA.
2.1. You can also choose templates from other categories in order to create a WebApp:
2.2. If you have a native application and want to have a similar one as WebApp, you can change the target (Native iPhone, Native iPad, Native Android, Native Kindle) of this existing application by duplicating it.
If you want to duplicate an application to WebApp you should open desired app and choose the option 'Duplicate this app' from 'Application Dashboard' :
NOTE! WebApp can't contain Native Tabs, so when you'll duplicate an existing app into WebApp pages 'tab1.html' will be renamed as 'index.html' and it will stay as start-up page.
The start-up page of WebApp (duplicated) could be blank, but do not worry, you can rename any page you want into 'index.html', it will be shown as start-up page.
How to EDIT a WebApp?
As you can see 'Application Dashboard' is different to a Native application, here settings like: Navigation Settings, App Store Proprieties, Statistics, Page Settings, Monetization Ads, Geofences, App Style, App Multimedia were removed.
These settings were removed as WebApps use only HTML based pages and obviously there is no need for these options.
The WebApp can't have native features, here are the page types supported on WebApp:
HTML, Button Menu, Color Menu, Content Menu, Grid Menu, Image Menu, Large Button Menu, Magazine Menu, Menu, Sample Menu, Side Bar Menu, Stripes Menu, WebKit Menu, WebKit Submenu, About Us, Audio Stream, Calculator, Form, Drag & Drop, jQueryMobile, Radio Stream, WebKit details, Image Area, RSS.
'Application Dashboard' menu:
1 - Edit this Web App - here you can edit, add, delete pages from applications (exactly as for native apps)
2 - Web App Settings - here you can find 'General Settings', 'SMTP' and 'FTP' settings and possibility to edit APP.XML file.
General Settings allow following functionalities:
Generate Progressive Web Application - here you can 'Enable Push Notifications' and edit details about your app (names, description, colors that are used, display mode, orientation and language)
Enable offline mode - allow the WebApp to be changed on the device, so it will work in offline mode. It will be possible to install on device and it will work as a native app.
Open links in the same window - all pages of PWA will be opened in the same window, a new tab won't be opened in the browser when you will navigate through application.
3 - Push Notifications - menu where you manage sending of Push Notification (PN). About how to enable and send PN, please see this thread (http://seattleclouds.com/PWA-Push-Notification-Tutorial).
4 - Design Properties - here you can edit style of your app in 'Properties' menu or edit directly in CSS file (style.css).
5 - Media - in this submenu you upload Application icon and Favicon.
6 - Advanced options - here you have possibility to Backup application and Restore from Backup app, Synchronize app or Duplicate this app.
7 - Support - you can take advantages of SeattleClouds support for technical and sales questions, you can order custom work or open a support ticket.
8 - Application embed code - individual code of application that you have created.
9 - Ready to Publish -> - clicking on this button you could submit the app if it is just created or you can update existing app on World Wide Web (www) as Mobile Website.
How to PUBLISH a WebApp?
You can publish a WebApp on a domain or a subdomain.
After your application is ready, click 'Ready to Publish', after that in fields you will have to insert your domain or subdomain, short and long title for PWA. The URL link you set will be the direct link for your Web App.
1. To host your WebApp on SeattleClouds server you should go to your DNS management console, create a CNAME record and point it to the following domain: webapps.seattleclouds.com .
After you manage to set the domain for your application, click 'Publish', your domain will be verified and will be published.
Now there is a generated link to access your PWA in browser and a QR code to access on mobile phone.
It might take some time till the domain is set up to our server (up to 1-2 hours).
Also you can find the direct link of your application in 'App Dashboard' (click on 'Done' button to be redirected to Application Dashboard).
In case you want to unpublish the application from your domain, click the 'Unpublish' button.
You can make changes to your application after it is published. You should go to 'Application Dashboard' and make changes that are needed. After your app is ready you should republish it.
If WebApp is installed on device, to see changes you need to republish it only on Website and open the app on the device.