How to use Bold Product Options in your Shopify Store | Quick Tutorial

 

 

1. First, let’s quickly install the Bold Product Options App. 

Bold Product Options Install in Shopify

2. Then duplicate the theme so that in case something breaks you can revert back. 

3. Then use the auto installation inside the Bold Product Options App. 

  

4. Now go to Options > Create/Edit Options > Create your first option set. 

 

5. Name the Option set, and click on "Select product", and select the product that you want to have Custom options to. 

6. Let’s say we want to have the customers be able to choose from different metal types for this bracelet. We'll use the swatch options for this example. 

7. Let's name the swatches "Golden Alloy" and "Aluminium". And save it. 

8. Now we go back to the product page and reload it. 

9. If everything's working in your theme then that's great, but for debut theme I've noticed that it doesn't work at this step. So you'll have to follow few more steps to make it work. So, first let's go to your theme editor "Themes > Actions > Edit Code". 

10. Now open the file "product-template.liquid". 

11. Now click inside the code editor and press "ctrl + f" (Windows) or "command + f" (Mac). This will open a search bar at the top right corner of the editor. Now you need to locate a certain line of code, so copy the following code and paste it in the search bar in order to locate it <div class="bold_options" data-product-id="{{ product.id }}"></div>

12. Now cut the code, we need to place it somewhere else. In the search bar that you've opened with "ctrl + f", type "<select>", and you'll find two select tags. The <select> tag that has the id “ProductSelect-”, you need to paste the Bold Product Options code underneath it. 

 13. If we reload the website now, you'll likely see that it’s still not working, because the data isn’t getting populated correctly. So we need to do one last thing which is, we need to run the auto installation again. Go to Bold Product Options app, then at the menu bar you'll see "Need help > Liquid installation", click on that. And you'll see the auto installation page appears again. Now auto install the app once more. 

14. If we go to the website and reload, this time you should see that the app is working. You can try selecting different options and add them to cart, in order to see if everything's working as expected. 

 

Awesome! This is how you can install Bold Product Options in your Shopify Store. 

Thanks for reading. 

Get cool discounts on themes and apps by going to the links below. It’ll help you save money and help the channel and blog keep going as well. 

If this post was helpful then please leave a nice comment, or if it was unhelpful then please leave a comment to let me know what can be done better. I'm always willing to improve. 

As always, Stay safe, Stay busy. Catch ya later. Ice Out.

 

Shopify Free Trial: https://bit.ly/icetech-shopify-bpo

Bold Product Options Free Trial: https://bit.ly/icetech-bpo

Out Of The Sandbox & Pixel Union Themes 10% Discount CODE + LINK:
LINK: https://bit.ly/icetech-themes
CODE: STOREDESIGNER

 

1 comment

IceTech

If you have any question then please feel free to let me know here.

Leave a comment