/ /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.

IMPORTANT: If you experience issues with Load Theme Pages or Start From Scratch functions, please refer to our Common Problems section for more details.

  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 (opens new window).
  3. Order - Category showing "Order Process" pages from Lagom WHMCS Client Theme, which can be configured via Page Manager (opens new window).
  4. Promotion - Category showing "Promotion Pages" from Lagom WHMCS Website Builder, which can be configured via Page Manager (opens new window)

# Page Settings

  1. Sections (opens new window) - Page showing list of all "Predefined Sections", which has been created in your product.
  2. Media (opens new window) - Place where you can configure all your uploaded graphics.
  3. Sitemap (opens new window) - Let you manage generation of website sitemap.
  4. Optimize (opens new window) - Monitor website speed and find out which server aspects could be improved, to optimize website loading speed.
  5. Export/Import (opens new window) - 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. Indexing - Display Search Engine Indexing status:
    • Green Circle - Search Engine Indexing is allowed.
    • Gray Circle - Search Engine Indexing is disallowed.
  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.

IMPORTANT: If you experience issues while creating new page with "Add New" button, please refer to our Common Problems section for more details.

# Mass Actions

  1. Item Selector - Select which page should be affected by mass action.
  2. Actions - Decide with what action you would like to proceed with for selected pages:
    • Duplicate - Duplicate selected page.
    • Publish/Unpublish - Change page status between published and unpublished for selected pages.
    • Allow/Disallow Search Engine Indexing - Decide whatever Search Engine Indexing has to be assinged to Allow or Disallow for selected pages. Read more about Search Engine Indexing here.
    • Delete Selected - Delete selected page.

IMPORTANT: Mass Actions will apply ONLY to the pages currently loaded in this tab. To perform actions on additional pages, you will need to load more pages first.

# 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.

Once option Enable Language URLs is enabled in Lagom WHMCS Website Builder settings you can implement permalink translations. By clicking the Translate Permalink button, you will expand the list of URLs associated with each available language. Here you can enter your translated version of the subpage URL. For instance, the German version of the "Shared Hosting" page can be set as example.net/de/geteilt-hosting.

Using language-based URLs makes navigation easier for visitors and improves SEO, as search engines can correctly index each language version of your content.

# 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 (opens new window) 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" (opens new window) page.

  1. Section Name - Display section name.
  2. Section Type (opens new window) - 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 (opens new window) file.

# Page SEO

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

# Search Engine Indexing

IMPORTANT: After installation of Lagom WHMCS Client Theme, the Page SEO feature is disabled by default which means the default WHMCS system configuration is applied, allowing pages to be indexed by search engines. To prevent pages from being indexed, you need to enable the Page SEO feature and set the "Search Engine Indexing" option to "Disallow". We strongly recommend reviewing and adjusting these settings manually to align with your website's specific SEO requirements.

This option defines if currently managed page should be crawled by the search engine robots, or added to the sitemap file (opens new window). 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 (opens new window) 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 (opens new window). 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:

# Edit Section

When logged in as an administrator, you can easily access the editing view of any section using the "Edit Section" button. This button appears when you hover your cursor over a section on the page.

Clicking the button will open a new browser tab with the RS Themes Addon, where you can edit the corresponding page and section directly. This button will appear in the top-right corner of each section that is currently visible on your screen.

Below, you can see an example of the button displayed for the "Banner Default" section.

# 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.

# 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!