integration_documentation:instant_frontend:shopping_guide
Differences
This shows you the differences between two versions of the page.
| Next revision | Previous revision | ||
|
integration_documentation:instant_frontend:shopping_guide [2023/03/08 14:39] rihad created |
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> | ||
| ---- | ---- | ||
| - | ==== Product ==== | + | ==== Settings ==== |
| - | {{:account21:plp_product.png?1200|}} | + | {{:account21:sg_settings.png?400|}} |
| - | * **Show product code (SKU)**: The product code is whichever ordernumber was exported first. If no ordernumber was exported, the ID is used in case of CSV export, and nothing is available in case of XML export | + | * **Name**: Give the Shopping Guide a proper Name |
| - | * **Show summary**: Show the summary of the product in the product box. | + | * **Title**: Specify the Title of the Shopping Guide. This will be displayed in the Shops Frontend. |
| - | * **Brand display**: Choose where the brand is displayed in the product cart. | + | * **Subtitle**: Add a Subtitle. This will be displayed in the Shops Frontend. |
| - | * **Image Orientation**: Adjust the orientation the product image. | + | * **Category**: Specify on which Category the Shopping Guide should be triggered |
| - | * **URL of product thumbnail image**: Specify the URL to your product thumbnail. | + | * **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. |
| - | * **Show cart button**: Define the text and enable the icon of the Add to Cart Button. | + | |
| - | * **Enable quick view**: Clicking on the product card will open the an overlay with some product information, Details and the add-to-cart button. | + | |
| - | * **Image gallery**: Define multiple product images and configure how they should be displayed. | + | |
| - | <note important>Only information provided within the datafeed can be shown. If you notice discrepancies please check your datafeed or [[mailto:support@findologic.com|contact our support team]].</note> | + | ---- |
| + | ==== Questions ==== | ||
| - | ==== Price ==== | + | {{:account21:sg_questions.png?400|}} |
| - | {{:account21:plp_price.png|1200}} | + | * Here we have different types of questions |
| + | * All of the questions that should be considered within the Shopping Guide can be added here | ||
| - | * **Show product price**: Show/ hide the product price. | + | === Add Questions === |
| - | * **Show decimals**: Toggles the use of decimals. If deactivated the price will be rounded. | + | |
| - | * **Property containing old price**: Define if you want to show an instead price of the product (If available in the Export). | + | |
| - | ==== Badges ==== | + | {{:account21:sg_questions_add.png?400|}} {{:account21:sg_questions_config.png?400|}} |
| - | {{:account21:plp_badges.png|1200}} | + | - Select an Attribute from the Dropdown |
| + | - Edit the question and set the configurations for the question | ||
| + | * 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 | ||
| - | * **Property**: Specify the name of the property that should be used as indicator for a certain badge. | + | === Add Answers === |
| - | * **Text**: Specify the text for your badge. | + | |
| - | * **Background color**: Specify the background color of your badge. | + | |
| - | <note tip>You can configure multiple badges here.</note> | + | {{:account21:sg_answer_add.png?400|}} {{:account21:sg_answer_edit.png?400|}} |
| - | ==== CI ==== | + | - 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 | ||
| - | {{:account21:plp_ci.png?1200|}} | + | === Add branching questions (optional) === |
| - | * **Filter Position**: Define where the filters should be displayed in the Product List Page (desktop only). | + | {{:account21:sg_bq_config.png?400|}} {{:account21:sg_bq_answer.png?400|}} {{:account21:sg_bq_answer_edit.png?400|}} |
| - | * **Colors**: Set the primary and secondary color for your Product List Page. | + | |
| - | * **Typography**: Select a base font size for Instant Frontend. | + | * Branching questions can help to guide a User in a certain direction with a different flow of questions |
| - | * **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. | + | 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> | ||