Help Button

Call-to-action button, which initiates a sidebar UI from the right side of the almost every page. The sidebar contains detailed text about the functionality in the middle part of the page. Once the CTA button is hovered, there is an alt text "Help" alternatively repeated.

Help Button CTA User Interface

Extended Help sidebar

After the Help sidebar is extended to the left side of the UI, there are particular components available. Down below the navigation components, there is the topic content shown.

Help Sidebar User Interface header

• Menu list icon - shows all the available topics for helping the users to learn and navigate through the Prestashop application.

• Arrow left icon - collapses the menu list back.

• Home icon - navigates to the homepage.

• Top-right arrow sided icon - closes the sidebar and opens external popup with the Help content topics.

• Search magnifying glass CTA - button executes the search query and afterwards the sidebar UI shows the searched content.

Search input

Description	Value	Error message
Mandatory	NO	-
Allowed/Forbidden values	-
Default value	Empty field with the placeholder "Search..."	-
Help text	-	-
Tool tips	-	-
Lower limit	-	-
Upper limit	-	-
Behavior	link to the behavior	-

Behavior descriptions

Search input behavior

Component from Forms Normal UI Kit. The field allows searching for the desired results in the Help content. The search results are displayed in the row blocks, containing the document icon, the headline, and the excerpt text from the targeted topics.

Extended Help Sidebar User Interface