Free App Builder – Extending Link Feature

83 / 100

Using the source code module on our free app builder is easy; you can use links to the website or WhatsApp or google map links.
You can also choose how they are opened:

The 3 choices available on our free app builder are:
– in-app browser
– custom tab (open a web link in the device browser, embed in the app)
– external apps (open another app: websites open the device browser, WhatsApp link open WhatsApp app)

The following also works in the source code block of the custom page module of our app maker.
Here are some examples of how to realize this using the source code module:

The links used can be as follow:

Free App Builder Source Code Feature

Free App Builder | Source code | Swiftspeed Appcreator

<!-- Usual weblink-->
https://www.mydomain.com

<!-- What's app share message-->
whatsapp://send?text=Hello%2C%20World!

<!-- What's app to specific number android & ios-->
whatsapp://send?text=Hello%2C%20World!&phone=+3312345678&abid=+3312345678

<!-- Tel -->
tel://+33012345678

<!-- Sms -->
sms://+3312345678?body=Hello%2C%20World!

<!-- Email-->
mailto://bob@bob.fr

<!-- open app for navigation - geo:latitude,longitude -   more on https://developers.google.com/maps/documentation/urls/android-intents -->
geo:48.858370,2.294481

<!-- search for restaurant - geo:latitude,longitude?q=restaurants - more on https://developers.google.com/maps/documentation/urls/android-intents -->
geo:48.858370,2.294481?q=restaurants

<!-- waze-->
waze://?ll=43.5367,1.52806&navigate=yes

Note: This list is not exhaustive

You can create a link as follow:

<a href="#" onclick="parent.window.open('https://www.mydomain.com', '_system')">open www.mydomain.com in the device browser</a>
<br>
<a href="#" onclick="parent.window.open('https://www.mydomain.com', '_blank')">open www.mydomain.com in the in app browser</a>
<br>
<a href="#" onclick="parent.cordova.plugins.browsertab.openUrl('https://www.mydomain.com', {'showTitle': true});">open www.mydomain.com in a custom tab</a>
<br>
Of course, all links using antyhing else than a website has to use the exernal app: 
<a href="#" onclick="parent.window.open('geo:48.858370,2.294481', '_system')">open www.mydomain.com in the device browser</a>

If you plan to build a page with many links, you can use the below function:

<script>
function mylink(type, url){
  switch (type) {
    case 'external':
      parent.window.open(url, '_system');
      break;
    case 'inapp':
      parent.window.open(url, '_blank');
      break;
    case 'customtab':
      parent.cordova.plugins.browsertab.openUrl(url, {
        'tabColor': parent.window.colors.header.backgroundColorHex,
        'secondaryToolbarColor': parent.colors.header.backgroundColorHex,
        'showTitle': true,
        'enableUrlBarHiding': false,
        'selectBrowser': false,
      }
      );
      break;
  }
}
</script>

<a href="#" onclick="mylink('external', 'https://www.mydomain.com')">open siberiancms in the device browser</a>
<br><br>
<a href="#" onclick="mylink('inapp', 'https://www.mydomain.com')">open siberiancms in the inapp browser</a>
<br><br>
<a href="#" onclick="mylink('customtab', 'https://www.mydomain.com')">open siberiancms in a custom tab (browser embeded in app)</a>
<br><br>
<a href="#" onclick="mylink('external', 'whatsapp://send?text=Hello%2C%20World!&phone=+3312345678&abid=+3312345678')">whatsapp</a>
<br><br>
<a href="#" onclick="mylink('external', 'sms://+

The feature helps you to create links that will open in the app, the new chrome custom tab, or the device browser, depending on your preferences. Let’s say, for example, you are a blogger with a substantial amount of traffic, and you are interested in creating an app to offer more experience to your website users. At the same time, you make money doing it; then this feature is for you. See how to add it to your application using this complete guide. You can publish your app on google play to gather more users and monetize your traffic with Google Admob.