integration_documentation:instant_frontend:shopping_guide
Differences
This shows you the differences between two versions of the page.
| Both sides previous revision Previous revision Next revision | Previous revision | ||
|
integration_documentation:instant_frontend:shopping_guide [2023/03/08 14:40] rihad |
integration_documentation:instant_frontend:shopping_guide [2023/03/13 12:46] (current) rihad |
||
|---|---|---|---|
| Line 16: | Line 16: | ||
| * append: The Product List Page container will be appended within the set container (selector). | * append: The Product List Page container will be appended within the set container (selector). | ||
| * prepend: The Product List Page container will be prepended within the set container (selector). | * prepend: The Product List Page container will be prepended within the set container (selector). | ||
| + | |||
| + | * **Color**: The following depiction shows how the colours will apply to the Shopping Guide. | ||
| + | |||
| + | {{:account21:colors.png?1200|}} | ||
| + | |||
| + | <note important>Please be aware that those Settings are globally applied to all Shopping Guides.</note> | ||
| ---- | ---- | ||
| Line 21: | Line 27: | ||
| ==== Settings ==== | ==== Settings ==== | ||
| + | {{:account21:sg_settings.png?400|}} | ||
| + | * **Name**: Give the Shopping Guide a proper Name | ||
| + | * **Title**: Specify the Title of the Shopping Guide. This will be displayed in the Shops Frontend. | ||
| + | * **Subtitle**: Add a Subtitle. This will be displayed in the Shops Frontend. | ||
| + | * **Category**: Specify on which Category the Shopping Guide should be triggered | ||
| + | * **Default flow**: Select the default flow that should be used for the Shopping Guide. According to the flow chosen you can specify the order of the Questions. | ||
| + | ---- | ||
| ==== Questions ==== | ==== Questions ==== | ||
| - | {{:account21:plp_price.png|1200}} | + | {{:account21:sg_questions.png?400|}} |
| - | * **Show product price**: Show/ hide the product price. | + | * Here we have different types of questions |
| - | * **Show decimals**: Toggles the use of decimals. If deactivated the price will be rounded. | + | * All of the questions that should be considered within the Shopping Guide can be added here |
| - | * **Property containing old price**: Define if you want to show an instead price of the product (If available in the Export). | + | |
| - | ==== Flows ==== | + | === Add Questions === |
| - | {{:account21:plp_badges.png|1200}} | + | {{:account21:sg_questions_add.png?400|}} {{:account21:sg_questions_config.png?400|}} |
| - | * **Property**: Specify the name of the property that should be used as indicator for a certain badge. | + | - Select an Attribute from the Dropdown |
| - | * **Text**: Specify the text for your badge. | + | - Edit the question and set the configurations for the question |
| - | * **Background color**: Specify the background color of your badge. | + | * Define a different Display Name |
| + | * Change the used Attribute for the question | ||
| + | * Unordered List ItemSelect how the filters/answers should be displayed in the flow | ||
| + | * Set the order that should applicable | ||
| + | * Define the question | ||
| + | * If needed add a Icon for the Header with an Image URL | ||
| + | * Define if multiple options can be used | ||
| + | * Define if the Question is required | ||
| - | <note tip>You can configure multiple badges here.</note> | + | === Add Answers === |
| - | ==== CI ==== | + | {{:account21:sg_answer_add.png?400|}} {{:account21:sg_answer_edit.png?400|}} |
| - | {{:account21:plp_ci.png?1200|}} | + | - From the dropdown you can specify the filter values that should be shown for the question |
| + | - Every answer can be edited with the following options: | ||
| + | * Display Name | ||
| + | * Set an Image URL if needed | ||
| - | * **Filter Position**: Define where the filters should be displayed in the Product List Page (desktop only). | + | === Add branching questions (optional) === |
| - | * **Colors**: Set the primary and secondary color for your Product List Page. | + | |
| - | * **Typography**: Select a base font size for Instant Frontend. | + | {{:account21:sg_bq_config.png?400|}} {{:account21:sg_bq_answer.png?400|}} {{:account21:sg_bq_answer_edit.png?400|}} |
| - | * **Grid Layout**: Choose how many products should be displayed depending on the screen size. | + | |
| - | * **Products per page**: Define how many products should be displayed per page. | + | * Branching questions can help to guide a User in a certain direction with a different flow of questions |
| + | |||
| + | 1. Configure the branching question | ||
| + | * Set a display name | ||
| + | * Add a question/headline | ||
| + | * Choose the displaying option that should be applied | ||
| + | * Add a Header Icon if needed | ||
| + | |||
| + | 2. Move to answers | ||
| + | * Add/Edit an answer | ||
| + | * Set display name | ||
| + | * Add image Url for the attribute value | ||
| + | * Select which flow should be triggered after answering the question | ||
| ---- | ---- | ||
| + | ==== Flows ==== | ||
| + | |||
| + | {{:account21:sg_flows.png?400|}} {{:account21:sg_flows_edit.png?400|}} | ||
| + | |||
| + | If a branching question is used you can specify within this section the flow that should be applied for the following questions. By default there is already one flow specified. | ||
| - | <note>If you are using Shopware 6 and want to use the add-to-cart button you have to change the CSRF mode to "ajax". To change the CSRF mode in a Shopware 6 shop, change the property storefront.csrf.mode to "ajax" in vendor/shopware/storefront/Resources/config/packages/storefront.yaml and clear the cache.</note> | + | * Edit the flow |
| + | * Add the display name within the Account | ||
| + | * Add a question from the dropdown = all available questions for this Shopping Guide | ||
| + | * Change the order of the questions via Drag’n’Drop | ||
| - | <note important>Note that any CSS-based customization may cause problems as deployment for PLP may take place at any time. If you plan to do this, please check with your integration consultant or support.</note> | ||