Taming the Webhook: Updating Shopify Product Metafields

There I was, sipping my third (or was it fourth?) coffee of the day when I had one of those lightbulb moments. You know the kind—where you suddenly feel like Einstein at a Christmas party, only to realize you’re still just in your pajamas. I was fiddling with Shopify’s webhook system, trying to figure out how to neatly tuck away a price history in a metafield every time a product update jingle-belled its way into my life. Until—BAM!—it hit me: we've got exactly what we need with a little cunning and creativity.

Embracing the Webhook Adventure

Imagine, if you will, all of us huddled around a figurative fireplace, our eyes gleaming in the glow of a shared quest. Our mission? Capturing Shopify’s elusive ‘product update’ and bending it to our will like wizards on a caffeine high. The plan is simple: catch those pesky webhooks, interpret their secrets, and quietly update your product’s metafield with a shimmer of price history.

Step 1: Set Up Your Shopify Webhook

First things first—and don’t rush because this is like the bread and butter of our journey—you want to scurry over to your Shopify admin page. Get yourself nestled into: Settings > Notifications > Webhooks. Click that magical button labeled "Create webhook." Select the ‘Product update’ option from the dropdown list, and paste your endpoint URL as though marking treasure on a map.

Step 2: Create the External Endpoint

Now, some DIY spirit here. We need an endpoint where our webhook will gently land. Picture a warm, welcoming place for all that JSON jazz. You can whip this up with Node.js as our trusty partner-in-crime:

const express = require('express')
const bodyParser = require('body-parser')

const app = express()
app.use(bodyParser.json())

app.post('/your-endpoint-url', (req, res) => {
  const product = req.body
  // capture the price here
  const priceHistory = { date: new Date(), price: product.variants[0].price }
  // Call shopify APIs to update the metafield with this priceHistory
  updateProductMetafield(product.id, priceHistory)

  res.sendStatus(200)
})

function updateProductMetafield(productId, priceHistory) {
  // Logic to update metafield using Shopify API
  // Use your favorite HTTP request library
}

app.listen(3000, () => console.log('Server ready on port 3000'))

Step 3: Update Product Metafields

Now for a dance with the Shopify API. It sounds daunting, like learning the tango overnight, but fear not. What we need is a mutation query that lets us tweak those metafields.

const updateProductMetafield = async (productId, priceHistory) => {
  const mutation = `
    mutation {
        metafieldUpsert(input: {
            key: "price_history"
            namespace: "custom"
            ownerId: "gid://shopify/Product/${productId}"
            value: "${JSON.stringify(priceHistory)}"
            valueType: JSON_STRING
        }) {
            metafield {
                id
            }
        }
    }`

  const response = await fetch(
    `https://your-shop-name.myshopify.com/admin/api/2023-04/graphql.json`,
    {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
        'X-Shopify-Access-Token': 'your-access-token',
      },
      body: JSON.stringify({ query: mutation }),
    }
  )

  return response.json()
}

Step 4: Test and Tweak

Testing this setup is like assembling IKEA furniture—rewarding but occasionally baffling. Run through a product update on Shopify, and watch your server logs like a hawk. You should see that price history starting to stack up like trophies on a shelf.

Conclusion: The Epic of Price Tracking

As our journey together winds down by the digital fireplace, reflect on how we’ve coaxed Shopify’s webhooks to do our bidding. With a friendly nudge and a bit of know-how, we’ve automated the tracking of our price changes right within our Shopify store. So, next time someone asks, “Is it possible?” we can grin like Cheshire Cats, coffee in hand, because we’ve already danced with shopiphonic magic—and emerged victorious.