Custom Javascript

This feature is use at your own risk. We cannot provide technical support for issues with custom Javascript.

It's possible to add custom Javascript to your app by uploading a .js file in your app customizer settings. This file will then be loaded into your app. This feature is not available for all plans.

It's important to know a few things first:

1. We do not offer support for custom code. If your code breaks your app, you have to fix it.
2. You cannot use jQuery, Angular, or any other library, just plain Javascript.
3. Keep it simple. It's not a good idea to be writing complex scripts, it may produce unexpected results.

How to use this feature

First you'll need to write a custom javascript file. We recommend you write your code in a self-executing anonymous function like this:

( function() {

// your code here

})();

You can only use plain Javascript, no jQuery or Angular. We have a helper function named "ready" that is important to use. You are adding normal Javascript into an Angular environment, so your code will not execute the same way as a normal webpage. Using our "ready" function, you can always make sure your elements are loaded before manipulating them.

Here is some example code:

// Put your custom code inside this anonymous function
( function() {


	// use this custom ready function to make sure your element is available
	ready('#clickMe', function(element) {


	    var el = document.getElementById('clickMe');


		el.addEventListener('click', function() {
		  window.open('https://apppresser.com', '_blank');
		});


	});


	// Here's another example of using the native social sharing
	ready('#clickMeToo', function(element) {


		var el2 = document.getElementById('clickMeToo');


		el2.addEventListener('click', function() {
		  window.plugins.socialsharing.share('My custom message');
		});


	});


})();

Notice we are using the "ready" helper function to check if the element is loaded before doing anything with it. We recommend you copy the above code into your own file, make edits, and save.

In the code above we are referencing elements with an ID of "clickMe." To make that do something, we created a custom HTML page, and added a button with that ID like this:

<button id="clickMe">Click Me</button>

Now when that custom page is loaded, and that button is clicked, it will execute our code.

Uploading Your Custom Javascript File

Visit your app customizer, click the Settings tab, and scroll down to Custom Javascript. Upload your .js file, do not zip the file.

Save your app and rebuild, and you will be able to test your code in the browser preview. Remember that device features such as social sharing only work on a device.

Interacting with WordPress

Your custom Javascript file is added into the app files, which are not a part of WordPress. Your custom Javascript can interact with your app menu, toolbar, custom HTML pages, and API list pages. It is not meant to interact with WordPress pages.

To run custom Javascript on your WordPress pages, you can use a  child theme and enqueue the script there.