Custom CSS

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

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

If the "MobiLoud" 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 "MobiLoud" 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 "";
    }
 	?>

Convert your website into a mobile app

Get custom mobile apps for iOS and Android that update
automatically with your site and works with your entire tech stack.
Rainbow Shops logo.Bestseller's logo.John Varvatos logo.
Thank you! We'll be in touch within 48 hours :)
Oops! Something went wrong while submitting the form.
Chat icon.