Skip to content

Instantly share code, notes, and snippets.

Will Broderick willbroderick

  • Clean Canvas Ltd
  • Nottingham, UK
Block or report user

Report or block willbroderick

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@willbroderick
willbroderick / search.json.liquid
Last active Dec 2, 2019
Drop-in fallback template for Shopify Predictive Search API
View search.json.liquid
{%- layout none -%}
{%- paginate search.results by 6 -%}
{%- capture products_output -%}
{%- for result in search.results -%}
{%- if result.object_type == 'product' -%}
,{"title":{{ result.title | json }},"url":{{ result.url | json }}
{%- if result.images and result.images.size > 0 -%}
,"image":{{ result.images[0] | img_url: 'master' | json }}
{%- endif -%}
,"vendor":{{ result.vendor | json }},"price_max":{{ result.price_max }},"price_min":{{ result.price_min }},"compare_at_price_min":{{ result.compare_at_price_min }}}
@willbroderick
willbroderick / instructions.txt
Created Feb 20, 2019
Pre-order in a Clean Themes Sectioned theme (excluding Boost)
View instructions.txt
Warning: This does NOT work with quick-buys.
1. Copy and paste the following to the bottom of Templates/product.liquid:
{% for collection in product.collections %}
{% if collection.handle == 'pre-order' %}
<script>$('[action^="/cart/add"] input[type=submit]').val('Pre order'); theme.OptionManager.strings.buttonDefault = 'Pre order';</script>
{% endif %}
{% endif %}
@willbroderick
willbroderick / load-script.js
Last active Jan 8, 2019
Load a script from a URL, with before/after callbacks & queueing
View load-script.js
// Load a script from a URL, with callbacks
// If a 'before' callback is specified, script will load synchronously
{
window.scriptsLoaded = {};
window.loadScriptOnce = function(src, callback, beforeRun) {
if(typeof window.scriptsLoaded[src] === 'undefined') {
window.scriptsLoaded[src] = [];
var tag = document.createElement('script');
tag.src = src;
@willbroderick
willbroderick / show-featured-image-not-variant-image.js
Last active Feb 27, 2018
Show featured image on page load, not selected variant image - Symmetry Sections
View show-featured-image-not-variant-image.js
@willbroderick
willbroderick / linked-options.liquid
Last active Jan 23, 2018
Linked options helper methods for Shopify. See this: http://docs.shopify.com/manual/configuration/store-customization/advanced-navigation/linked-product-options - Updated to work with Clean Themes sectioned themes
View linked-options.liquid
<script>
// (c) Copyright 2011 Caroline Schnapp. All Rights Reserved. Contact: mllegeorgesand@gmail.com
// See http://wiki.shopify.com/Linked_Options
// Updated by willbroderick to:
// - work with multiple forms on the page
// - target markup specific to themes by Clean Themes
// - work with sections
// Based on an old version of: https://gist.github.com/carolineschnapp/1083007
@willbroderick
willbroderick / product-json.liquid
Last active Nov 13, 2017
Replacement for {{ product | json }} with accurate inventory information removed
View product-json.liquid
{% comment %}## Add this snippet, then replace {{ product | json }} with {% include 'product-json' %} ##{% endcomment %}
{% capture product_json %}{{ product | json }}{% endcapture %}
{% assign product_json_split = product_json | split: '"inventory_quantity":' %}
{%- for str in product_json_split -%}
{%- if forloop.first -%}{{ str }}
{%- else -%}
"inventory_quantity":
{%- assign str_split = str | split: ',' -%}
{%- for str2 in str_split -%}
{%- unless forloop.first -%},{%- endunless -%}
@willbroderick
willbroderick / overflowing-tables.js
Created Oct 19, 2017
Overflowing tables - wrap in a scrollable container
View overflowing-tables.js
// copy this to the very bottom of themes.js.liquid (might need to change the '.rte' depending on theme - this one's for Showcase)
$('.rte table').wrap('<div style="overflow: auto; border: 1px solid rgba(0,0,0,0.0.5)">');
@willbroderick
willbroderick / expression-two-per-row.css
Created Oct 18, 2017
Expression - Two products per-row on mobile
View expression-two-per-row.css
@media only screen and (max-width: 767px) {
#content .productlist .product { width: 48%; }
#content .productlist .product:nth-child(2n+1) { margin-left: 4%; }
#page-collection #content .productlist .product:nth-child(2n) { margin-left: 4%; }
#page-collection #content .productlist .product:nth-child(2n+1) { margin-left: 0; }
#content .productlist .product .foot .buttoncont, #content .productdetail .buttoncont { max-width: 100%; }
}
@willbroderick
willbroderick / pick-a-symmetry-sections.js
Last active Feb 27, 2018
Show 'Choose...' in a Symmetry theme with Sections
View pick-a-symmetry-sections.js
// copy this to the very bottom of Assets/theme.js.liquid, below everything else in there
$(document).on('optionate', 'select[name="id"]', function(){
var $this = $(this);
setTimeout(function(){
if(!$this.closest('.product-detail').find('.option-selectors select option[value=""]').length) {
$this.closest('.product-detail').find('.option-selectors select').prepend('<option value="">Choose...</option>').val('').trigger('change');
$this.closest('.product-detail').find('.price-area').html('&nbsp;');
$this.closest('.product-detail').find('.gallery .thumbnails a:first').trigger('click');
}
@willbroderick
willbroderick / improve-line-breaks.js
Last active Sep 7, 2017
Prevent a line-break before the last word in a passage of text, to aid typography
View improve-line-breaks.js
/*
* This will turn "I eat lots of poached eggs" into "I eat lots of poached&nbsp;eggs"
*
* So this:
* | I eat lots of poached |
* | eggs
*
* Becomes:
* | I eat lots of |
* | poached eggs |
You can’t perform that action at this time.