Lagom WHMCS Client Theme Documentation
Docs v2.x
/ /website-builder/ /extensions/ /module-integration/ /order-form/

# Website Pages

Welcome to the comprehensive guide on creating and managing Website Pages with Lagom WHMCS Website Builder (opens new window). This article walks you through the process of designing engaging web pages that align perfectly with your brand. Explore the tools and features that empower you to shape a captivating online presence.

# Main Page

# First Activation

After first activation of the CMS display type, you will be able to choose if you want to import demo pages to your installation, or start from scratch.

  1. Load Theme Pages - When selected, it will import following data:
  2. Start From Scratch - When this button is selected, our addon will load ONLY new navigation, as shown in below video:

# Page List

# Page Categories

  1. Website - Page showing list of CMS pages generated by the Lagom WHMCS Website Builder.
  2. Client Area - Category showing "Client Area" pages from Lagom WHMCS Client Theme, which can be configured via Page Manager.
  3. Order - Category showing "Order Process" pages from Lagom WHMCS Client Theme, which can be configured via Page Manager.

# Page Settings

  1. Sections - Page showing list of all "Predefined Sections", which has been created in your product.
  2. Media - Place where you can configure all your uploaded graphics.
  3. Sitemap - Let you manage generation of website sitemap.
  4. Optimize - Monitor website speed and find out which server aspects could be improved, to optimize website loading speed.
  5. Export/Import - Export or import selected settings from/to Lagom WHMCS Website Builder.

# Page List

  1. Name - Display name of created website pages.
  2. URL - Link under which created website pages will be available to your visitors. You can click on link to open preview of specific page.
  3. Status - Publication status of selected pages, this column display following statuses:
    • Published - Page with "Published" status will be visible for customer, under selected url.
    • Disabled - Page with "Disabled" status will be only visible for administrators, who are logged in to the WHMCS admin area. These pages will not be included in the sitemap.
  4. SEO - Display SEO activation status:
    • Green Circle - SEO is enabled.
    • Gray Circle - SEO is disabled.
  5. Manage - Navigate to management page of specific website page.
  6. Search - Enter page name to find what you are looking for.
  7. Add New - Create new website page.

# Page Title

  1. Page Name - Set name of created page. This name is used in <title> tag, when "SEO Title" is not provided.
  2. Permalink - Define url of created website page. When page is created for the first time, permalink is automatically generated from the page name. However you are able to modify this when needed, as shown in below video.

# Page Translations

You have the capability to translate all elements of pages generated by Lagom Website Builder. When you access the management page, it will initially have the language preselected, which corresponds to the "default" language set in your WHMCS system settings (opens new window).

# Page Translation

Important: When creating a new page, it is essential to begin with the configuration using the default language. After you have completed the configuration for that language and saved the page, you can then switch to other languages and commence the translation process.

To start translation of specific page, you need save current changes, and then select language from the dropdown list:

When a new language is selected, the content within the 'Page Section' will be dynamically refreshed with the corresponding text settings, as illustrated below:

# Section Settings

When you modify the settings of specific sections, these changes apply universally across all languages. For instance, if you assign a different background in the English language, that background will also be updated for all other languages:

# Page Sections

Assign and manage sections displayed on managed CMS page.

# Add New Section

There are multiple ways to add new section to the currently managed page. First option is to click on the one of the "Add New" buttons, located at the top and at the bottom of the section list.

Second option is to "hover" between section panels, this option is a quick way to add new section, between two already existing sections, as shown in below video:

# Choose Section Type

# New Section Modal

While adding new section to the currently management page, you have to choose what kind of section you want to use. When "Add New" button is clicked, section types will be shown in modal.

# Section Management

Once specific section type is selected, it will load different management fields, based on the section type which you choose.

# Choose Predefined Section

These are the sections, which can be re-used on multiple pages in the same state, so you do not have to fill the same information many times, for example section with "Testimonials", which is used in our demo (opens new window) on almost all website pages.

While adding new section to currently managed CMS page, you can choose to add "Predefined Section", by clicking "Choose Predefined Section" in the tabs at the top of the modal.

This tab will list all sections which has been created in "Sections Manager" page.

  1. Section Name - Display section name.
  2. Section Type - Shows type of created section.

# Section Panel

  1. Collapse Button - When clicked it will expand section configuration options.
  2. Section Type - Display type of currently added section.
  3. Section Name - Automatically generated name, so it would be easier to distinguish sections on the section list.
  4. Remove - By clicking on "Trash" button, specific section will be removed from managed CMS page.
  5. Enable/Disable - When "switcher" is disabled, specific section will not be shown on managed CMS page.
  6. Section Style - Defines what background color will be used for specific section, there are four different styles, which you can use:

# Page Settings

# Publish Page

Allows to publish, or unpublish currently managed page.

  1. Published Page - Published page will be visible for your website visitors, via configured page url.
  2. Not Published Page - Not published page, are only visible for logged in WHMCS administrators. These pages are not visible to your website visitors, they are also not indexed by the search engines, nor added to the website sitemap. Even when "SEO" is enabled.

# Set as Homepage

When this option is selected, currently managed page will be set as your website homepage. This option can be selected ONLY for one page.

# Body Class

Here you can add custom classes which will be added to the <body> tag of currently managed page. This can be handy, if you decide to add custom styling to this page, via custom CSS file.

# Page SEO

Click on the "switcher" next to the "SEO" title, to activate SEO management for currently managed page

# Robots

This option defines if currently managed page should be crawled by the search engine robots, or added to the sitemap file. There are two options to choose with:

  1. Allow - When this option is activated and page is published it will be added to the sitemap file. Additionally index follow code will be added to your page <head>, which will allow to index this page by search engines.
  1. Disallow - When this option is activated, new record will be added to the robots.txt file and noindex nofollow code will be added to your page <head>, which will block search engines crawlers from listing it in the search results.

# SEO Title

Place page title which will be added to the <title> tag in your page HTML code. This title will be used by search engines, while listing your page in search result.

Our addon, will automatically generate additional tags, generated from this title:

  1. og:title - Learn more about Open Graph protocol (opens new window)
  2. twitter:title - Learn more about Twitter Cards (opens new window)

# SEO Description

Enter page description which will be added to the <meta name="description"> tag in your page HTML code. This title will be used by search engines, while listing your page in search result.

Our addon, will automatically generate additional tags, generated from this title:

  1. og:description - Learn more about Open Graph protocol (opens new window)
  2. twitter:description - Learn more about Twitter Cards (opens new window)

# Social Image

Upload graphic or choose from already existing graphics in your media library. Suggested graphic size is 1200x630px.

Selected graphics will be added to following tags:

  1. og:image - Learn more about Open Graph protocol (opens new window)
  2. twitter:image - Learn more about Twitter Cards (opens new window)

# SEO Translation

SEO text fields can be translated into required languages by clicking on "Translate" link, shown next to the field label.

Once "Translation" link is clicked, modal with multiple fields will be shown. Enter translation to required language fields, and click "Save Changes" button. If translation for specific language will not be provided, our system will display "Default" language in HTML code.

# Page Actions

# Save Changes

Page configuration will NOT be saved until "Save Changes" button will be clicked! This button saves modification which you have made in currently managed page.

Remember to saves your changes as often as possible! So you will not loose any changes.

# Cancel

Cancellation button will erase changes which you have made, since last saved version and will automatically redirect you to the "Website Pages" list.

# Show History

"Show Edit History" button opens edit history sidebar, where you can load older version of currently modified page.

# Delete

"Delete" will remove currently modified page from database. By clicking on this button, additional confirmation modal will be shown.

This action can NOT be undone! Please make sure to select correct action!

# Duplicate

"Duplicate" button, lets you to easily duplicate specific page. Once clicked page will duplicated with number prefix, as shown in below video:

# Data Protection

We have implemented additional functions to the CMS page management, which will minimize the risk of data lost. We can NOT guarantee that these functions will always save your data, that is why we do suggest to save your work as often as possible, so you will be sure that no changes will be lost.

# Auto Save

IMPORTANT: Autosave starts working ONLY after first save on newly created page.

When you manage CMS page, our addon auto saves your work, every 60 seconds in temporary location. If your post has been updated, the next save will overwrite the older ones. Only one (the latest) autosave is stored for each CMS page.

If your browser crash, or if you close browser tab by accident, you will be able to restore the auto saved data for your page.

  1. Visit previously edited page
  2. If our addon detect that auto saved data has more up to date changes, it will display a modal.
  3. After clicking on "Load" button, your unsaved data will be loaded to the currently managed page.

# Edit History

Each CMS page store history of 7 edits, which can be managed by clicking on "Show Edit History" button in bottom bar.

# History Sidebar

"Edit History" sidebar contains following information"

  1. Current Version - Currently loaded version displays "green bar" on the left side.
  2. Each records displays modification date and administrator user name which implemented the changes.

# Loading Versions

By selecting specific record in "edit history" sidebar, you will load specific version of currently managed page. Loaded version will not be saved until "Save Changes" button will be clicked!

← Website Predefined Sections →