Store Landing Page
After enabling the Shopping Cart, you can build a fully customized storefront landing page using ERPNext’s Web Page Builder. Instead of using the default homepage, you can design an attractive shopping experience with banners, featured products, and product categories that guide customers to your online store.
Overview
- Create a dedicated landing page for your online store.
- Design pages visually using the Page Builder.
- Add reusable Web Templates such as Hero Sliders and Product Cards.
- Highlight featured products and product categories.
- Publish the page and optionally make it your website homepage.
- Shopping Cart must be enabled.
- Website Items should already be published.
- Product categories (Item Groups) should be configured.
How to Create a Store Landing Page
Step 1: Create a New Web Page
Create a new Web Page for your online store.
- Open Web Page.
- Click New.
- Enter a page title.
- Specify a unique Route, such as /store.
- Set the Content Type to Page Builder.
- Save the document.
Choose a short, memorable route like /store, /shop, or /products so customers can easily access your storefront.
Step 2: Build the Page Layout
Once the page is created, begin designing it using Page Builder.
- Navigate to the Page Building Blocks section.
- Click Add Row.
- Select a suitable Web Template.
- Repeat the process until the desired layout is complete.
ERPNext includes several built-in templates specifically designed for e-commerce websites.
Available Web Templates
Hero Slider
The Hero Slider creates a visually engaging banner section at the top of your store.
You can configure up to 5 slides.
Each slide can include:
- Banner image
- Heading
- Call-to-action button
- Button destination
- Text alignment
- Theme or styling
Use the Hero Slider to promote seasonal offers, featured collections, new arrivals, or limited-time discounts.
Product Category Cards
Product Category Cards help customers browse products by category instead of searching manually.
You can configure up to 8 categories.
Each card links directly to an Item Group.
Ensure the Show in Website option is enabled for every Item Group you want to display. Otherwise, ERPNext will not generate a website page for that category.
Item Card Group
Item Card Groups showcase selected products directly on the landing page.
You can display up to 12 featured products.
Each card links directly to an Item’s product page.
If the Featured option is enabled, the selected item occupies additional space, making it more prominent on the page.
Highlight your best-selling, newly launched, or high-margin products using Featured Item Cards to increase visibility and conversions.
Configure Template Content
Each Web Template contains configurable fields that determine what visitors see on the page.
- Select a template.
- Click Edit Values.
- Enter the required content.
- Save the configuration.
Depending on the template, you can configure images, titles, descriptions, buttons, products, categories, colors, and other display options.
Publish the Landing Page
After completing the page design:
- Open the Web Page.
- Enable the Published checkbox.
- Save the document.
The page becomes publicly accessible once it is published.
After publishing, you can use the See on Website option or open the configured route (for example, /store) in your browser to preview the landing page.
Set the Store as Your Homepage
If you want visitors to land directly on your storefront instead of the default homepage:
- Open Website Settings.
- Locate the Homepage configuration.
- Select the newly created Web Page.
- Save the changes.
Your custom landing page will now serve as the default homepage for your ERPNext website.
Recommended Landing Page Structure
- Hero Slider for promotions or featured campaigns.
- Product Category Cards for easier browsing.
- Featured Item Cards showcasing popular products.
- Additional promotional or informational sections as needed.
ERPNext’s Web Page Builder makes it easy to create a professional online storefront without coding. By combining reusable Web Templates such as Hero Sliders, Product Category Cards, and Featured Item Cards, you can build an engaging shopping experience that highlights your products and improves customer navigation.
