Shopify Liquid Template Development Expert
Build, debug, and optimize Shopify Liquid templates with confidence
What You Can Do
You'll write production-ready Shopify Liquid templates that follow best practices, debug complex template issues, and optimize for performance. Whether you're building custom product pages, creating dynamic collection templates, or fixing rendering bugs, this skill provides expert guidance on Liquid syntax, theme architecture, and performance optimization.
Features
Write complete Shopify Liquid templates from scratch based on your specifications
Identify and fix Liquid syntax errors, logic issues, and rendering problems
Analyze templates and apply best practices to reduce render time and improve Core Web Vitals
Ensure templates follow Shopify's coding standards and security guidelines
Modify existing theme files to add custom functionality without breaking compatibility
Optimize CSS, JavaScript, and image asset loading in Liquid context
Get clear explanations of complex syntax, custom filters, and tags
Receive comprehensive testing strategies for template changes
Example Output
Example 1: Custom Product Template
{% if product.available %}
<div class="product-container">
<h1>{{ product.title }}</h1>
<p class="price">{{ product.price | money }}</p>
<form action="/cart/add" method="post">
<input type="hidden" name="id" value="{{ product.selected_or_first_available_variant.id }}">
<input type="number" name="quantity" value="1" min="1">
<button type="submit">Add to Cart</button>
</form>
</div>
{% else %}
<p>This product is currently unavailable.</p>
{% endif %}
Example 2: Performance Optimization Recommendations
- ✅ Use
{% render %}instead of{% include %}for better performance - ✅ Lazy load product images with
loading="lazy" - ✅ Cache expensive GraphQL queries with lookup tables
- ⚠️ Reduce Liquid variable depth—avoid nested objects in loops
Example 3: Debugging Output
Issue: Cart count not updating
Root cause: Missing cart object in template context
Fix: Use {% for item in cart.items %} instead of custom JavaScript
Result: Cart count now updates on page reload
What's Included
- SKILL.md: Complete Shopify Liquid development workflows and decision trees
- Template Checklists: Quality criteria for product pages, collection pages, and custom sections
- Performance Playbook: Best practices for render time optimization and Core Web Vitals
- Liquid Pattern Library: Common patterns (loops, conditionals, filters) and anti-patterns to avoid
- Security Checklist: Guidelines for safe custom Liquid code and XSS prevention
- Debugging Workflows: Step-by-step processes for identifying and fixing template issues
Who It's For
- Shopify theme developers building custom stores
- Frontend engineers transitioning to Shopify development
- E-commerce developers creating custom checkout experiences
- Store owners implementing custom product pages
- Web designers adding dynamic functionality to themes
Best For
- Writing custom product and collection page templates
- Debugging Liquid rendering issues and cart problems
- Optimizing theme performance and Core Web Vitals
- Building checkout customizations and upsell sections
- Migrating from custom code to Shopify Liquid
You might also like
You can systematically evaluate auditorium acoustic performance by inputting measured data (impulse response, RT60, speech intelligibility metrics) or simulation results, then receive detailed analysis identifying specific frequency-dependent problems, quantified deviations from ISO 3382 and AES standards, and prioritized remediation strategies. Claude cross-references your data against performance benchmarks and generates technical justifications suitable for architect presentations, client reports, and construction specifications.
by aharstad91
You can generate complete environmental noise impact assessments (NIAs) that characterize baseline conditions, identify noise sources, map sensitive receptors, interpret predictive modeling outputs, and evaluate compliance against EPA guidelines, OSHA standards, and local ordinances. The framework guides you through cumulative impact analysis and helps you develop technically defensible mitigation recommendations that balance regulatory requirements with project feasibility and budget constraints.
by aharstad91
You can map thermal bridge locations in building envelopes, quantify their effect on overall facade thermal performance (U-value degradation), assess condensation formation risk through surface temperature analysis, and develop detailed mitigation strategies aligned with energy codes and construction feasibility. Claude helps you bridge the gap between idealized thermal calculations and actual building performance by integrating linear and point thermal transmittance into energy models.
by aharstad91
You can input architectural parameters, environmental data, and code requirements to automatically calculate simultaneous loads on glass assemblies, determine minimum glass thickness and support specifications, and generate glazing schedules and stress reports. This eliminates manual load case combinations and identifies design conflicts before fabrication, ensuring compliance with building codes and reducing engineering rework.
by aharstad91
You can systematically evaluate room acoustic conditions by calculating reverberation times (RT60) using Sabine formulas, identifying problem frequencies and room modes, analyzing absorption material performance across frequency ranges, and generating detailed acoustic treatment specifications with scientific justification. The skill produces professional-grade acoustic solutions tailored to your space constraints, budget, and performance targets while maintaining compliance with standards like ISO 3382 and ASTM C423.
by aharstad91
You can systematically evaluate natural light performance in building spaces by calculating daylight availability, assessing visual comfort metrics, and managing solar thermal loads. The skill guides you through measurable daylighting performance indicators—daylight factor, illuminance levels, uniformity ratios—and translates them into actionable glazing recommendations for architects and engineers that comply with LEED, WELL Building Standard, and European building codes.
by aharstad91
You can conduct comprehensive acoustic compliance assessments for building projects by evaluating designs against applicable codes (IBC, local ordinances, ANSI standards), identifying sound transmission class (STC) and noise criteria (NC) deficiencies, and recommending prioritized mitigation strategies with cost-benefit analysis. This skill structures your assessment to capture environmental noise exposure, internal noise levels, speech intelligibility, vibration isolation, and impact sound transmission—delivering actionable compliance documentation for permitting, certification, or remediation planning.
by aharstad91
You can rapidly evaluate smoke control system designs by calculating required pressurization differentials, airflow requirements, and fan capacity specifications. The skill validates compliance against NFPA 92, IBC Chapter 9, and local amendments while analyzing integration points with HVAC and fire alarm systems. It identifies design gaps, suggests optimization opportunities, and generates technical documentation to support the full design lifecycle from concept through commissioning.
by aharstad91