Ad

Shopify - Client Side Order Tagging

- 1 answer

As per the requirements I got, In the Shopify shop, admin should be able to search for the orders from a customer chosen delivery date. The only feasible thing I could find was to tag the orders with their delivery and to filter the orders from the tag. My question is whether there a proper way to tag the orders with a customer given delivery date when a order is created? (I'm not allowed use any paid app/plug-in)

There are two approaches I could figure out with the admin orders API, but both has issues,

  1. Write a webhook (for order confirmation event) to an external server that could get the user selected delivery date and call the admin order API from there to tag the order - The issues are it's an overhead to maintain a server only for tagging the order and even if I do since admin API doesn't allow CORS is this feasible? (and since the shop owner doesn't even want to pay for a paid plugin, maintaining server is also not practical)

  2. Call the admin API from the client-side after the order is confirmed. I tried this and it works as it's expected but the issue is I have to keep the admin API credentials for orders and transactions stored in the client-side JavaScript which is not a good practice at all, as per my knowledge.

It's allowed to create additional details about the order at the client side using cart-attributes, and they are shown at the admin order's page as well, but Shoify doesn't allow to search orders using cart-attributes added to the order.

I would be grateful if someone can suggest a solution for this.

Ad

Answer

You can actually do this with a Chrome plugin (or really complex bookmarklet) with no server side requirements. see https://developer.chrome.com/extensions/overview

your api calls would look something like the following POC scripts. API calls won't search the order by tags so you could skip that and filter by a note_attribute set via your theme's .liquid code. Your chrome plugin would then list open orders and display them by requested delivery date.

get an existing order and update its note attribute:

jQuery.get('/admin/orders/5803440262.json').then(function(d) {
    console.log(d.order);
    var so = {
        id: d.order.id,
        note_attributes: [{
            name: 'Test Value',
            value: 'Test'
        }]
    };
    jQuery.ajax({
        url: '/admin/orders/' + so.id + '.json',
        type: 'PUT',
        data: JSON.stringify({
            order: so
        }),
        contentType: 'application/json'
    }).then(function(d) {
        console.log(JSON.stringify(d, null, ' '));
    });
});

and reading orders:

jQuery.get('/admin/orders.json?limit=250').then(function(d) {
    var count = 0;
    d.orders.forEach(function(so) {
        if (so.tags.indexOf('__amazon_pending') != -1) count++;
    });
    console.log(count + ' matching orders');
});
Ad
source: stackoverflow.com
Ad