SAKU Gift Option: How to set up the app

Thank you for installing SAKU Gift Option. This app adds a gift wrapping choice to your product pages (or to the whole order), and lets customers pick extra details such as a ribbon color or a gift message.

This article follows the "Setup guide" on the app's Home page and walks you through every step until customers see the "Gift options" block in your store. If you follow it in order, you can set everything up even if it is your first time.

Where to go: Shopify admin → Apps → SAKU Gift Option (Home) → "Gift Option Settings"

Note: the app's admin pages are available in Japanese and English. If your Shopify admin language is Japanese, the app is shown in Japanese; in any other language, it is shown in English. This article uses the English labels.

The step numbers in this article (1️⃣–9️⃣) are not the same as "Steps 1–4" on the app's Home page. The Home page steps are written as "Home step 1" and so on.

Note: the "theme editor" is where you edit your store's design. A "block" is a building block you place on a page. If the button that opens the theme editor doesn't work, go to "Online Store" → "Themes" in your Shopify admin and click "Customize" on your current theme.

The big picture

First, here is how the setup connects to what your customers see.

1. You create a "Gift wrapping" product in Shopify. The gift that customers choose is registered as a Shopify product.
2. In the app's "Gift Option Settings", you select that product, set the display name, price and extra fields (ribbon color, message), set the status to "Active" and save.
3. You set the scope to "Per product".
4. In the theme editor, you place the "SAKU Gift (Product page)" block on your product page.
5. Customers choose the gift option on the product page. At checkout and in the order, the product name of the registered product is shown.

To build this, you will set things up in the following steps.

1. Check the "Setup guide" on the Home page (1️⃣)
2. Create the gift option product in Shopify (2️⃣)
3. Open "Gift Option Settings" (3️⃣)
4. Select the product and enter its display name and price (4️⃣)
5. Set up additional info such as ribbon color and gift message (5️⃣)
6. Choose the scope (6️⃣)
7. Set the status to "Active" and save (7️⃣)
8. Place the block on your product page in the theme editor (8️⃣)
9. Check "Setup complete" on the Home page (9️⃣)

What you need before you start

• SAKU Gift Option, already installed
• Permission to create products in your Shopify admin
• A paid plan is required on live stores (development stores are free and can try every feature). For details, see "How to check and change your plan".

1️⃣ Check the "Setup guide" on the Home page

When you open the app, the "Setup guide" appears on the Home page. Work through it from top to bottom, using the button in each step.

• On a development store, a "Development store (free)" banner appears at the top. On development stores, you can try every feature for free.
• The guide steps are "1. Create a wrapping product", "2. Configure gift options" and "3. Add the block to your product page". The badge at the top right of each step shows your progress (for example, incomplete or "Configured").
• Depending on your settings, for example when you choose "Use product information", a fourth step, "Enable the app embed", is added (see "How to choose where the display name and price come from").
• On the right are "About this app", "Plan" and "Support". Click "Help and instructions" under Support to open the in-app Help (frequently asked questions).
• The left menu has three items: "Gift Option Settings", "Help" and "Pricing". Click the app name ("SAKU Gift Option") to go back to Home.

The app may run some setup automatically when the page opens. You don't need to do anything.

