Skip to content

Instantly share code, notes, and snippets.

@DanWebb
DanWebb / format-date.js
Created July 14, 2017 11:54
International date format
export default date => {
const monthNames = [
'Jan',
'Feb',
'Mar',
'Apr',
'May',
'Jun',
'Jul',
'Aug',
@DanWebb
DanWebb / format_money.js
Last active July 19, 2017 14:12
Format a value to display as a monetary value
export default (amount, currency) => {
const currencies = {
AFN: '؋',
ARS: '$',
AWG: 'ƒ',
AUD: '$',
AZN: '₼',
BSD: '$',
BBD: '$',
BYR: 'p.',
@DanWebb
DanWebb / sale_percentage.liquid
Last active October 27, 2021 16:11
Add a percentage sale to an item listing (ex: 20% off) based off it's compare at price and actual price
{% comment %}
Get a products sale percentage based off it's compare_at_price vs it's price
Example usage:
{% include 'sale_percentage' with product %} Off
Outputs for a product with a compare at price of £10 and a price of £5:
"50% Off"
{% endcomment %}
@DanWebb
DanWebb / new_item.liquid
Last active October 23, 2015 07:50
Display whether a product or is new or not. Could also apply to other objects that have the created_at property.
{% comment %}
Get the unix time between today and the date the product was created.
If there's less than 30 days (2592008) between the two times display it as new.
Note: "times: 1" is used to make sure the timestamp is an int not a string
Example usage:
{% include 'new_item' with product %}
@DanWebb
DanWebb / form_obj.js
Created August 28, 2015 11:22
Make key/value pairs from form elements based on name and value attributes
var obj = {};
$('form').find('input, select, textarea').each(function() {
obj[this.name] = this.value;
});
// Or create an object based on a specific group of form elements
var address = {};
$('form').find('[name^="address"]').each(function() {
address[this.name.replace('address[','').replace(']','')] = this.value;
});
@DanWebb
DanWebb / currency_symbol.liquid
Last active October 23, 2015 07:20
Get a shops currency symbol with liquid
{{ 0 | money | remove: '0' | remove: '.' | strip_html }} = '£' or whatever currency your shop is set to
<!-- WARNING: the following will not work -->
{{ shop.currency }} = the 3 letter currency code i.e. 'GBP' but we want the symbol (£)
{{ shop.money_format }} = '£{{amount}}'
{{ shop.money_format | remove: '{{amount}}' }} = error because of the curly braces
{{ shop.money_format | remove: '{' | remove: 'amount' | remove: '}' }} = error (even a single closing curly brace will error)
{{ shop.money_format | slice: 1 }} === 's'?
{{ shop.money_format | truncate: 1 }} === '...'?
@DanWebb
DanWebb / styled-ul
Last active February 5, 2018 08:06
Style ol and ul numbers or bullets separately
ul {
list-style: none;
padding-left: 1.1225em;
}
ul li {
position: relative;
padding-bottom: 3px;
}
@DanWebb
DanWebb / excerpt_image.liquid
Created August 26, 2015 07:50
Extract an image src from an article excerpt
{% comment %}
This include requires you to pass in the an article excerpt
which contains a single image.
Example: {% include 'excerpt_image' with article.excerpt %}
{% endcomment %}
{% assign src = excerpt_image | split: 'src="' %}
@DanWebb
DanWebb / line_item_fulfillment.liquid
Created August 25, 2015 06:44
Get the fulfillment status of an individual line_item (rather than order)
{% assign fulfillment_status = 'unfulfilled' %}
{% if line_item.fulfillment.tracking_company > '' %}
{% assign fulfillment_status = 'fulfilled' %}
{% endif %}
@DanWebb
DanWebb / address_summary.liquid
Last active April 18, 2023 07:18
Customer Addresses - Dependant on: {{ 'shopify_common.js' | shopify_asset_url | script_tag }} being included in the themes head. Not dependant on {{ 'customer_area.js' | shopify_asset_url | script_tag }} to avoid being restricted to just toggling visibility of address forms rather than opening a popup or anything else.
{% comment %}
This include requires you pass in two variables.
{{ add }}: The address being listed
{{ edit }}: Boolean value if the address can be edited on this page
Example:
{% for address in customer.addresses %}
{% include 'address_summary', add: address, edit: true %}
{% endfor %}