Customize your Pepperi B2B eCommerce Home Screen to include your own branding, images, links, or any data from Pepperi. Give your buyer a familiar B2C-like experience, with all the information they need on the home screen at their fingertips. Highlight promotions, product categories, and include financial information and shortcuts to history, and contact forms.

Create a different home screen for small buyers, chain stores, or any other profile which is using your Pepperi B2B eCommerce site.

Display Pepperi data such as customer details, recent orders, invoices, promotions, and more using the Pepperi Client API calls in the Javascript. See Client API documentation at https://apidocs.pepperi.com

You must first load the HTML for the Main Bar layout. The Main Bar is the header area at the top of each page on the Storefront. To load this file see: Main Bar (Header) Customization with HTML.

If you are using the Page Builder to created the home screen body, do not load a second file for the Home Screen. You must create a page and publish it using the Page Builder and Slugs.

Follow these instructions: Guide to configuring a homepage in Page Builder

Once you have loaded the Main Bar HTML file and created your Home screen Javascript file, go to Settings -> Configuration Files and click + Add

File Type: Select WebApp Customization

Name/Description: Provide a name and description

Upload your HTML template for the header and Save

Next, assign the files to be used on the Storefront

Go to Settings -> Branded App -> WebApp Main Bar

Edit the relevant profile and add the Home screen configuration file UNDERNEATH the Main Bar configuration file (which must be loaded first).

Pepperi will load the first file as the Main Bar (header area) and the second file as the full Home Screen page (as illustrated in the screen above).

You can load multiple configuration files for the Home screen and then use a different one for various profiles, such as Buyer, Manager, Office Staff etc… (any profiles which you have created in Pepperi). Just add the profile to the WebApp Main Bar configuration and select the relevant configuration file.