If you see "Cart Transform is not configured. Please run the initial setup to enable app features." at the top of the page (this means the initial setup that applies gift prices correctly hasn't finished yet), click "Run Initial Setup" once. When "Initial setup is complete." appears in green, you're done.

2️⃣ Create the gift option product

The "Gift wrapping" that customers choose is set up as a Shopify product.

① Open the product creation page.
Click "Create a product" in Home step 1. The product creation page opens in a new tab.

② Fill it in as follows.

• "Title": a name that's fine for customers to see (for example, "Gift wrapping"). This product name is shown as the gift's name at checkout and in orders.
• "Media": add an image only if you want a thumbnail to appear with the gift option. The first image is used. If you don't need a thumbnail, leave it empty.
• "Price": used only when you choose the "Use product information" method. With the "Set in the app" method (the default), the amount you enter later in the app is used instead.
• "Inventory": turn off inventory tracking so that it shows "Inventory not tracked". If inventory is tracked and the product is out of stock, the option is not added to the cart even when a customer selects it.

Required: when you register the gift option product

• Always turn off inventory tracking. If inventory is tracked, customers can no longer add the gift option once stock reaches 0, even when they select it.
• Keep the gift option product from appearing as a regular product in your store. If it shows on collection pages or product lists, customers can add the gift product to the cart on its own, as an ordinary product. Leave the product's "Collections" field empty, and if you use automated collections, make sure this product doesn't match their conditions.
• Don't set the product to "Draft" or unpublish it. It must stay published to the Online Store (and the markets you sell in) so it can be added to the cart as a gift option.

Note: to also keep it out of your store's search results, set the product metafield "seo.hidden" to "1" (in Settings → Custom data → Products, create a definition with the namespace and key "seo.hidden" and the type "Integer", then set the value to "1" on the gift option product). It will no longer appear in your store's search or in search engine results. It may still appear in lists that aren't tied to a specific collection, such as your theme's "All products" page (/collections/all).

③ Click "Save" on the product page.
When the product is saved, this step is done.

3️⃣ Complete Home step 1 and open Gift Option Settings

① Go back to the app's Home page and tick the checkbox in Home step 1 to mark it complete.
The badge changes to "Complete" (if you save Gift Option Settings first, Home step 1 is marked complete automatically, so you don't need to tick it).

② Click "Open gift option settings" on the right of Home step 2.
The "Gift Option Settings" page opens. You can also open it from "Gift Option Settings" in the left menu.

At the top of this page is a notice, "See the setup guide with images". Click "Open the setup guide" to go to illustrated instructions like this article.

The red boxes show "Gift Option Settings" in the left menu, "Display name and price source" and the "Gift options" card. "Status Settings" on the right is used in 7️⃣.

Note: changes on this page are not applied until you click "Save" in the save bar that appears at the top of the screen. When saving succeeds, "Saved." appears.

4️⃣ Select the gift option product and enter its display name and price

Everything you enter from here through 7️⃣ is saved together in 7️⃣. You can also save along the way.

① Choose "Display name and price source".
At the top of the page, you can choose "Set in the app" (the default) or "Use product information". If you're just getting started, keep the default, "Set in the app". With the default, the amount you enter here is added as the gift price (not the price of the product you created). If you need to handle customers paying in other currencies, or want to manage rounding and market-specific prices, see "How to choose where the display name and price come from".

② In "Gift option 1" of the "Gift options" card, click "Select Product" and choose the product you just created.
"Heading" is the name customers see on the product page. You can leave it blank (when it's blank, only the dropdown is shown, without a heading). If the product has more than one variant, choose one variant next. You can select only "one variant of one product". If you haven't created a product yet, click "Create a gift option product" in the same section to open the product creation page in a new tab. To swap the product later, click "Change Product".

③ Check "Gift Option Display Name" and "Gift Option Price", and change them if needed.
When the product image and the input fields for the display name and price appear below the selected product, this step is done.

• The first time you select a product, "Gift Option Display Name" is filled in with the product name and "Gift Option Price" with the variant's price. You can change them to anything you like afterward.
• The label reads "Gift Option Price (currency code)", with your store's base currency code in the parentheses (for example, JPY or USD). Only numbers of 0 or more can be entered (decimals up to the number of places the currency allows).
• If you select a different product, the display name and price you already entered are kept. Clicking the red "Delete" removes the product together with its display name and price.
• Below the selected product, a "Product:" field appears. Click the product name to open the product in your admin.
• [Basic plan] Tick "Show thumbnail" to show the product image to the left of the gift option heading. Choose its size under "Thumbnail size": "Small", "Medium" or "Large" (the default is "Medium"). Square images work best.
• [Pro plan] Use "Thumbnail image" at the top of the "Gift options" card: click "Choose image" and pick an image from "Files", or upload one (the first time, approve access to files). This image does not change when customers choose a gift option.

To change the thumbnail image (Basic plan): the image saved is the one the product had when you selected it (the product's first image). If you change the image on the product, click "Change Product", select the same product again, and save. You don't need to delete the product and set it up again.

Note: the name shown at checkout and in orders: at checkout and in the order's line items, the gift is shown with the product name of the product you selected, not the display name you enter here (if the product has variants, the variant name is shown too). Set the product name to the name you want customers to see at checkout. To change it, open the product under Products in Shopify admin, change its "Title" or variant names, and save. For details, see "How to choose where the display name and price come from".

On the Pro plan, click "Add gift option (Pro plan)" to add a second, third and more gift options. For details, see How to set up multiple gift options on the Pro plan.

5️⃣ Set up additional info (ribbon color, gift message and more)

You can add a ribbon color choice, a gift message box, and so on. If you don't need extra info, you can skip this step.

① Click "Add Field" under "Additional Info Settings" inside the gift option.
The Add Field dialog opens. Additional info belongs to each gift option, and appears right below it only when the customer chooses that gift option.

② Fill in the field.

• "Field Name": the heading customers see (required).
• "Field Type": choose "Dropdown" (a list to choose from) or "Text Field" (free text).
• For a dropdown, enter the choices in "Options (comma separated)", for example "Red, Blue, Gold". They appear in your store in the order you enter them.
• For a text field, enter a "Max Length" from 1 to 500 (the default is 100).

③ Click "Save" in the dialog (or "Cancel" to stop).
When the field appears in the list, you're done. You can "Edit" or "Delete" the fields you create.

The red boxes show the list of fields in Additional Info Settings and "Add Field".

When you have two or more fields, drag the "⠿" handle at the left of a field to change the order. Fields appear in your store in the same order.

For details and input rules, see "How to set up extra fields such as ribbon color and gift message".

6️⃣ Choose the scope

① Open the "Application Scope" section.
This is where you choose what the gift option applies to.

② Choose "Per product".
This article uses the default, "Per product". When you choose it, a notice box with "Add block to product page" appears below.

• "Per product" (default): shows the block on product pages, and customers choose a gift for each product.
• "Entire order": shows the block on the cart page, and customers choose one gift for the whole order. For setup, see "How to set a gift option for the entire order".

Only the block for the selected scope appears in your store. The other block is not shown, even if it is still in your theme.

7️⃣ Check the preview, set the status to "Active" and save

① Look at the "Preview" on the right side of the page.
The "Preview" gives you a quick look at how the block will appear in your store. It shows the display name and price you set (for example, "Gift wrapping (+5.00USD)") and the extra fields that appear when the gift is chosen. Before you select a product, it says "No active gift option. Select a product to see the preview."

② Under "Status" in "Status Settings", choose "Active".
The default is "Draft", and nothing appears in your store while it's a draft. When the "Current status:" badge turns green and shows "Active", you're done.

③ Click "Save" in the save bar at the top of the screen.
Check that "Saved." appears.

Note: when you save, your settings are stored in the app's own storage. They aren't shown elsewhere in your admin, and that's normal.

8️⃣ Add the block to your product page in the theme editor

① Click "Add block to product page" in the notice box under "Application Scope". ("Add block to theme" in Home step 3 does the same.)
The theme editor opens in a new tab with the "SAKU Gift (Product page)" block already added to your product page.

② If it isn't added automatically, add the block yourself.
Select the product information section on the left side of the theme editor (the name depends on your theme), click "Add block" (or "Add app block"), open the Apps tab, and choose "SAKU Gift (Product page)".

The red boxes show "Add block" and "SAKU Gift" in the Apps tab. This image was taken on the cart page. The screen is the same on the product page, where you choose "SAKU Gift (Product page)".

③ Choose its position and heading.

• You can drag the block to any position. Just above the buy buttons works well.
• When you select the block, you can change its "Title" under "Block settings" on the right (the default is "Gift options").

④ Click "Save" at the top right of the theme editor.
Nothing changes in your store until you save. Then open a product page in your store. When the "Gift options" heading appears, you're done.

Note: if the status is still "Draft", or the scope is set to "Entire order", nothing is shown even after you add the block.

9️⃣ Check "Setup complete" on the Home page

When you go back to the app's Home page, the step badges change to "Configured". For Home step 3, the app checks whether the block is enabled in your theme (while it checks, the step shows that it's checking, and if it can't confirm, the step shows that it's unverified).

Home step 2 becomes "Configured" when the status is "Active" and a gift option product is selected (it has a display name or product name). While the status is "Draft", it stays unconfigured.

When all steps are done, the guide is replaced by "Setup complete". To change your gift option, click "Go to gift option settings" to open the settings page.

How it looks in your store

Customers choose the gift option on the product page. On product pages, the "Gift options" heading is shown, closed at first. If you turned on the thumbnail, the image appears to the left of the heading.

When the heading is opened, a dropdown menu appears. The default is "No thanks".

When a customer chooses the gift, the extra fields you set up (ribbon color, message card and so on) appear. The choice shows the display name and the added amount, for example "Gift wrapping (+5.00USD)" (stores in yen show "(+500円)" on Japanese pages and "(+500 JPY)" in English).

At checkout and in the order, the gift is shown with the product name of the registered product.

For more on how it works in your store, see "What customers see and how they buy".

To show the gift option on some products but not others, see "How to hide the option on specific products".

Default settings

You can have one gift setting and one gift option product (one variant). There is no limit in the admin on the number of extra fields.

When installed, the app asks for these permissions: read and write products, read and write cart transforms, read store languages, and write checkout validations. They are needed to apply gift prices and protect what customers enter.

Troubleshooting

• "Run Initial Setup" appears at the top of the page
  Click "Run Initial Setup". When "Initial setup is complete." appears, you're done. If it fails, wait a while and try again. If that doesn't help, contact us at info@saku-apps.com.
• The gift option doesn't appear on product pages
  Check the following in order. (1) On the right side of the app's "Gift Option Settings", is the badge green and set to "Active" (and did you click "Save")? (2) Is "Application Scope" set to "Per product"? (3) Did you add "SAKU Gift (Product page)" in the theme editor and click "Save" at the top right? (4) Did you select a product in "Gift option 1" of the "Gift options" card? (5) If you use different templates for different products, does that product's template also have the block? For details, see "What to check when the option doesn't show or can't be added".
• The gift isn't added to the cart when selected
  Check the inventory setting of the gift option product. If inventory is tracked, the gift can't be added once stock reaches 0. Turn off inventory tracking and save.
• Home step 3 stays unverified
  The app can't get the status of your theme. The guide for Home step 3 stays visible. Add the block in the theme editor, save, and then reopen the app's Home page.
• The thumbnail image doesn't change
  Click "Change Product", select the same product again, and click "Save".
• The save bar doesn't appear / I can't save
  The save bar appears only when something has changed. If you select a product again and the result is the same as before (same variant, product name and image), it's treated as no change. If a save error appears, check the red message at the top of the page.
• It doesn't work in quick add
  With some themes, the gift option doesn't work in the small "quick add" window that opens from a product list to add items to the cart quickly. Try it from the product page itself.
• Opening the app takes me to Shopify's pricing page
  A paid plan is required on live stores. Development stores are free. For details, see "How to check and change your plan".
• The Home step 1 checkbox can't be saved
  If "Your changes could not be saved. Please try again." appears in red, wait a while and tick the checkbox again.