Cordova

How To Wrap A Website In A Cordova App

Posted by Weston Ganger on November 22, 2016

For one of my clients I needed to make a website wrapper app so they could have an app on the app stores. This can be done fairly simply using the following method.

First install cordova-plugin-inappbrowser:


cordova plugin install cordova-plugin-inappbrowser

Then heres the javascript to accomplish this. Notice I have applied some special options to the open function to make the site appear as if its not in a browser window.


document.addEventListener("deviceready", function(){
  var browser = cordova.InAppBrowser.open('https://mysite.com','_system','location=no,zoom=no,hidden=yes,toolbar=no');
  
  browser.addEventListener("loadstop", function(){
    browser.show();
  });
}, false);

You will probably want to show a loading page until the browser shows but thats up to you to add however you want.

Note: It is possible you could have troubles getting approved on the Apple App Store (or possibly even the Google Play Store) as you can possibly be denied for it only being a website wrapper but I have been successful in my attempts.


Related External Links:


Posted in Ionic and Tagged with cordova 


Need help on your next project or application?

I specialize in Ruby-on-Rails, AngularJS, Javascript, Bootstrap, and Hybrid Mobile Apps with Cordova & Ionic.

Contact Me

Recommended Posts