Adding custom code to your page

Warning: This feature is intended for users who are familiar with HTML, CSS, and Javascript. If you are not familiar with these we strongly advise not using this feature as it can affect your pages stability, look and performance. If you are a web pro have fun!

Custom Code Overview

Custom Code is a  Premium feature. Login and go to "Page Settings" > Advanced where you will find a textarea for "Custom Code." This textarea will be injected directly in to the head of your page on every page load. This allows for you to do highly advanced customizations for restyling the page to adding new sections and interactivity.

The following tags are supported in the <head> ( learn more ): 

  • <title>
  • <style>
  • <base>
  • <link>
  • <meta>
  • <script>
  • <noscript>
Important: A note about parsing and https

Adding Custom CSS

There are two ways to add custom styles to your page. You can use the <style> tag or link to a stylesheet using the <link> tag. 

To add custom CSS using the <style> tag simply add:

<style>
	...your custom styles
</style>

To add custom CSS using the <link> tag simply add:

<link rel="stylesheet" type="text/css" href="https://path.to/your/stylesheet.css">

Custom CSS Examples

Booklaunch is built using  Bootstrap and you can leverage any of their structure or styles.

Adding Custom Javascript

Important: Booklaunch is a client side asynchronous application. Before you run scripts that interact with loaded content please make sure to wrap your scripts with the pageReady event callback below. 

You can use the <script> tag to add custom javascript to your page or load a javascript file.

To add custom javascript to your page simply add:

<script> 	
	...your script 
</script>

To load a javascript file to your page simply add:

<script src="https://path.to/your/javascript.js"></script>

pageReady

To ensure the page is fully loaded and all DOM elements are available to you wrap your javascript code in the pageReady event callback.

<script>
	document.addEventListener('pageReady', function (e) { 
		//your code here
	}, false);
</script>

Wrapping your code in pageReady also makes jQuery available using the $ variable. 

Custom Javascript Code Examples


Adding Custom Meta Tags

To add custom meta tags to your page simply add:

<metaname="keywords" content="my,custom,keywords,here">

Coming soon: sample meta code snippets.

Still need help? Contact Us Contact Us