WHMCS templates installation

We are giving only WHMCS templates that we designed on WHMCS's default template twenty-one. We did not change anything except the design.

Prerequisites:

  • You should have installed WHMCS on your server. Please check the WHMCS Official Documentation.
  • Check that your installed WHMCS is working with a default template like `twenty-one`.

Then follow our documentation's instructions to install our WHMCS template.




How to install the WHMCS templates?

We have designed the WHMCS template and orderform. If you want to use hostim/kohost/hostlar (the installation steps are same for all templates) whmcs template then you need to follow the below steps to complete the template installation completely:

1. Add your WHMCS template - `hostim`/`kohost`/etc or rtl version to the templates folder

2. Add the `themetags_cart` orderform to the orderforms folder

3. Add hooks files to the hooks folder

4. Add the language english.php to the lang folder

5. Configure your price from the WHMCS admin panel

6. Change the default WHMCS template and orderform from the admin panel


Add Templates Folder

Add your WHMCS template (hostim/kohost/hostlar or -rtl) to the templates folder.

  • Go to the path:  /<your-public-root-directory>/whmcs/templates
  • Unzip your uploaded template/file if you have the zip version
  • You will see the template folder name like - kohost/hostim/hostlar/kohost-rtl/etc (based on your template)
  • View this screenshot as an example of kohost template:


Add Orderforms

Add the themetags_cart  orderform to the orderforms folder

  • Go to the path: /<your-public-root-directory>/whmcs/templates/orderforms
  • Unzip the `themetags_cart` orderform folder if you have the zip version
  • Add the `themetags_cart`  folder


Add hooks to hooks folder

Add the hooks file to the hooks folder:

  • Go to the path: /<your-public-root-directory>/whmcs/includes/hooks
  • Unzip the hooks folder if you have the zip version
  • Add the hooks file in the hooks folder. Please check the below screenshot: 


How to Update Language

Add overrides folder to the lang folder:

  • Got to the path: /<your-public-root-directory>/whmcs/lang/overrides
  • Upload the overrides folder to your lang folder. In this overrides folder we have included english.php file. This english.php file is overrided and added all new variables for our template.



Check video instruction how to update your language file. Follow this video tutorial



Change Default Template and Orderforms

You can select our template and orderform from the General setting. To change the default template from the general setting:

Click the setting icon right side of the navbar then click the general setting: 


Go to the general setting>general then select the template like kohost: 


Change the default Orderform from General setting:

In this General setting, click the tab Ordering then you can see the different types of the order form template. Now select the Themetags Cart/ kohost cart. Check the below image:

After selecting, this then clicks the Save Change button.


Configure your product or price

Configure your product or price from WHMCS admin panel:

First of all, log in to your whmcs admin panel then click the setting icon right side of the navbar> products/services follow the steps:


I hope you have already created your product group name and under the group then add the single product under the group. If you don't have this package then you should create one first. Then edit the single product package like the below images:

Click the edit icon then you can see the below image. Copy this code and paste into the product description field like below image. You have to change the text or value based on your plan and follow it for the rest of the plan and product.

<span><strong>5 GB </strong>SSD Storage</span>
<span><strong>250GB</strong> Bandwidth</span>
<span><strong>5</strong> Websites Included</span>
<span><strong>FREE</strong> SSL Certificates</span>
<span><strong>LiteSpeed </strong>with LSCache</span>
<span><strong>Free</strong> Domain Included</span>
<span><strong>24/7 </strong>Phone Support</span>


Change cart link from Domain Result Page ( This is for html template )

Open the domain-search-result.php from the kohost/dist folder and find the below code around line number 674

<td>
<a href="https://whmcs.themetags.com/cart.php?systpl=kohost&a=add&domain=register&query=<?php echo $domainName; ?>" class="btn btn-brand-01 btn-sm">Add to Cart</a>
</td>

Change https://whmcs.themetags.com/  with your WHMCS base URL. If you have made the kohost as your default theme then you can remove also systpl=kohost& from the link.




How to setup WHMCS Multi-Currency?

1. Add your currency:

Go to your admin panel then click the setting icon right side of the navbar. Then type "currencies" on the search box, then click on it. check this below image:


After clicking it, now you need to add your currency like this:

 

Need to fill up the currency code, Prefix, Format and Base Conv. Rate. We need this currency code in the currency hook file. Now click the Add Currency button.

2. Add the currency code and flag in the hooks/config/settings.php:

In this multi-currency, we have used the country flag location path (.svg format). We have 23 country flags included in our templates/{your-template}/img/flags folder.

If you need to add a new country flag then:

  1. First, add your currency from add multiple currencies
  2. Then add/upload your flag in `templates/{your-template}/img/flags` folder
  3. And add the currency code and flag path in getFlags function like 'BDT' => 'img/flags/BDT.svg', . BDT has come from currency code field. Check that we have used BDT.

NB: Make sure your image name will be your country code like USD, GBP, etc... 


Configure Domain Price For Multi-Currency

3. Configure your domain price for multi-currency:

Go to do admin panel click the setting icon right side of the navbar then go to the domain price option like the below image.

After clicking, domain pricing then you will go to the domain price-setting option. After clicking the pricing button domain then open a popup option now you can set your multi-currency price value. Check bellow image

NB: This option is available after enabling the multi-currency option.


Configure the product price and multi-currency

4. Go to the product/services configure option then click the edit icon. Check this image:


After clicking the product edit option then click the price tab on the tab option bar. Check the image below. 


NB: This option will be available after enabled the multi-currency option.



Show Products in the Home page

This is the products in the home page:

** Although this is kohost screenshot but same would be for your template

Open "hooks/config>settings.php" to set the product id to show the products in the homepage.


This is the setting for showing the product on the homepage. This setting comes from hooks>config>settings.php file.

Go to this file and change the 24, 25, 26, 27 (product id). You will find the id from Setup>Products/Services>Products/Services. We have given 4 products and icons but you can add more products or less product. Just add or remove from the array.


How to add favicon

First of all, add your favicon image in your templates/{your template name}/img folder. Make sure your favicon name will be favicon.png and height, weight keeps the same like 80x80.




How to change template color and font

We have used CSS variables for color and fonts, so if you want to change color and fonts then just change the color and fonts variable value. 



Go to your template includes>tt>"your template name">css>variables.css folder file then open variables.css file. Check bellow image-


Manage Top Menu
We have customized the menu using the bellow function on tt_hooks.php in the hooks folder.


For more details: https://docs.whmcs.com/Editing_Client_Area_Menus


In the domain search section, we have added domain lists like .com, .net, .org, etc, with a price. We have managed the domain price list from the tt_hooks.php hook file.


Before that, you need to make sure that you have set the domain price from your admin panel. Go to Setup>Products/Services>Domain Pricing. Check the below image:


Click the pricing and set the domain price.