This tutorial uses Template Toolkit to create a new cPanel interface for the Paper Lantern theme. The examples below use the Paper Lantern theme's master template, which creates new interfaces that integrate seamlessly with the look and feel of the main cPanel interface.
For help to create a new cPanel interface in PHP, read our Create a New Paper Lantern Interface in PHP tutorial.
Create a new Paper Lantern interface
Create a Template Toolkit file with the Paper Lantern header and footer.
To begin, create a new Template Toolkit file. This file must use the
.html.tt file extension.
Use Template Toolkit's
WRAPPER directive to add Paper Lantern's header and footer to the template file.
Add the interface's title.
page_title attribute to the
WRAPPER directive. You can set any string as the
page_stylesheets attribute to the
WRAPPER directive. Use this attribute to apply one or more CSS stylesheets to the interface.
Enter the CSS files' paths relative to the
page_scripts attribute to the
WRAPPER directive. Use this attribute to call one or more scripts that will run when the interface loads.
Enter the scripts' paths relative to the
When you include jQuery in an external file, you can call it normally via Template Toolkit's
page_scriptsattribute. For example, the following code calls the
For more information about how to use the
page_scriptsattribute, read our Create a New Paper Lantern Interface tutorial.
- If you use the
page_scriptsattribute to load exernal files, the external files must use the
.min.jsfile extension. However, the filename that you specify to the
page_scriptsattribute will only use the
.jsfile extension. cPanel's master template automatically transforms the
.jsextension in the
page_scriptsattribute to the
page_styles attribute to the
WRAPPER directive. Use this attribute to add specific styles for use in your template.
In the example below:
- Line 11 adds the
- Lines 14 through 20 add a
page_js attribute to the
In the example below:
- Lines 1 and 2 process the
- Line 14 adds the
js_blockscript to the template.
Lines 25 through 36 contain the
This example includes code that uses jQuery and wraps it in a
define()block. In cPanel & WHM version 54 and higher, you must wrap jQuery code in a
define()block. For more information, read our Guide to cPanel Interface Customization - jQuery documentation.
Disable legacy cPanel styles, scripts, and CJT scripts.
include_cjt attributes in the
WRAPPER directive to
0 to exclude cPanel's legacy styles, scripts, and CJT scripts from the template.
This ensures that your template uses Paper Lantern's functionality, rather than styles and scripts from our older x3 theme.
Set the directory prefix cPanel variable.
CPANEL.CPVAR.dprefix variable. This ensures that links to other cPanel interfaces, search results from the cPanel interface's search menu, and certain menus function correctly in cPanel & WHM version 11.52 and later.
Line 20 sets the