Thank You page
Within the Shopify Admin, go to Settings > Checkout and you will see a card titled Configurations. Click on the Edit button to enter the checkout editor:
Shopify checkout customization
The Grapevine Surveys app block can be added to both the Thank You page (the initial post-purchase page after checkout) and the Order Status page (the page used to display the order summary at any point after the initial purchase).
You will need to add the Grapevine Surveys app block for each post-purchase page separately, however, the steps you need to take are almost identical for each.
You will see the option to customize the Thank you page or Order status page by clicking on the dropdown in the top bar of the checkout editor:
Let's go ahead and customize the Thank you page first.
Within the checkout editor, click on the dropdown selector at the top of the page and select the Thank you page.
Once the page loads, take a look at the left-hand panel of the checkout editor, locate the Main section and select the + Add block link at the bottom of that section:
Scroll or use the search box and Grapevine Surveys will then appear as an available app block to be selected.
Click on the Survey Form app block and the checkout editor preview panel will update to show your post-purchase survey on your Thank you page:
You can reposition the block on the page by either dragging up and down on the left menu or using the handles beneath the actual block.
Hit the Save button in the top right of the checkout editor.
Don't skip this next step:
Repeat the previous steps to add the app block to your Order Status page too. Some customers close the Thank You page after checkout before they get a chance to respond, so adding the survey here gives them another opportunity and can improve your response rate.
This will not duplicate your survey. It only appears on the Order Status page if the customer hasn't already answered via the Thank You page.
Order Status page
Within the checkout editor, click on the dropdown selector at the top of the page and select the Order status page.
Locate the Main section on the left-hand panel of the editor, then click the + Add block option at the bottom:
Scroll or use the search box to find and select the Grapevine Surveys app block:
Click on the Survey Form app block and the checkout editor preview panel will update to show your post-purchase survey on your Order status page:
Shopify have recently change the display of the Order Status Page to a one column view, so decide on where you would like to display the Survey. We recommend at the top above the order details for visibility.
Hit the Save button in the top right of the checkout editor once you are happy with the layout..
Please note:
We would recommend that you do not place your survey app block within the Order summary section as this section may be hidden on mobile devices.
Display rules
Once you've added the Grapevine Surveys app block to your checkout pages, head back to the Grapevine app to configure which surveys are shown and to whom
If you've already configured Display Rules (such as order value, customer type, products within the order, or payment method used at checkout) then you will also see a drop down in the Survey Form preview within the Checkout Editor. This allows you to switch between all live Checkout app block surveys that could potentially be displayed so that you can see how they will look:
To manage your Display rules:
Manage survey visibility — enable the Checkout app block channel on your surveys
Display Rules for checkout surveys — target surveys by customer type, order value, or products in the cart
Displaying more than one survey — configure how multiple surveys are prioritised
Need any help?
If you have any questions about the checkout app block to your post-purchase pages or any other Grapevine Surveys related question, then please do just get in touch.