Update Checkout Layout and JS behavior in Cornerstone (BigCommerce) - e-commerce

When we add the products into Cart and proceed to Checkout page we can apply the coupon like this.
It shows unnecessary error in the console.
I checked the template/pages/checkout.html but it has this code.
{{{ checkout.checkout_content }}}
How can I update the {{{ checkout.checkout_content }}} and where is it?
and I also can't find the proper JS code in assets/js.
What I guess is this HTML section/js code is dynamically loaded from Bigcommerce API but I can't verify it.
How can I solve my issue?

Have you tried running on localhost instead of 127.0.0.1, to see if makes any difference?
This is a good situation to get a HAR file, as that would show your network tab details. If you have one, it may be best (and more secure) to reach out to technical support team to review it with you rather than sharing it in StackOverflow. Also, in regards to your question about { checkout.checkout_content } -to modify this, you will need to take a look at the checkout-js repo as it's not available via the theme.

Related

Shopify Interact with product page HTML via app

We plan to create a Shopify app but we face some problems to find in documentations how to interact with pages.
I`m not sure we must ask every time users to add codes and etc, so I need to know if I miss something.
I need to interact with the product pages in Shopify from an app.
I search and read all the web for this and everything is how to start but not the actual examples.
I know for the ScriptTags and how to include them but that is.
If someone can give me a simple example of how for example to hide the Buy button and insert something on instead.
I know how to select it with the default theme with JQuery but what about all other themes?
There are two ways to interact with the front page:
1) Inject some code in the page ( the live one )
2) Use ScriptTag as you mentioned.
The code injection script will modify the product template for example and inject your code if you like to do this automatically or you can instruct the user to do so on their own, but if they are not code savvy there might be issues.
In addition this code will live only on the live theme in most cases. And if the user likes to delete your app at a specific time you must be sure to write the logic in such way that it won't affect the site if your app is no longer present ( since it will be really hard to clean up the files once you add the code automatically )
For this approach you will need to use the Asset API.
You will need to get the content of the file with a GET request to the file and make a put request in order to update it.
The better approach is to use ScriptTag API.
This will allow the use of a script file that will be attached on EVERY theme. This will not modify the theme files in any form or shape.
It seems that this is the approach that you are looking for.
Please have in mind that you will be the one hosting the file from your app so pretty much you can write what ever you like there. So if you like to use jQuery you must be sure that the themes have included jQuery or you will have to add the jQuery core code inside your script.
As for how to write a script tag, there is a pretty straightforward documentation here: https://help.shopify.com/en/api/reference/online-store/scripttag#create-2020-01

How to get github edit history of issue and issue comments via api?

I only found api to get issue list, issue content, issue comments list and content, no issue content edit history, no issue comments edit history.
No, this cannot currently be done purely from the API.
However, if we reverse engineer the way GitHub loads past edits in the web interface, and do a bit of scraping, we can accomplish the same thing without the API. Unfortunately, this means that we don't have the reliability of an API - GitHub's web interface is liable to change at any time, breaking our code. But it's better than nothing!
So, first we need a log of all the edits for a comment. Let's do this with the comment https://github.com/seisvelas/crypsee/issues/1#issue-874033952 (from a test repo provided by the gentleman who set the bounty on this question). On order to get a log of this issue's comments, we will need to base64 encode the issue number with '05:' then the word 'Issue' at the beginning. Why '05:'? I have no idea. But it's always there and it won't work with out it. So we'll be base64 encoding the string "05:Issue874033952", which gives us MDU6SXNzdWU4NzQwMzM5NTI=
Great, now we insert MDU6SXNzdWU4NzQwMzM5NTI= into this URL scheme: https://github.com/_render_node/{BASE64 ENCODING HERE}/comments/comment_edit_history_log, resulting in a link to https://github.com/_render_node/MDU6SXNzdWU4NzQwMzM5NTI=/comments/comment_edit_history_log
Following that link, we see an edit history, but not the contents of the edits themselves:
However, this gives us the information we need! If we look at the HTML, we see that all edits prior to the current edit are defined as buttons with a link to that edit:
<button
type="button"
class="btn-link dropdown-item p-2"
role="menuitem"
data-edit-history-url="/user_content_edits/MDE1OlVzZXJDb250ZW50RWRpdElzc3VlRWRpdDo1MzIxODcxNzE="
>
The URL pointed to by the data-edit-history-url is the same URL loaded via the browser's networking tab when clicking to view a past edit in the web interface!
Unfortunately, if you attempt to view that page on it's own, you get a 404. It is intended to be viewed only from the web interface. But that's no problem, just go to the web interface, view one of the edits, and copy the headers it sends along. In my case I'm using Chromium, so I just find the request to the edit in my networking tab, right click and hit 'copy as Fetch request (nodejs)' and viola, with those headers I'm good to go!
For example, for the comment we've been using this whole time, I make that request and get back a bunch of HTML. The content of the original edit is near the end:
<ins><p class="rich-diff-level-zero">before edit</p></ins>
There it is! I could write a script to automate this, but then I'd be doing everything for you :3 Suffice it to say that with a day's work of cleverly organized scraping, this is roughly what you must to in order to view these revisions. If someone does make such a tool, the OSINT community will surely be immensely grateful!
To see the features of github api, it is better to read the following link
The best source to get the answer:
https://docs.github.com/en/rest/reference/issues
Check the issues you mentioned, ie issue comments, edit history issue, etc. in the link above
As far as I saw it is possible to receive issue comments but I did not see a section for edit history issue
I also suggest you see the following links for the edit history issue:
https://github.com/isaacs/github/issues/954

Can't upload new product image backend prestashop

I need a little help here, i hope someone here can help me for a hint or clue.
First of all, I'm not programmer. I'm just web admin who can use cms and basic html.
I was using PrestaShop for my online shop. In the backend, I can't upload new product image anymore.
The error just blank without any sign for me. Here for the screenshot:
I appreciate it, if someone can help me, thanks, and sorry for my english.
#PanjiWiyono This errors don't really give us a quality information, but this is a start. In your JS code should be a ajax query that has an error when converting results to json (first error). You should check what's the exact error that this request is returning by inspecting in browser developer console.
If you detect that the second error is in fact, the response of this ajax query, well now we almost have the problem.
The second error should be related to data size. Check this: Error while sending QUERY packet
Anyway, you should check DbPDO.php class. You can use debug_backtrace function to display the complete stack, but definitly if error is related to a basic PHP class issue you will have not help knowing wich classes are in calling stack.
Good luck.
Simple solution
maybe a extra module is in a conflict with the prestashop core files. go to advanced parameters, performance and disable third party modules and try again.
other option is reupload admin folder with other name and
js folder check again
hope it will work for you

CasperJS: Disable remote page's javascript but still use casper.evaluate?

Thanks for reading my topic, I'd be really grateful if anyone could suggest any other avenues I should explore to achieve the below.
Using CasperJS or PhantomJS I need to disable all JavaScript that belongs to the pages I navigate from being executed, while still being able to run my own using casper.execute.
Does anyone know a way I can do this?
Is it possible to modify the HTTP headers or bodies using onResourceRequested or onResourceReceived? or cancel a request conditionally? or are they read only?
Can you modify the raw HTML source before it's offered for parsing?
I've tried hacking a window.stop() in a casper.execute early, but this works inconsistently between pages.
Is the Phantom WebServer module used for this kind of thing? Could/Should I route reqs/responses through that and modify them as they pass through?
Thanks for any help - I appreciate this is a weird use case.
As stated here it is possible but not with the current phantomjs master branch but in a specific [dev branch[(https://github.com/Vitallium/phantomjs/tree/allow-to-disable-js), you should build from, look for the latest commit for disable-javascript option.

Integrating custom analytics with Shopify

I am developing an analytics product similar to Google Analytics and want to offer an integration for our Shopify users.
I would need to do just two things:
1) Insert our JavaScript snippet into the body of all the shop's pages
2) Insert a second conversion snippet into the body of only the "thank you" page after a purchase to record the sale, passing back the order total and order number
Could you point me in the right direction?
The ScriptTag endpoint looks optimal except that it doesn't seem to provide any way to differentiate between the "thank you" page and other pages, or to pass the order details from the "thank you" page into the script.
It seems like I either need an endpoint that can inject arbitrary code into all pages, or one which lets me alter the theme layout file to add code before the </body> tag.
If I can do that much, it looks like I might be able to use a conditional in the templating language to only show the conversion code if the URL matches the "thank you" page URL, and use {{ total_price }} and {{ order_number }} in that code.
Does the uninstall webhook allow me to make changes before the rights for the app are revoked? It seems like I would need a way to clean up at uninstall to remove my code from the theme, if I'm allowed to edit the layout file.
itThere are two ways you can go about this:
ScriptTags: You're already aware of this method. It's true that the script is loaded into each and every page, but you can look at document.url in your js to figure out which page you're on and conditionally execute code based on that.
Scripts inserted this way are executed during the 'onLoad' event. At that time you have access to the DOM and can do basically whatever you want with the page.
Snippets: Using the Assets endpoint you can make arbitrary changes to the user's theme. Be careful with this power! The recommended way to make complex changes to a page is to create a custom snippet in the theme with your additions and then tell the user to insert an include tag into their code where it needs to appear. This reduces clutter in the main theme files.
I'd recommend using ScriptTags wherever possible. As mentioned below, they don't need cleaning up and remove the need for user interaction when setting up the app.
--
As for the uninstall webhook: It is fired after the app has been uninstalled from the shop, so you no longer have access. It's designed to be used to trigger cleanup on your end (remove db entries, etc.). Note that ScriptTags and Webhook subscriptions are automatically cleaned up, but any changes you've made to the theme aren't
You ask a lot of questions in one posting.
For your #1 and #2 read:
http://api.shopify.com/scripttag.html
Secondly, for your app install/uninstall read:
http://api.shopify.com/webhook.html
Pay attention to the part about app/uninstalled since you're interested in that.
As for knowing when someone installs your App, that is really up to you to figure out. Should not be too hard since you probably read about how to make and App in the first place. Shopify provides lots of boiler plate code on github that can show you almost everything you asked here.