Top-sellers block (ps_bestsellers)

Description

This is the module to show top-selling products for the customers in homepage.

Top-sellers block User Interface

QA

Link to the tests

Common components

• Breadcrumbs navigation - Breadcrumb UI Kit.

• Heading of the page - Headings UI Kit.

• ​Save button - Buttons basics UI kit.

• E-commerce logo

• PrestaShop version number

• Quick access dropdown

• Search input

• Shop switcher with eye icon

• Bell icon (todo link)

• Account icon

• Configuration block

• Page header CTA buttons

Settings block

Products to display

Description	Value	Error message
Mandatory	NO	-
Allowed/Forbidden values	Numeric values	-
Default value	8	-
Help text	Determine the number of product to display in this block	-
Tool tips	-	-
Lower limit	-	-
Upper limit	-	-
Behavior	link to the behavior	-

Behavior descriptions

Products to display behavior

Forms Normal UI Kit component. This small input declares the number of products to display in the top-seller block.

Multistores functionality

Behavior

Save - Call to action

Top-sellers block User Interface

QA

Link to the test

Common components

• E-commerce logo.

• PrestaShop version number.

• Quick access dropdown.

• Search input - Forms input with dropdown UI kit.

• Shop switcher with eye icon.

• Bell icon (todo link)

• Account icon.

• Breadcrumbs navigation - Breadcrumb UI kit.

• Heading of the page - Headings UI kit.

• Page header call to action buttons (modules) - Buttons outline UI kit.

• Save button - Buttons basics UI kit.

• Configuration block.

The UI elements

Products to display input

Description	Value	Error message
Mandatory	No	-
Allowed/Forbidden values	When anything apart numbers is saved, resets the value to "0"	-
Default value	8	-
Help text	Determine the number of product to display in this block	-
Tool tips	-	-
Lower limit	-	-
Upper limit	-	-
Behavior	link to the behavior	-

Behaviors description

Title of Settings behavior

This title includes the title and settings icon.

Products to display input behavior

This is number input (Forms number UI kit) to enter number of products to display in front office.

Multistores functionality

Multistores dependent page.