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

# Section Banner Domain

The "Banner Domain" (see demo) (opens new window) section type in Lagom WHMCS Website Builder is a flexible way to show important domain info and offers on your website. It helps you get people interested in your domain services and encourages them to learn more. Using the "Banner Domain" well can make your domain services stand out, attract more people, and show them how they can register domains in an interesting way.

This element should not be used on specific page more than once, as its title contain <h1> tag, which should NOT be used on each page more than once.

  1. Caption - Caption text shown above banner title. Leave this field empty if you do not want to display that element.
  2. Title - Banner title placed in <h1> tag. HTML tags are allowed in that field.
  3. Subtitle - Banner subtitle, where content can be customized using text editor.

# Frontend

following options from the addon management will be shown in your website frontend, as shown below:

  1. Domain Type - Choose what type of domain field should be used in this section type.
    • Domain Search - Used field will link to the WHMCS domains search page.
    • Domain Transfer - Used field will link to the WHMCS domain transfer page.
    • Display both fields as tabs - Both fields will be shown, under separate tabs, as shown in below screenshot.
  1. Buttons - Add buttons using Button Manager modal. For example you can create link button, which will lead your customers to the page with TLD table showing pricing for all available TLDs in your WHMCS system.

# Frontend

Options from the above management section will be shown as below:

  1. Background Type - Choose background type from the dropdown list, this setting will also change the banner content layout, as cen be seen in below examples.
  2. Background Graphic - Choose background graphics which will be shown for the banner, learn more about "Media Manager"

# Type 1

This type has been designed to work with predefined "SVG Illustrations" (opens new window) provided in our package. Only default predefined illustrations will be animated as shown in our demo (opens new window).

# Type 2

Left aligned banner content, with graphic placed in predefined container (596px width and 480px height). Designed to work with custom uploaded graphics. It is suggested to upload graphic, with at least 596px width, as this is the container width, to which this graphic will be stretched.

For this banner type, we have prepared special custom classes, which can be assigned in advanced settings:

  1. img-shadow - adds shadow to the uploaded graphic, as can be seen in above example.
  2. lagom-animation lagom-animation-fadeinbottom - adds fade in animation to the graphics on page scroll, as can be seen in ourdemo page (opens new window).

# Type 3

Left aligned banner content, with graphic placed as full background. Designed to work with custom uploaded graphics.

Graphic will be always aligned to the right side of the screen, its suggested to upload graphics where left side of the background, will not interfere with the text.

# Type 4

Center aligned banner content, with graphic filling whole banner background. This banner type works with predefined SVG Backgrounds (opens new window), as well as with custom uploaded graphics as shown in below examples. Its suggested to upload graphic with at least 1920px width.

# Type 5

Center aligned banner content, with graphic filling whole banner background. This banner type has additional spacing at the bottom, it has been designed to work with our predefined SVG Backgrounds (opens new window), which has been prepared to fill the bottom banner space.

This banner type, has been used as homepage banner in our demo page (opens new window).

# Type 6

Center aligned banner content, without graphic. Can be used on informational pages, like "Legal", "News" etc.

# Section Advanced Setting

  1. Combine This Section With Section Below - When activated it will remove bottom padding and border from this section. This setting was 1. Combine This Section With Section Below - When activated it will remove bottom padding and border from this section. This setting was designed to combine two sections into single section - learn more.
  2. Overlay Section Below on This Section - This setting pull below section over this section, moreover it adds additional bottom padding. - learn more.
  3. Disable Background for "Predefined Lagom Illustration" - Option prepared for "Background Types" where Lagom shape is added to the background - learn more.
  4. Section Custom Class - This setting assign custom classes to the section container - learn more.