Add Checkout Options to the Checkout Page

In this article, we’ll do a step by step walk through of how to add your Checkout Options sets to the Shopify checkout page.

Please note: Currently, only merchants on Shopify Plus have access to the following checkout customizations. You must also be on Giftship’s Standard plan or above in order to use checkout options.

Step 1: Select a Checkout to Customize

In the Shopify Admin, click on the Settings button at the bottom left corner of the page and select the Checkout tab.

Here, you should see a section labelled “Customize you checkout,” which shows a list of live and draft state checkouts that have been created for your online store.

We recommend setting up the Checkout Options on a draft checkout initially to test for proper functionality before going live. A good option is to “Duplicate” your current live checkout.

Click the “Customize” button and you will be brought to the checkout page within the Shopify theme editor.

Step 2: Add Giftship’s Checkout Options App Block

Choose “Add app block” at the bottom of the screen and select the Giftship Checkout Options app block.

Click on the back button beside the Checkout Options title and you should see that the app block has been added to the “Order summary” section above the Discounts form.

Step 3: Relocate the Checkout Options App Block

In the Giftship Checkout Options builder, there are 3 locations you can select for an option set to display:

Above discount form
Below contact form
Below delivery address form

If you selected a location other than “Above discount form” when building the option set, you can drag the added block up to the contact or delivery sections of the checkout editor.

Or, if you have created multiple option sets that display in different locations, you can add additional “Checkout Options” blocks and drag them to the desired location.

With the Giftship Checkout Options app block added to the correct location(s), you should see your upsells, gift messages, etc. loading into the checkout preview. You can also open a full page preview of your checkout using the buttons at the top left of the theme editor.

For more information on creating your Checkout Option sets from within the Giftship dashboard, please see the following article: