FROM CACHE - en_header

Shopify app creation with add own delivery behavior on cart page

Bazykin
New Member
3 0 0

Hi!

I am new to shopify app development. I need to create app similar to this https://apps.shopify.com/click-and-collect (https://youtu.be/ZzDizQRg_PI). I tried:

but I didn't see any visual changes on cart page of the online shop. Help me please with tutorials, guides, code, videos. I need start point where I can add my own delivery app on cart page before checkout (http://joxi.ru/EA4QG1KhwE9LLr). Development languages are PHP or Node + React. Thanks for help

Replies 4 (4)
Alex
Shopify Staff
Shopify Staff
1561 81 333

Hey there.

While I can't tell you exactly how to do what click and collect are doing, if you want to add elements to the cart page, you can modify cart.liquid using the script_tags or assets endpoints (the former is recommended).

https://help.shopify.com/api/reference/scripttag
https://help.shopify.com/api/reference/asset

Using the script_tags endpoint, you can inject a JS script element to be rendered on every page of the online store, and your script could check if it's being rendered on the cart page, and if so, add the functionality you want into the DOM.

Alternatively, you can update the cart.liquid asset file directly to include your widget/element without a script needing to detect whether it's being run in the right place.

Hope that helps.

Cheers.

Alex | Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

Bazykin
New Member
3 0 0

Hi Alex!

Thanks for the reply. Can you please provide some links for your shopify app examples on github where I can embed scriptag or asset? Or maybe you can give some guides or tutorial for using scriptag or asset?

Thanks for help

Alex
Shopify Staff
Shopify Staff
1561 81 333

Hey again,

It's hard to link to any specific examples because it really depends on whether you're using a library to interface with Shopify's API or using more primitive HTTP requests with your language of choice.

For example, the shopify_api rubygem has classes for most resources with CRUD methods defined for each using ActiveResource, making it simpler to interact with and manipulate them (create, read, update, delete).

The alternative is to just use your language's HTTP methods (or a library if your language doesn't ship with them in its standard library). For example:

require 'net/http'

Net::HTTP.get(URI('https://shop.myshopify.com/admin/script_tags.json'))

... in which case it's as easy as following the documentation for what endpoints you can hit and what parameters you can use if applicable.

If you are unfamiliar with how to interface with our API primitively like in the code example above (such as generating an access token, etc.) I suggest reading through our tutorials section to get a feel for how that works.

If you plan to use a library, you need only refer to that library's documentation alongside out documentation to have everything you should need. Most libraries are going to use a CRUD approach in my experience, so I would familiarize yourself with those principles.

For code examples, I challenge you to scavenge Github/other sources on your own. We've hit a wonderful point on the internet where you can find an example of virtually anything anywhere.

Cheers.

Alex | Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

Bazykin
New Member
3 0 0

Hey again,

Can I run this get request in the public app?

I created test shop. How can I embed changes on any page of this shop because all apps from tutorials section show only change on admin panel?