Skip to main content

Homepage Configuration

The Homepage is the default landing page visitors see when they access your ERPNext website. It serves as the main entry point to your website and can be customized with banners, slideshows, featured products, promotional sections, and fully custom layouts to create an engaging user experience.

Overview

Summary

  • Configure the default homepage for your website.
  • Customize the Hero Section using text, slideshows, or custom HTML.
  • Display featured products on the homepage.
  • Add reusable homepage sections with cards or custom HTML.
  • Replace the default homepage with a completely custom Web Page if required.
Navigation

Go to Home → Website → Portal → Homepage.

Prerequisites

Important

Ensure the Home Page value in Website Settings is set to home. Otherwise, the default Homepage configuration will not be used.

1. Configure the Homepage

The Homepage document contains the primary settings that define your website’s landing page.

Steps

  1. Select the Company.
  2. Enter the Title that appears in the browser tab.
  3. Configure the desired Hero Section.
  4. Save the document.

Once configured, visitors accessing your website will see the homepage according to the selected settings.

2. Hero Section

The Hero Section is the prominent banner displayed at the top of your homepage. ERPNext provides three different methods to customize it.

  • Tag Line and Description
  • Homepage Slideshow
  • Custom Hero Section

2.1 Tag Line and Description

This is the default homepage layout and is ideal for businesses that want a clean and simple landing page.

You can configure:

  • Tag Line
  • Description
  • Hero Image
  • Explore Button URL

The URL for “All Products” determines where visitors are redirected after clicking the Explore button.

Best Practice

Use a concise headline, a compelling description, and a high-quality hero image to immediately communicate your brand value to visitors.

2.2 Homepage Slideshow

If you want rotating promotional banners, configure the Hero Section to use a slideshow.

Steps

  1. Set Hero Section Based On to Slideshow.
  2. Select an existing slideshow or create a new one.
  3. Save the Homepage.

The selected slideshow will automatically appear at the top of the homepage.

Tip

For the best visual appearance, ensure all slideshow images have the same height and maintain a width greater than their height.

2.3 Custom Hero Section

For complete design flexibility, you can build your own Hero Section using custom HTML.

Steps

  1. Set Hero Section Based On to Hero Section.
  2. Create a new Hero Section.
  3. Select Section Based On → Custom HTML.
  4. Enter your HTML markup.
  5. Save the configuration.

ERPNext supports valid Bootstrap 4 HTML, allowing you to create highly customized landing page designs.

Note

This option is recommended for organizations that require unique layouts beyond the standard homepage templates.

3. Featured Products

You can highlight selected products directly on the homepage using the Products table.

Steps

  1. Open the Homepage document.
  2. Navigate to the Products section.
  3. Add the Website Items you want to feature.
  4. Save the document.

Featured products are displayed prominently on the homepage, making them easier for customers to discover.

Recommendation

Showcase your best-selling products, seasonal collections, or newly launched items to increase visibility and encourage purchases.

4. Homepage Sections

Homepage Sections allow you to extend the homepage with additional content blocks.

Navigate to Website → Portal → Homepage Section to create reusable homepage sections.

Section Types

  • Cards
  • Custom HTML

Card-Based Sections

When Section Based On is set to Cards, you can create informational or promotional card layouts.

Each card may include:

  • Title
  • Subtitle
  • Image
  • Description
  • Navigation Route

Section Order

The Section Order field controls the display sequence.

  • 0 appears first.
  • 1 appears after 0.
  • 2 appears after 1.
  • Higher values appear later.
Tip

Use Homepage Sections to highlight company services, customer testimonials, featured categories, promotional campaigns, or business achievements.

5. Creating a Completely Custom Homepage

If the standard Homepage configuration does not meet your requirements, ERPNext allows you to replace it entirely with a custom Web Page.

Steps

  1. Create a new Web Page.
  2. Design it using the Page Builder or custom HTML.
  3. Open Website Settings.
  4. Set the Home Page field to the route of the new Web Page.
  5. Save the changes.

The custom Web Page will now become the default homepage for your website.

When to Use a Custom Homepage

  • Marketing-focused landing pages
  • Corporate websites
  • E-commerce storefronts
  • Campaign-specific landing pages
  • Custom branded website designs

Best Practices

  • Use a strong Hero Section with clear messaging.
  • Display featured products that align with current promotions.
  • Maintain consistent branding throughout the homepage.
  • Use Homepage Sections to organize additional information logically.
  • Consider a custom Web Page if extensive design flexibility is required.
Key Takeaway

ERPNext’s Homepage feature provides multiple ways to create an engaging landing page. Whether you choose a simple hero banner, an interactive slideshow, reusable homepage sections, or a completely custom Web Page, you can tailor the visitor experience to effectively showcase your brand, products, and services.

Rating: 0 / 5 (0 votes)

© 2026 | goERPNext | All rights reserved