Skip to content

Instantly share code, notes, and snippets.

View stewartknapman's full-sized avatar
🤘

Stewart Knapman stewartknapman

🤘
View GitHub Profile
@stewartknapman
stewartknapman / Shipping_rate_by_product_tag.rb
Created November 28, 2021 23:18
Shopify script to show shipping rates if products have certain tags
# ================================ Customizable Settings ================================
# ================================================================
# Show Rate(s) for Product Tag
#
# If we have a product with matching tag, the entered rate(s) will be
# shown, and all others will be hidden. Otherwise, the entered
# rate(s) will be hidden.
#
# - 'product_tag_match_type' determines whether we look for the
# product to be tagged with any of the entered tags or not.
@stewartknapman
stewartknapman / Find what code changed the DOM.md
Last active March 28, 2024 14:28
Find what code changed the DOM

Have you ever tried to track down which piece of javascript modified the DOM? Use a mutationObserver to monitor the DOM for changes. Then run console.trace() inside the callback. This will log a stack trace all the way back to the code that did the DOM modification. Basically copy and paste this code.

(function () {
if (!document.querySelector && !window.addEventListener && !("classList" in document.createElement("p"))) return;
var ready = function (callback, ctx) {
if (typeof callback !== 'function') return;
if (document.readyState !== "loading") {
callback.apply(ctx);
} else {
document.addEventListener("DOMContentLoaded", function () {
@stewartknapman
stewartknapman / showcase-product-gallery.liquid
Last active May 14, 2019 00:59
Shopify section for Showcase Instagram app supplied by the app. https://apps.shopify.com/shop-instagram
@stewartknapman
stewartknapman / Readme.md
Last active March 7, 2019 23:49
Shopify: Track the last viewed collection and update any continue shopping links.

ContinueShopping

Track the last collection by storing or updating a cookie on every collection page visit. If it comes across a continue shopping link then it updates that link to point back to that last collection.

Add the attribute data-continue-shopping-link to any link you want to act as a continue shopping link.

Requires the current template to be passed to it from liquid:

@stewartknapman
stewartknapman / Tabs.scss
Last active June 13, 2019 14:37
Tabs for use with Debut
.description-tab__header {
padding-top: 1.5em;
.no-js &:first-child {
padding-top: 0;
}
}
.has-tabs {
.description-tabs {
position: relative;
@include display-flexbox();
@stewartknapman
stewartknapman / Readme.md
Created December 18, 2018 00:23
The scripts portion of a package.json file used for Shopify theme development

The scripts portion of a package.json file used for Shopify theme development.

To run use the command npm run build.

Watch and build JS files in the _src/js/ folder. This will create a minified file and a debug version (including a sourcemap) for development, and add them to the assets folder.

We also watch for changes the main theme.js file in the assets folder and then minify this for production.

{% comment %}
Title case a string of text.
Usage: {% include 'title-case' string: 'my string' %}
{% endcomment %}
{%- capture str -%}{%- endcapture -%}
{%- assign small_words = 'a|an|and|as|at|but|by|en|for|if|in|nor|of|on|or|per|the|to|vs|vs.|via|with' | split:'|' -%}
{%- assign string_parts = string | split: ' ' -%}
{%- for p in string_parts -%}
{%- assign is_small = false -%}
{% comment %}
Remove orphans from a string of text by adding a non-breaking space between the last two words.
Usage: {% include 'adopt' string: 'my string' %}
{% endcomment %}
{%- assign string_parts = string | split: ' ' -%}
{%- assign last_part = string_parts | last -%}
{% if last_part contains ' ' %}
{{ string }}
{% else %}
@stewartknapman
stewartknapman / _scan_string.liquid
Last active May 22, 2017 00:24
Take a some Shopify content, such as product.description or page.content and add `srcset` to any of its images.
{% capture func %}
{% comment %}
Scan String:
Scan a string looking for things
Parameters:
Content: the content to be scaned
Split: the item to split the string with
Start: the thing that says we can start collecting