In this tutorial, we will take you through how to add BookThatApp to the Launchpad theme. Before you start we recommend you take a backup of your current theme.
Note: Widgets are our newest type of booking form and provide a more modern look. Best of all, they are easier to implement because they do not require you to make coding changes in your theme. If you have not tried out a widget yet please see the following:
https://support.zetya.com/hc/en-us/articles/360000984495-Widgets
Step 1 - Choose Your Booking Form
- Login to BookThatApp
- In BTA Admin, select the Installation link from the left hand navigation menu
- Select the Booking forms tab to access the install steps
- Click on the Install button next to the form that you want installed. Clicking the Install button creates a booking-form snippet in your current theme. Please refer to our article how to choose the booking form if you need help with this step.
Step 2 - Add the booking form to the Shopify product page
- In Shopify Admin, open your current theme.
- Open the product.liquid file under the Templates area of your Theme Editor.
- Copy the following lines of code and paste it on or around line 108.
Note: the exact line for the coding placement will vary with different versions of the theme.
108. <div class="select clearfix">
109. {% render 'booking-form' %}
110. </div>
- Select Save
Step 3 - Updating the Cart Page
- Continue with Step 3 of the instructions found in the app admin install steps. We recommend disabling the quantity on the cart page as detailed in the instructions from Step 3 of the install steps. Continue with the instructions in the BTA Admin Install page. The quantity code is on or around line 47 of the cart.liquid file in the Sections area of the Theme Editor.
- You will also need to add code in order to display the line item properties (booking details) in the cart. Please see the following article from Shopify for details on how to achieve this.
https://avada.io/shopify/devdocs/display-line-item-properties-in-the-cart.html
Please note that you can add CSS to your booking form, but it is not recommended for this theme since formatting is inherited from the select & clearfix classes.
The app should now be successfully installed in the Launchpad theme. If you have any questions or the booking form is not appearing, please create a ticket and we'll be happy to help.
Comments
0 comments
Please sign in to leave a comment.