Custom CSS

Learn how to add custom CSS code that will only be applied inside Canvas

On this page

Example H2

Turn your website into an app in 60 seconds!

Preview My App

Jack & Jones' desktop website and mobile app.

We can add custom CSS to apps by performing a check to the user-agent.

If the "canvas" string is included in the user-agent, it means that the content is being displayed inside the app.

Below you can find a code snippet that will save the user agent and then check if the "canvas" string is present, if so it will add custom CSS to the HTML head.

<script type="text/javascript">
	// Get the current user agent
	const isApp = navigator.userAgent.toLowerCase().indexOf('canvas') > -1;
	
	// Check if the user agent contains the canvas string
	if (isApp) {
	
	    // Outputs the custom CSS in case canvas is present in the user-agent
	    document.head.innerHTML += '<style>footer { display:none !important; }</style>';
	
	}
</script>

If you are using PHP you can use the following piece of code:


   0 ){
      echo "";
    }
 	?>

Custom CSS

Launch your brand's mobile app with a team of experts by your side.