Shopify recently introduced its new 2.0 API, Which is a major update. It has changed the way of installing apps. Previously we were required to manually edit the theme’s liquid codes to add apps to the theme, which has some cons. One major downside was user had to manually remove all the leftover code after uninstalling an app. But with the new 2.0 API users can easily do the manual installation themselves. In this article, we are going to show how you can easily install our “Product Personalizer” App in your theme with the new Shopify 2.0 drag and drop block system. Simply follow these steps to add our app to your theme.
1. Install Product Personalizer to your store:
You can add the Product Personalizer app by simply visiting this link. You will see a “Add app” button.
Once you click that button you will be redirected to your store where you will see the permissions we need for our app to work. Once you see that and agree you can click on the “Install app” button.
After you have clicked that button the app will be installed in your store. If you are a trial user you have to click on “Start free trial” else you can start your subscription.
2. Installing Product Personalizer to your theme:
After you have successfully installed the “Product Personalizer” App on your store and created a product configuration using our app, you won’t see the app working on your product page. That is because you also need to add the Product Personalizer to your theme. I am using the default “Dawn” theme in this example.
Simply go to your store home, You will see a “Customize theme” button, click on that.
Then you will see your currently active theme, just click on the “Customize” button selecting your current theme.
Once you click the “Customize” button you will be taken to a page where you can visually edit your theme. You can also add apps there as a block. To add our “Product Personalizer” app as a block, you have to select the product template as our app works on the product page.
Simply select “Products” by clicking on the top select menu of the theme customizer, then select “Default product“, Follow the screenshot below to better understand.
Once you are at the “Default product” page simply navigate to the “Product information” section and click on the “Add block” button, you will see our “Product Personalizer” app.
You are almost done, You will see that our app block has been added to the product information section, you will see an icon beside our app. Use that to drag and move it up or down, place it where you want. We suggest placing it before the Quantity block. Follow the screenshot below.
You are done, now click on Save and visit your product page. You will see that our app has been successfully added to your product 😄
That is how easy to do the manual installation with the new Shopify 2.0 Block system. Thanks for using Product Personalizer, Hope this article was helpful to you.