shopify-debugging

Diagnose and fix Shopify Liquid, API, and frontend debugging issues.

77|9|Updated Oct 10, 2025
One-click install
npx skills add https://github.com/henkisdabro/wookstar-claude-plugins --skill shopify-debugging-henkisdabro
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: shopify-debugging
Source: https://github.com/henkisdabro/wookstar-claude-plugins/tree/main/plugins/shopify-developer/skills/shopify-debugging
Command: npx skills add https://github.com/henkisdabro/wookstar-claude-plugins --skill shopify-debugging-henkisdabro

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides structured guidance to identify, reproduce, and fix Shopify Liquid syntax errors, theme rendering issues, API call failures, JavaScript problems, cart and checkout glitches, and webhook delivery problems.

Core Features & Use Cases

  • Liquid debugging: Use DevTools to identify Liquid errors in templates and fix syntax or scope issues.
  • API debugging: Diagnose REST/GraphQL errors, authentication, rate limits, data mismatches, and fixes.
  • Frontend debugging: Troubleshoot JavaScript console errors, network requests, and performance issues in Shopify themes and apps.
  • Cart & Checkout: Debug cart operations, variant IDs, checkout workflows, and webhook integrations.
  • Theme Preview & Webhooks: Verify theme changes in Preview mode; validate webhook deliveries and HMAC verification.

Quick Start

Start by reproducing the issue in the Shopify Theme Preview, then open browser DevTools to inspect Liquid errors, console logs, and network requests. Check API responses for errors and verify authentication, endpoints, and permissions. Validate cart/checkout behavior and test webhook deliveries, applying fixes in code and re-testing end-to-end.

Frequently Asked Questions about shopify-debugging

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I debug Shopify Liquid errors in my theme templates?

To debug Shopify Liquid errors, reproduce the issue in Shopify Theme Preview and use browser DevTools to inspect template rendering. This identifies syntax or scope issues, allowing you to apply structured code fixes and re-test end-to-end.

What is the best way to diagnose Shopify API errors and rate limits?

Diagnosing Shopify API errors involves checking REST or GraphQL responses for authentication failures, rate limits, and data mismatches. Use browser DevTools to inspect network requests and verify endpoints, permissions, and API error handling.

Why are my Shopify webhooks failing delivery and HMAC verification?

Shopify webhook failures often stem from incorrect HMAC verification or delivery endpoint issues. Validate webhook deliveries within the Shopify Admin, inspect network requests, and ensure your integration correctly handles the payload structure.

How do I troubleshoot JavaScript console errors and cart glitches in Shopify?

Troubleshoot JavaScript console errors and cart glitches by opening browser DevTools to inspect console logs and network requests. Debug cart operations and variant IDs, then verify checkout workflows to resolve frontend performance issues.

Can I use browser DevTools to debug Shopify theme preview changes?

Yes, you can use browser DevTools to debug Shopify theme preview changes. Reproduce the issue in Preview mode, inspect Liquid errors and JavaScript console logs, and apply structured guidance to verify theme rendering before publishing.