/ /website-builder/ /extensions/ /module-integration/ /order-form/

# Customize Existing Section Type

Unleash your creativity and give your website a unique identity by learning how to customize and override existing section types in Lagom WHMCS Website Builder. Your website should be a reflection of your brand and vision, and with Lagom's powerful tools, you can tailor every aspect to suit your needs. In this comprehensive documentation article, we will guide you through the process of customizing and overriding section types, providing you with the knowledge and skills to make your website truly your own.

Whether you are looking to tweak the appearance, add new functionality, or integrate your own design elements, we've got you covered. Join us on this journey, where you'll discover the freedom to shape your website according to your unique preferences, without limitations. Let's get started and unlock the full potential of Lagom WHMCS Website Builder to create a website that stands out from the crowd.

# Before Start

Before diving into the process of customizing your section types in Lagom WHMCS Website Builder, it is essential to be aware that such modifications require a foundational understanding of HTML, CSS, PHP, and Smarty code. These fundamental skills are necessary to ensure a smooth and effective customization process.

If you are not proficient in these languages, we strongly advise against attempting any customization. Please be aware that our Technical Support team does not provide assistance with code customization for our products, as this goes beyond the scope of typical support services.

However, if you lack the necessary coding expertise but still wish to pursue customizations, we offer custom development services at an hourly rate. Our dedicated development team is available to assist you in bringing your vision to life. Do not hesitate to reach out for professional assistance to make your Lagom Website truly your own.

# Section Types

The section types in Lagom WHMCS Website Builder are conveniently stored on your WHMCS server within the directory /templates/lagom2/core/cms/sections/config. Within this directory, you will discover a range of folders housing various section types, offering you a diverse selection of options to enhance your website.

# Overwrite Section Type

To overwrite existing section type files, you have to duplicate the file, which you'd like to overwrite, and add __overwritesat the end of its name. For example, if we decide to overwrite the banner section files, we have to go to the /templates/lagom2/core/cms/sections/config/banner/ folder, and then duplicate and rename the files:

  • banner__overwrites.tpl
  • section__overwrites.tpl

# Section Common Files

In the Lagom WHMCS Website Builder, the "Common" folder, located in /templates/lagom2/core/cms/sections/common folder, plays a pivotal role in streamlining your customization process. This folder contains essential .tpl files that are frequently used across multiple section types. By centralizing these shared resources, we eliminate the need for duplicating code and simplify the customization of multiple section types simultaneously.

It is important to note that, when making changes to these files, it is best practice to create an override file. Implementing alterations directly to the core theme files may lead to potential issues, as these changes can be overwritten by subsequent product updates. Safeguard your customizations and ensure their longevity by using override files for a seamless and efficient website-building experience.

# Overwrite Common Files

Overwrite function for common files, works exactly the same, as overwrites for Lagom WHMCS Client Theme (opens new window). For example, if you decide to create an overwrite for /templates/lagom2/core/cms/sections/common/package/price.tpl file:

  1. Create an overwrite folder in directory, where specific fila is located, in our example it will be /templates/lagom2/core/cms/sections/common/package/overwrites/,
  2. Duplicate the file, which you'd like to overwrite to the /overwrites/ folder which you created in first step,
  3. Open duplicated file and remove first 3 lines of code, and last line of code in this file with closing {/if} tag: