Skip to content

Instantly share code, notes, and snippets.

@j7u7l7s
j7u7l7s / sass-buttons.scss
Created February 4, 2019 15:20
A logical and modular way of styling buttons with SCSS
.action_button {
background-color: #999;
border-color: #999;
&:hover {
background-color: lighten(#999, 10%);
border-color: lighten(#999, 10%);
}
@j7u7l7s
j7u7l7s / Tags in reg form.liquid
Created November 6, 2018 21:29
Liquid to add tags to new customer on creation + create a new tag with the company name field prefixed with 'company_'
<div id="company_name_field" class="clearfix large_form">
<label for="company_name" class="login">
Trading / Store Name - to appear on invoices and our store locator *
</label>
<input type="text" value="" name="customer[note][Company Name]" id="company_name" class="large" size="30" required />
</div>
<input type="hidden" id="processed_prospect_and_company_name" name="customer[tags]" value="Prospect"/>
<script type="text/javascript">
<script>
$(document).on('click',"#AddToCart-product-template, .buy-bar [name=add]", function() {
console.log('added');
var cartString = $('#CartCount').html();
var miniCounter = parseInt(cartString);
var qty = 1;
var id;
{% if product.variants.size > 1 %}
id = $('.variant-select-for-id option:selected').data('variant');
<script>
// (c) Copyright 2016 Caroline Schnapp. All Rights Reserved. Contact: [email protected]
// See https://docs.shopify.com/themes/customization/navigation/link-product-options-in-menus
var Shopify = Shopify || {};
Shopify.optionsMap = {};
Shopify.updateOptionsInSelector = function(selectorIndex) {
$(document).on('click','.productId', function(e){
var qty = 1;
var id = $(this).data('variant');
addItem=function(qty,id,callback) {
var params = {quantity:qty,id:id};
$.ajax({
type: 'POST',
url: '/cart/add.js',
function downloadJSAtOnload() {
var element = document.createElement("script");
element.src = "defer.js";
document.body.appendChild(element);
}
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;
@j7u7l7s
j7u7l7s / ajax-checkbox-filter.js
Created April 25, 2018 07:12
Filter products by multiple tags without refreshing the page using checkboxes
function filterProductsByTag(){
var tagList = [];
var tagUrl = '';
var initialURL = '';
$('.tagFilterBox').each( function(){
var tagName = $(this).data('tag');
if ($(this).is(':checked')){
tagList.push(tagName);
}
});
@j7u7l7s
j7u7l7s / ajax-call.js
Last active April 20, 2018 12:50
Get all products in collection via ajax.js
$.ajax({
url:'https://michele-mclaughlin-music.myshopify.com/collections/sheet-music?view=ajax',
type:'GET',
success: function(data){
var dataDump =JSON.parse(data);
console.log(dataDump);}
});
{% capture image %}{{ 'test.png' | asset_url | split:'test.png' | first }}{% endcapture %}
var srcURL = '{{ image }}';
//Swatch Script
$('#wjFilterFront option').each(function(i){
//generate the swatches and add matching data attributes to select options
var imageName = $(this).val();
var srcImage = 'https:' + window.srcURL + imageName + '.png';
srcImage.toString();
var index = i++;
var swatch = '<a class="swatch-link" href="javascript:void(0)" data-option-index="' + index.toString() +'"><img class="swatch-image" src="test.png" data-tag="' + imageName + '" ></a>';
$(window).load(function() {
$('.swatch-image').each(function() {
var srcImageError = ''; // URL Goes here
if (!this.complete || typeof this.naturalWidth == "undefined" || this.naturalWidth == 0) {
this.src = srcImageError;
}
});
});