Skip to content

Instantly share code, notes, and snippets.

@freakdesign
freakdesign / extract-image-liquid
Last active May 8, 2023 14:15
Get image src from a string in Liquid
{% if article.content contains "<img" %}
{% assign src = article.content | split: 'src="' %}
{% assign src = src[1] | split: '"' | first | replace: '//cdn', 'http://cdn' | replace: 'http:http://', 'http://' | remove: 'https:' %}
{% endif %}
@freakdesign
freakdesign / order-to-cart.liquid
Last active September 15, 2022 20:53
Add a previous Shopify order to the cart
{% if order.line_items.size > 0 %}
<p>
<button class="btn place-same-order">Add order to cart</button>
<script>
(function(){
/* Check for the button */
var buttonOrder = document.getElementsByClassName('place-same-order') || false;
if(!buttonOrder){ return }
@freakdesign
freakdesign / imgix-theme-settings.json
Last active October 28, 2021 13:34
Snippet and Theme Settings to for converting a Shopify CDN image path into an Imgix path. Snippet allows for the passing of Imgix filters.
{
"name": "Imgix",
"settings": [
{
"type": "paragraph",
"content": "For more info on these theme settings refer to the original [blog post](http:\/\/freakdesign.com.au\/blogs\/news\/91099207)"
},
{
"type": "checkbox",
"id": "enableImgix",
@freakdesign
freakdesign / blog-atom.liquid
Last active October 19, 2021 21:48
Shopify RSS atom feed
{% layout none %}{% comment %}
/*
* Simple blog feed
*
* Copyright (c) 2015 Jason Bowman (jason@freakdesign.com.au)
* Licensed under the MIT license:
* http://www.opensource.org/licenses/mit-license.php
*
*/
{% endcomment %}<?xml version="1.0" encoding="UTF-8"?>
@freakdesign
freakdesign / new-content-for-header.liquid
Last active October 15, 2021 23:38
Detect if an admin is logged into Shopify using liquid.
<!--
Simple method for detecting an Admin in Shopify using liquid.
Quick code by jason at freakdesign.com.au
Related Blog post: http://freakdesign.com.au/blogs/news/34154561
-->
{% capture CFH %}{{ content_for_header }}{% endcapture %}{{ CFH }}
{% if CFH contains 'admin_bar_iframe' %}
// (c) Copyright 2014 Caroline Schnapp. All Rights Reserved. Contact: mllegeorgesand@gmail.com
// See http://docs.shopify.com/manual/configuration/store-customization/advanced-navigation/linked-product-options
// jQuery 1.7+
var Shopify = Shopify || {};
Shopify.optionsMap = {};
Shopify.updateOptionsInSelector = function(selectorIndex) {
var singleOptionSelectors = jQuery('select.single-option-selector');
@freakdesign
freakdesign / get-total-stock-value.md
Last active November 19, 2020 10:44
JavaScript function to calculate the total stock value within a Shopify store

Get total stock value of all Shopify products

Refers to the freakdesign blog post.

Most people that need to know the total stock value are already likely to be using a third party Inventory Management System, ERP (or similar). If you want to know what your total stock value is you can grab that info via the API - let's look how.

Usage

Paste the code into the browser debug console.

@freakdesign
freakdesign / collection-ratings.liquid
Created April 11, 2016 15:53
Show a collection based summary using data from the Shopify Product Reviews App.
{% comment %}
Usage:
{% include 'collection-ratings' %}
{% include 'collection-ratings' collectionHandle:'some-handle' useAll:true %}
{% endcomment %}
{% if collectionHandle == blank %}{% assign collectionHandle=collection.handle %}{% endif %}
{% if collections[collectionHandle].products.size > 0 %}
@freakdesign
freakdesign / product-grid-item.liquid
Created January 3, 2016 03:31
Modification of the default Timber product grid item snippet so that it can show variants.
<!-- /snippets/product-grid-item.liquid :: mod by Jason at freakdesign.com.au -->
{% comment %}
<!--
This snippet is used to showcase each product during the loop,
'for product in collection.products' in collection.liquid.
If however the product has variants, we'll show the variants instead.
-->
{% endcomment %}
@freakdesign
freakdesign / select-from-hash
Last active October 29, 2018 08:00
Javascript snippet to help auto select a Shopify variant from a hash.
<script type="text/javascript">
/*
re: http://ecommerce.shopify.com/c/ecommerce-design/t/land-on-specific-variant-when-loading-product-page-147793
Assumes:
--------
* that you are calling the javascript once the select element is available
* you have a select element on the page like: