# Customize Homepage

Lagom WHMCS Client Theme is equipped with two different templates for the "Homepage". We will guide you step by step on how to make modifications to the "Modern" (opens new window) template.

# Before You Begin

Make sure that the WHMCS homepage is enabled in WHMCS settings. It is important to have the "Default to Client Area" option unchecked, otherwise, WHMCS will automatically redirect you to the "Login" page.

# Configure "Modern" Template

You can activate and configure the "Modern" homepage template with its default content. To do so, proceed to our demo page (opens new window). If you would like to use your own content for the "Modern" template, please follow the Advanced Modification article.

# Activate "Modern" Template

After the first installation of Lagom WHMCS Client Theme, all Lagom "Pages" use the "Default" templates. Refer to the instruction below to activate the "Modern" template for your homepage:

  1. Log in to the WHMCS admin area on your server.
  2. Open the "Addons" tab in the main WHMCS navigation, then choose the "RS Themes" addon.
  3. Proceed to the "Pages" tab.
  4. Search for "Homepage" and press "Manage".
  5. Click on the "Modern" box, and "Save Changes". Your homepage template has been changed successfully!

# Template Settings

Here you can define which sections should remain visible to your customers:

  1. Show Banner Navigation - you can show or hide boxes used to navigate between banner slides.
  1. Show Domain Search - decide if you wish to display or hide the section with domain search.
  1. Show Product Groups - choose whether the section with product group boxes should be shown or hidden.
  1. Show Features Section - define whether you would like to display or hide the section with features.
  1. Show Testimonials Section - enable or disable showing the section with testimonials.
  1. Show Latest News Section - decide if the section with the latest news should be displayed or hidden.
  1. Show Get Started Section - choose whether you want to show or hide the section with the call to action button.

# Manage SEO

You are also given the possibility to manage homepage SEO by activating this option in the right sidebar under the "Page Settings" title. Find out more in "Page SEO".

# Configure Banner Slider

The main slider displays WHMCS MarketConnect (opens new window) products. If those products are not configured in your WHMCS system, then the slider section will not available on your Lagom installation.

# Activate Product Slide

The slide for each product will be displayed on the homepage only when the "Homepage" option will be enabled in MarketConnect "Promotion Settings".

# Customize Slide Text

You can freely customize the title and description displayed on each slide in the product group settings of your WHMCS admin area.

  1. In order to configure products, proceed to Configuration > System Settings > Products/Services.
  2. Choose a product group that you wish to customize, for example, "SSL Certificates".
  1. To customize the slide title, change the "Product Group Headline" content.
  2. To customize the slide description, edit the "Product Group Tagline" content.
  3. To create translations of these inputs, please activate "Easy Translations" as described in WHMCS documentation (opens new window).

# Create Custom Slides

By default, you CANNOT display custom products or slides in the "Modern" template slider. This is only possible by using our "Promotion Manager" (opens new window) extension that needs to be purchased separately.

# Configure Domain Spotlights

If the "Show Domain Search" section is active in "Template Settings", you will see the "Domain" section with featured TLDs on your homepage.

# Add Spotlight TLD

Domain TLDs displayed in this section can be managed in WHMCS settings.

  1. Go to Configuration > System Settings > Domain Pricing.
  2. Click the lightbulb icon next to the TLD you wish to spotlight. It will appear in the Spotlight TLD section at the top of the page.
  3. Repeat this process for up to 8 TLDs.
  4. Spotlighted TLDs can be dragged left and right to change the order in which they appear on the domain results page.
  5. To remove a Spotlight TLD, click the X next to the TLD in the Spotlight section at the top of the page. This action deletes the TLD from the spotlight section on the domain results page.

# Advanced Modification

To proceed with further modifications, it is necessary to make changes to the Lagom theme files. The below articles are prepared for more advanced customers, who have at least basic knowledge about HTML, CSS, Smarty and PHP.

In case you do not have appropriate knowledge or time to perform such customizations, our team offers "Custom Development" services, which can be requested using the Custom Project Request contact form.

# Duplicate Template

Before you start modifying the "modern" template files, you have to duplicate the "modern" folder, so your modifications will not be overwritten by future theme updates.

  1. Log in to FTP/SFTP of your WHMCS server.
  2. Proceed to the /templates/lagom2/core/pages/homepage/ directory.
  3. Duplicate the modern folder and change its name (do not use special characters or spaces). For example, you can name it custom.
  4. Open the duplicated folder.
  5. Open the pageoption.php file and change the display_name value.
  6. Come back to the RS Themes addon and activate the created Page Template. You can take a look at the created template only for your browser session:
    • open your browser and visit the homepage,
    • add ?rspage=[template name], or &rspage=[template name] if a specific URL already has one ? sign,
    • your custom template will be activated only for your browser session.

# Customize Sections Text

Text strings used by default in the "Modern" template are located in the Lagom language files. To modify a specific section title or description, you need to create a language override as described in the "Language Overrides" article.

All strings used in the "Modern" template are located in the homepage array /templates/lagom2/core/lang/english.php:

# Customize "Product Groups" Section

Please follow the below article to customize product groups visible in the "Products For All Businesses" section.

# Change Product Group IDs

By default, the "Modern" template shows product groups with IDs 1, 2 and 3. This can be customized in the homepage.tpl file. To replace those IDs, you need to find the product group ID of a product that you would like to show:

  1. Go to Configuration > System Settings > Products/Services.
  2. Find a product group that you wish to show and hover over the "Edit" category icon (do not click).
  1. The product group ID is visible in the bottom left corner of the browser window.
  1. Enter this ID in the gid field in the homepage.tpl file:
  1. Repeat this process for the remaining boxes.

# Change Product Group Icon

You can assign any Lagom SVG icon located in the /templates/lagom2/assets/svg-icon directory. You can find a list of available icons below.

To assign a different icon, you need to modify the icon field in the homepage.tpl file. Enter the correct icon file name:

# Customize "Features" Section

Features available in the "Our Guarantees" section can be customized in the Lagom translations as described in "Customize Section Text". If you would like to assign a different icon to a specific "feature", you need to customize the homepage.tpl file. You can assign any Lagom SVG icon located in the /templates/lagom2/assets/svg-icon directory by entering the icon file name without the .tpl extension:

# Customize "Testimonials" Section

By default, Lagom shows exemplary testimonials. Refer to the following article to start customizing its content.

Testimonial boxes can be edited in the homepage.tpl file by modifying the below array.

  1. author - the first and last name shown next to the avatar in the testimonial box.
  1. avatar - the graphic loaded from the /templates/lagom2/core/pages/homepage/[template name]/assets/img directory. You can upload your custom graphics to that folder.
  1. website - the link to the testimonial author website.
  1. description - the description visible in the testimonial box.

# Customize "CTA" Section

The content displayed in the "Let’s Get Started!" section can be customized in the Lagom translations as described in "Customize Section Text".