Knowledgebase

This guide explains how to properly install our WHMCS theme and edit the HTML of individual pages.

How to Install the Theme

Follow the steps below to install the WHMCS theme correctly:

1. Access the WHMCS Root Directory
   Log in to your server using FTP or cPanel File Manager and navigate to the WHMCS root directory.

   You can confirm you are in the correct location if the directory contains a folder named templates.

2. Upload Theme Files
   The theme package includes a folder named WHMCS x.xx.x, which contains:

   • A templates directory

   • One or more PHP files

   Upload both the templates folder and the PHP files directly into the WHMCS root directory.

   When prompted, choose Overwrite All Files to ensure proper installation.

3. Activate the Theme

   • Log in to the WHMCS Admin Panel

   • Navigate to Setup → General Settings

   • Select your theme from the Template dropdown (e.g., your_template)

   • Click Save Changes

The theme is now successfully installed and activated.

How to Edit Page HTML (Template Files)

WHMCS uses .tpl (Smarty template) files to control page layout and content. To edit a specific page, follow these steps:

1. Identify the Page URL
   Open the page you want to modify in your browser and note the filename in the URL.

   Example:

   https://demo.whmcshunk.com/shared-hosting.php
   

2. Locate the Corresponding Template File
   Based on the page URL, locate the matching template file inside your active theme directory:

   /templates/your_template/shared-hosting.tpl
   

3. Edit the HTML / Smarty Code
   Open the .tpl file using a code editor and modify the HTML, CSS classes, or Smarty variables as required.

4. Save and Refresh
   Save the file and refresh the page in your browser to see the changes.

How to Add a New Page in WHMCS

You can create a custom page in WHMCS by following the steps below:

1. Create a New PHP File

   • Go to the WHMCS root directory.

   • Copy an existing page file such as vps-hosting.php.

   • Rename the copied file (for example: cloud-hosting.php).

   • Open the new PHP file and update the page variables, template name, and logic as required.

2. Create the Corresponding Template File

   • Navigate to your active template directory:

     /templates/your_template/
     

   • Create a new .tpl file with the same name used in the PHP file (for example: cloud-hosting.tpl).

   • Add your HTML and Smarty code to design the page layout.

3. Add New Template Name in Common Layout Files
   To ensure the header, footer, and other common elements load correctly, add the new template name to the conditional blocks in the following files:

   • includes/head.tpl

   • header.tpl

   • footer.tpl

   Update the existing {if} conditions to include your new template name where required.

4. Test the New Page

   • Open the new page in your browser (e.g., https://yourdomain.com/cloud-hosting.php).

   • Verify that the header, footer, and page content load correctly.

Notes & Best Practices

• Always keep a backup before overwriting or editing files.

• Avoid editing core WHMCS files unless necessary.

• Clear the WHMCS template cache if changes do not appear immediately.

• Use a staging environment for testing major design changes.

If you need assistance customizing specific sections or integrating dynamic WHMCS variables, refer to the WHMCS Smarty documentation or contact our theme support.