What's new: ChangelogSee the changelog here.
1) Set up your web app/website/HTML files
Option 1: Use a URL for accessing your web application (= store files online):
Create a mobile-optimized website, for example, using jQuery Mobile and upload your site to your webserver/webspace. WebViewGold supports all kinds of web apps/websites (including HTML, PHP, WordPress, Progressive Web Apps, HTML 5 Games, WiX, bubble.is, …). Please make sure to optimize your website to feel like an app.
Option 2: Use a local HTML folder for accessing your web application (= store files within the app):
Option 3: Use an HTML folder if the user is offline, and use a remote URL if the user is online (= store files online + store backup/fallback files within the app):
2) Set up the Xcode project
Download the WebViewGold app template here and download the Xcode app from the Mac App Store. If you do not own a Mac for running the required Xcode app, check out MacInCloud as it allows you to rent a virtual Mac online starting at 1 USD per hour (we are not affiliated with the provider of that service). Using that service, you can build your iOS apps based on WebViewGold, even without owning a Mac.
Afterward, open WebViewGold.xcworkspace (instead of WebView.xcodeproj):
Within Xcode, open WebViewController.swift and you will see a document like this:
Here you can set up your app easily. Setting up apps with WebViewGold is very easy and does not require any coding knowledge. Please don't forget to add your Envato/CodeCanyon Purchase Code in the purchasecode field for each app published by you. One license per each customized end product is required. License info of your CodeCanyon purchase: https://codecanyon.net/licenses/standard
Please take a look at this overview of all built-in configuration options:
UIColor(red: CGFloat(255 / 255.0), green: CGFloat(255 / 255.0), blue: CGFloat(255 / 255.0), alpha: CGFloat(1.0))
You can find the relevant number items for each color, here (use the RGB color scheme).
UIColor(red: CGFloat(255 / 255.0), green: CGFloat(255 / 255.0), blue: CGFloat(255 / 255.0), alpha: CGFloat(1.0))
You can find the relevant number items for each color, here (use the RGB color scheme).
3) Change App Name, Icon, and Splash Screen
Just insert a new name that should be displayed on the iOS home screen.
Afterward, include your app icon. A beautiful app icon is a perfect first impression for your customers. It's easy to add your app icon to your WebViewGold project:
Just replace the included image files with your own resized image files. Alternatively, use this helpful tool: Asset Catalog Creator - App Icon, Image Set & Launch Screen Generator for iOS & OS X by Bridge Technologies Limited (we are not affiliated with the developer company).
Splash Screen: Would you like to make your app more attractive to your customers and display your branding as a welcome image? Sure, add your individual splash screen graphics. Just replace the splash.gif file in the main folder of the Xcode project. Make sure to use GIF format (animated or static) and 128x128 Pixels size.
Set the remainSplashOption option (can be found in WebViewController.swift file) to true if you want to display the Splash Screen until your page was loaded successfully. Otherwise, it will be displayed for a short time only, and the native iOS loading indicator will begin.
Use the splshscreencolor option (can be found in Constant.swift file) to modify the background color of the splash screen. Color options can be found here.
Modify iPhone X/XS/XS Max Safe Area size
HTML5 Geolocation API
The HTML5 Geolocation feature enables users to communicate their own position to a web application. Check out the Mozilla guide on how to implement geolocation into your website or web app. In WebViewGold, the HTML5 Geolocation API will work by default after you integrated it into your web content. Since iOS 10, Geolocation is available for https-sites only, so please make sure to use a web app URL starting with https:// instead of http:// when using location requests. Demo: https://www.w3schools.com/html/html5_geolocation.asp
Push notifications are notifications that appear on your smartphone without opening the app. These types of messages allow fantastic interaction with customers and users of the app. Your app does not have to be open to receiving these kinds of notifications. This way, your customers do not miss any important news or messages. Push Notifications are suitable for many cases, e.g., for updates to orders, live tickers, or social media community. There must be an internet connection to allow app users to receive push messages. WebViewGold supports multiple ways of reaching your users via push notifications. If you do NOT want to use push notifications at all, open AppDelegate.swift and set askforpushpermissionatfirstrun to false in order to prevent asking the app user for notification permission.
<script> var seconds = 120; //seconds from now on var message = "It is Happy Hour now! Check it out!"; //the message var button = "Open App"; //the text of the button window.location.href = "sendlocalpushmsg://push.send?s="+ seconds +"=msg!"+ message +"&!#"+ button +""; </script>
It could be used for different situations (countdowns, happy hours, specific reminders, ...).
To cancel all scheduled local push notifications run:
<script> window.location.href = "sendlocalpushmsg://push.send.cancel"; </script>
Option 2: Use OneSignal Remote Push Notifications
If you want to use OneSignal in your app, activate these options in Constant.swift (by switching the values from false to true):
Please set your OneSignal App ID in AppDelegate.swift file afterward:
Generate an iOS Push Certificate and import it:
Make sure to allow push notifications on global Xcode level for the project:
Yay, you are done. You can send push notifications now:
If you want to use OneSignal URL Deeplinking (opens a specific URL when clicking on your notification), please add the desired URL with a custom field called url:
On the OneSignal.com Backend, you can fill in this key-value-pair window after clicking on "Advanced settings". Using the OneSignal API, you can add the "url" field to the API request (https://documentation.onesignal.com/docs/onesignal-api).
Do you want to get each individual user ID on your server for further processing and individual user push messages? Just activate the „kPushEnhanceUrl“ option in Constant.swift (by switching the value from false to true) in order to append ?onesignal_push_id=XYZ to your WebView URL. If your WebView URL is https://www.example.org, WebViewGold will call https://www.example.org?onesignal_push_id=XYZ instead. Only your FIRST URL request will get that GET variable, so save it in a session or in a cookie to access it on your linked pages.
Option 3: Use Firebase Remote Push Notifications
1. Create a Firebase project
Before you can add Firebase to your WebViewGold app, you have to create a Firebase project in your Firebase Console.
2. Register your app with Firebase
After you created your Firebase project, you can add your WebViewGold app to it.
a. In the center of the Firebase console's project overview page, click the iOS icon to launch the setup workflow.
b. If you've already added an app to your Firebase project, click Add app to display the platform options. Enter your app's bundle ID in the iOS bundle ID field. Find your bundle ID, as follows:
Open your app in Xcode.
Select the top-level app in the project navigator, then select the General tab.
The value of the Bundle Identifier field is the iOS bundle ID (for example, com.onlineappcreator.webviewgold). Make sure that you enter the ID that your app is using. You cannot add or modify this value after you register your app with your Firebase project.
c. Enter other app information as prompted by the setup workflow.
– App nickname: An internal, convenience identifier that is only visible to you in the Firebase console
– App Store ID: Used by Firebase Dynamic Links to redirect users to your App Store page and by Google Analytics to import conversion events into Google Ads. If your app doesn't yet have an App Store ID, you can add the ID later in your Project Settings.
4. Click the Register app button.
5. Download GoogleService-Info.plist
Click Download GoogleService-Info.plist to obtain your Firebase iOS config file (GoogleService-Info.plist) and replace the sample file already included in the WebViewGold project.
6. Activate Firebase in WebViewGold
Go to WebViewController.swift file and turn the kFirebasePushEnabled variable to true.
7. Sign your app using the Firebase certificates
Sign your app using the Firebase provisioning profile: How To
8. That's it!
Banner and Interstitial ads via AdMob API
AdMob offers the possibility of monetizing mobile projects. It is a Google-provided service for integrating Google ads into mobile applications. The AdMob program allows mobile application developers to incorporate ads on iOS and Android platforms. The ad space provided by the app developer is paid by clicks (CPC, Cost Per Click) or impressions (CPM, Cost Per Mille). WebViewGold is ready for activating AdMob ads by default, and it allows you to monetize your WebView-based applications.
Open Info.plist file and set your AdMob global account ID in the GADApplicationIdentifier field:
You can activate and deactivate banner and/or interstitial ads and define the interval of appearing interstitial ads. Please set your AdMob IDs in Constants.swift file before launching your app:
For more information, please consider the official AdMob SDK documentation as well (but skip the setup parts as WebViewGold already includes the framework).
Activate HTML background audio
For some scenarios, it may be useful to play audio content even after minimizing the app (for example, if you're making a radio stream or your music available in the app). Please take a look at the video to learn how your app's audio can play even when users switch to a different foreground app or when they lock their iPhone or iPad.
Downloader for PDF, ePub, Wallet, Documents, and Music Files
If you offer to download or view documents or other downloads in your web app, our WebViewGold Download API will help you for the tremendous and native user experience of your app.
Save images to the camera roll of the user by calling links with savethisimage://?url= prefix:
<a href="savethisimage://?url=IMAGE URL HERE">Link</a>
Save files by calling links with a relevant suffix (e.g., .mp3):
<a href="https://www.example.org/file.pdf">Link< PDF/a> <a href="https://www.example.org/file.mp3">Link mp3 Music</a> <a href="https://www.example.org/file.mp4">Link mp4 Music</a> <a href="https://www.example.org/file.wav">Link wav Music</a> <a href="https://www.example.org/file.epub">Link epub eBook</a> <a href="https://www.example.org/file.pkpass">Link Passbook / Apple Wallet</a> <a href="https://www.example.org/file.docx">Link Word</a> <a href="https://www.example.org/file.pptx">Link PowerPoint</a> <a href="https://www.example.org/file.xlsx">Link Excel</a>You can add more filetypes that should trigger the file downloader functionality (e.g., .epub, .zip, ...) This can be done via the list variable extentionARY that can be found in the Constant.swift file.
Reset App API
Sometimes only a restart helps. This is true in life as well as in digital life. Click on this link to reset your users' app to app factory settings (by clearing all cookies and cache):
Insert the https://www.onlineappcreator.com/reset_test.html URL into your WebViewGold app for a demo.
Show/hide the loading sign manually
The native iOS loading indicator of WebViewGold will be triggered automatically when a page starts or finishes loading. However it could be useful to know that it can be triggered manually as well (e.g., you could show the activity indicator as well when waiting in your live chat queue, or some cloud server action is running in the background, and you want to visualize the process on the client):
<a href="spinneron://">Show the loading spinner</a> <a href="spinneroff://">Hide the loading spinner</a>
URL Handling – Open links in Safari
It often makes sense in WebView based apps to treat different web addresses differently. If you place a social media button in your web app, a click on it should probably not open the social media page in your app, but in the right app (e.g., the system browser). It's good that WebViewGold has all the features to enable powerful configuration and treat links the way you want it.
Option 1: Open all external hosts in SafariIf you want to open every URL, which is not on your host in Safari, please set your host in the setup and set openallexternalurlsinsafaribydefault to true.
Option 2: Open specific hosts in SafariOpen WebViewController.swift and scroll down until you see this code snippet:
To add another domain, just copy this part and insert another host, which should be opened in Safari. Please enter the host exactly the way you link to it (with or without www, but always without HTTP/HTPPS/.. in Xcode).
URL Handling – Open links in a tab/additional In-App-Browser
There are some cases for links that do not feel to be "important enough" to open them in the Safari browser externally but "too specific" for opening them in the app WebView itself (e.g., your Terms and Conditions page). For this particular kind of links, we added a creative idea of URL Handling: a tab that opens an additional in-app-browser over the main WebView content itself. It will look like this:
As you see, this in-app-browser includes an address bar and navigation buttons (including an "Open in Safari" button). That's a considerable difference to the primary, full-screen WebView content. So this kind of combination of app and browser experience is great for tutorials, knowledge databases, and all type of content that requires any type of navigation. To use this kind of in-app-browser, link to an URL in this format:
<a href='#' onClick="top.location.href='https://www.google.com';">Open Google</a>
Please insert https://www.webviewgold.com/demo/testlinks.php as WebView URL to test how your app will handle different types of links. You can open the same domain https://www.webviewgold.com/demo/testlinks.php in your desktop browser and see the source code to copy & paste the way of link.
Custom CSS API
The Custom CSS feature of WebViewGold allows you to customize the appearance of your web application without the need to customize the CSS style sheets of your web application itself. The custom CSS classes will be applied to all website loads requested by your application built with WebViewGold. Just insert the custom CSS in the cssString variable in the WebViewController.swift file.
Universal Links API (configure a link scheme like webviewgold://)
With Universal Links, it becomes easy to link to content inside your app. Apple introduced the feature with iOS 9, and it's supported with any version later than iOS 9 as well. WebViewGold allows configuring a link scheme like webviewgold:// which can be triggered from the Mail app, Safari app, ... and opens the attached link in the WebView app.
Please change the scheme to your own app name (like your-app-name:// instead of webviewgold://) in Info.plist:
Afterward, activate the ShowExternalLink option in WebViewController.swift file:
Done! :) Example format:
(would open google.com in the WebView app).
App Sharing Dialog API
The Sharing Dialog functionality of WebViewGold gives your app users the ability to share the download link of your application with their friends, family, and colleagues. It's an incredibly smooth and effective way of expanding the user base of your application.
WebViewGold allows triggering a native App Sharing Dialog dialog (WhatsApp, SMS, Mail, ...) by calling shareapp:// links:
<a href="shareapp://sharetext?=SHARING TEXT AND SHARING URL HERE">Share app</a>
In-App Purchase & In-App Subscription API
Within some apps, you can buy additional content or services. These kinds of purchases are called "in-app purchases". They can be an attractive source of revenue for developers and are very convenient for customers as they use existing accounts and payment sources for settlement. WebViewGold allows triggering App Store In-App Purchases. Make sure to own an Extended License of WebViewGold if you plan to use this feature in an end product. In the first step, insert the App Store Connect details of your In-App Purchase Shared Secret in Constant.swift file.
Afterward, just link to this kind of URL:
<a href="inapppurchase://?package=IN-APP_PURCHASE_PRODUCT_IDENTIFIER&successful_url=https://www.google.com&disableadmob=true">Buy In-App Purchase</a>
For subscription products, use this kind of URL scheme:
<a href="inappsubscription://?package=IN-APP_PURCHASE_PRODUCT_IDENTIFIER&successful_url=https://www.google.com&expired_url=https://www.yahoo.com">Start In-App Subscription</a>
All information about the In-App Purchase Product Identifier can be found here.
You can identify the user server-side. e.g., the site /buy_now.php redirects to In-App-Purchase API and that API redirects to /thanks.php, you can still access the user/session cookies server-sided and identify the user who just bought that In-App-Purchase.
QR Code Scanner API
QR codes are two-dimensional versions of the barcode. QR stands for "quick response". The term refers to the immediate access to the hidden information in the code. Both their design and their functions can be personalized, and they are ideal for connecting conventional print media with any and interactive online offer. WebViewGold offers a built-in QR code scanner that allows scanning these codes and opening the encrypted URL in the WebView afterwards.
Link to this kind of URL to trigger the QR Code Scanner:
<a href="qrcode://">Scan QR Code</a>
Rename package name / build & publish your app
To build your app, click on Run:
It can be possible that you see a message like this:
If this error happens (only then, please skip this otherwise), please 1. close Xcode, 2. navigate to Pods/Target Support Files/Pods-WebViewGold using the Finder app in the WebViewGold main directory and do a click on that Pods-WebViewGold-frameworks.sh file (no double click) while pressing the Control/CTRL key on your keyboard. 3. Click „Open“ and close the window after it appeared. 4. Restart Xcode by opening the main project.
Do you want to publish your app in the Apple App Store?
Use your Apple Developer Program Subscription to publish your app in the App Store. Before uploading, please change the package name:
Afterward, please add customized texts to the permission details in terms of location, photo/camera access, and all other API details. Delete permissions which are not required by your app. You find the details in Info.plist file:
Great, you are ready for the App Store submission of your web app. App Store approval works in most cases without any problems but highly depends on the content you provide in your app as WebViewGold does not provide content by itself. Please make sure to submit an app using a website/web app that behaves like a mobile app (for example, by using responsive design). Make sure that the content does not contradict the legal requirements of the Apple Developer Program. Use different link colors than standard HTML colors for better user experience.
The App Store upload asks you whether you use encryption? We do not offer legally binding advice, but "No" must be indicated here in most cases. However, if HTTPS is used, an annual security report may have to be submitted to US authorities. More information about this can be found here.
The App Store upload asks you whether you use the Ad ID / IDFA? The Ad ID is included because AdMob is integrated, but not active by default. Removing the AdMob SDK will produce a lot of dependency errors, so the easiest suggestion would be to choose "Yes" at the "Does your app use the Ad ID?" question and selecting the tickbox "Attribute this app installation to a previously served advertisement" only (leave all other tickboxes blank). So, if you use AdMob banner/interstitial ads in WebViewGold, please configure this screen like this. If you do not use AdMob banner/interstitial ads in WebViewGold while the SDK is still embedded (which is the typical case while not using AdMob in WebViewGold), please select these options.
If Apple rejects your app, please use Apple Resolution Center to explain the app feature in general (like "Our app enables our existing users to login in/use our products on their handheld device/....). If Apple still rejects your app, we can offer you a full refund of the WebViewGold license (by claiming within 14 days after purchase). Just contact us by mail.
Congrats to your App Store app! :)
Credits / License / Upgrade to Extended License
Please don't forget to add your Envato/CodeCanyon Purchase Code in the purchasecode field for each app published by you. One license per each customized and published end product is required.
You will need an Envato/CodeCanyon Extended License if any of these cases apply:
- You charge your users for the App Store download
- In-App Purchases API or In-App Subscription API will be used in your app
- You sell your final app on any marketplace
If you already bought the Regular License, you can upgrade the existing license here. Alternatively, if you do not want to request a refund or upgrade the license, you can re-use your existing Regular License for another app covered by the Regular License.
All rights (e.g. of images) belong to their respective owners. The provider of this source code is OnlineAppCreator.com c/o jocapps GmbH - registered in Germany - and is not affiliated with Apple. IOS is a registered trademark of Cisco and used under license by Apple Inc. iPad, iPhone, iPod, Xcode, and Xcode logo are registered trademarks of Apple Inc.
One license per each customized end product is required. Please take a look for license info of your CodeCanyon purchase: https://codecanyon.net/licenses/standard
WebViewGold for iOS uses OneSignal-iOS-SDK (© 2017 OneSignal) which is licensed under a modified MIT License; you may not use this file except in compliance with the license.
WebViewGold for iOS uses SVProgressHUD (© 2011-2018 Sam Vermette, Tobias Tiemerding and contributors) which is licensed under the MIT License; you may not use this file except in compliance with the license.
WebViewGold for iOS uses firebase-ios-sdk (© 2020 Firebase) which is licensed under the Apache License, version 2.0; you may not use this file except in compliance with the license.
WebViewGold for iOS uses Google Mobile Ads SDK (© 2020 Google) which is licensed under the Google Developers Site Terms of Service; you may not use this file except in compliance with the license.
WebViewGold for iOS uses nanopb (© 2011 Petteri Aimonen) which is licensed under the zlib License; you may not use this file except in compliance with the license.
WebViewGold for iOS uses promises (© 2020 Google) which is licensed under the Apache License, version 2.0; you may not use this file except in compliance with the license.
WebViewGold for iOS uses protobuf (© 2020 Google) which is licensed under a Google License; you may not use this file except in compliance with the license.
WebViewGold for iOS uses SwiftQRCodeScanner (© 2017 vinodiOS) which is licensed under the MIT License; you may not use this file except in compliance with the license.
WebViewGold for iOS uses SwiftyStoreKit (© 2015-2016 Andrea Bizzotto) which is licensed under the MIT License; you may not use this file except in compliance with the license.
WebViewGold for iOS uses GIF-Swift (© https://iosdevcenters.blogspot.com/).
If you have 10 seconds, please rate WebViewGold (it is a great motivation for future updates ^^):
1. Go to CodeCanyon.net and sign in
2. Navigate to https://www.codecanyon.net/downloads
3. Click the stars, as shown in this picture:
Thank you very much!