I'm looking at developing an app for Shopify which will add functionality to a store's checkout page. It would be ideal if the user didn't have to copy and paste code into files themselves hence I was looking at using the ScriptTag API ( http://api.shopify.com/scripttag.html ) to include a custom javascript file.
I've worked through some of the examples on the aforementioned API page and can get a custom script included on every page on my test store except for the checkout page. I've changed the src to start with 'https://' as suggested by the tutorial but my script still doesn't run or even appear in the page source for the checkout.
Does anybody have any ideas how I can get this working for the checkout? Is what I'm trying to do even possible?
The only page of the checkout that script-tags are loaded into is the Thank You page that appears after an order has been completed.
The pages for steps 1 & 2 of the checkout cannot have script-tags added to them for security reasons.
Related
I want domain.com/custompage, but the built in functionality puts all pages inside a /pages/ directory so the URL comes out domain.com/pages/custompage which I don't want.
I found this answer from a Shopify Guru in 2016 that mentions potentially setting up a custom HTML template or using an app, which no longer exists.
Any clues on how to achieve this? I have limited experience with Shopify templates, but could figure it out if someone could point me in the right direction.
This blogger says it can't be done:
"Q: Can you create pages on the root? A: The answer to this is no –> all pages have either /pages/, /collections/ or /products/ in the URL."
However others have told me it is possible. Just not how to do it.
Create a section Name "test" // first a step
Create a page json Name "test" // The second step
After creating the page, JSON does a section test
We have an application which integrates with Shopify Clothing stores. We run our application in an iframe inside the shopify store where it interacts with the store's user.
Right now this application gets integrated with Shopify manually by inserting our script tag inside the store's product page. Can someone tell me how I can do this using a shopify app or theme extension?
Edit after David's answer
Is it also possible for me to get information about standard buttons in the theme like the Add to Cart button or Change Variants input. Ideally I would like to get the selector for these.
You would create a Shopify App that asks for permission to write ScriptTags. The Apps simply installs a script tag pointing to your App. So when the merchant installs your App, they get the script tag. Depending on what your App does in that iframe, you may need your Shopify App to provide other support, but that is not detailed in your OP, so I leave it at that.
I am trying to write a Shopify application and I want to add a section to the product page when the store owner installed my app. I tried this by adding a custom script tag in the shop template and this tag will load and inject my desired HTML into the page. It's work but it needs to force the store owner to change the product page template and its not user-friendly.
I see some apps in the Shopify app store that can change the product page after you install them without needs add any part to the product page template. How they do this work? I can't find the correct way in the Shopify documents.
You can change the Shopify theme of the shop using The API for Assets:
However as drip mentioned this is not a good idea:
If you change the theme auto-magically via code, you are looking for trouble. A lot of things can go wrong - simply you cannot cater for all themes and their changes over time! So you could possibly leave a broken page after the change. The e-shop owner won't be impressed! Actually a lot of the 1* reviews of apps are for that reason!
What would happen if the eshop owner removes your app? He won't know what code to remove.
So, most apps ask the user to add the app code. They provide detailed instructions of course.
Fyi, another problematic approach is the following:
Some apps may attempt to change the DOM "on the fly", by first locating an existing DOM element (a lot of theme-specific if statements to do that with any degree of success) and, then insert the app's DOM elements.
That's very messy and problematic as well, but at least you do not risk ruining the owner's theme files. In the worst case he can uninstall your app and he 'll be ok.
I am developing a shopify app.
Is it possible to add a new link to the main menu via the shopify API?
Thanks
If you log in to your partner account and then create an App you can edit the created App and you will see all the resources at your disposal where you can add a new link.
If you notice also, using the API you can pull and rewrite any asset in a shop to contain a new link. This is discouraged as bad practice. Instead, inject a script tag that does the dirty work.
Soon as I know the API itself cannot change something inside the theme files... some APPs ask you to apply some code manually in the theme, with proper instructions... maybe this code could add the new menu or dynamically interact to get it.
Is there any way to publish a test template page? For example, if I have a template file called "cart-test.liquid," is there anything I can modify so I can navigate to "http://shopname.com/cart-test" in order to test it out?
I'm currently developing an widget that'll be included on Shopify cart pages, and one of my clients wants to test it out before it's published on their real cart page.
The best way to test a theme without editing the live theme is to duplicate the current theme and use the preview function.
From within the Shopify admin (using Shopify Admin 2) goto the "Themes" section. Here you can "duplicate" the published main theme. It will create a copy of the theme within the "Unpublished themes" section. Here you can edit it and also get a preview of this theme (click on the link preview).