Skip to content

Instantly share code, notes, and snippets.

@zoerooney
Last active August 15, 2023 02:21
  • Star 6 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save zoerooney/156af5751fa2580fa2b5 to your computer and use it in GitHub Desktop.
Shopify minicart on non-Shopify site
<script>
jQuery.ajax({
type: 'GET',
url: 'http://mysite.myshopify.com/cart.json',
dataType: 'jsonp',
success: function(data) {
var item_count = data['item_count'];
var total_price = data['total_price']/100;
//If there are items in cart
if ( item_count > 0 ) {
// cart count
jQuery('.cart-count').text(item_count);
// mini cart data
jQuery('.mini-cart').attr('id','mini-cart');
jQuery('.mini-cart-subtotal .price').text( '$' + total_price.toFixed(2) );
var cart_list = [];
for( var i = 0; i < item_count; i++ ){
if ( data['items'][i]['id'] != null ) {
var item_id = data['items'][i]['id'];
var product_title = data['items'][i]['product_title'];
// var product_title = data['items'][i]['title'];
var product_handle = data['items'][i]['handle'];
var quantity = data['items'][i]['quantity'];
var line_price = data['items'][i]['price']/100;
var url = data['items'][i]['url'];
var image_url = data['items'][i]['image'];
var variants = data['items'][i]['variant_options'];
if ( product_title == 'Gift Wrap' ) {
var product_url = product_title;
} else {
var product_url = '<a href="http://mysite.myshopify.com' + url + '">' + product_title + '</a>';
}
var options = [];
for ( var o = 0; o < variants.length; o++ ) {
var selected = data['items'][i]['variant_options'][o];
if ( selected !== 'Default Title' ) {
options.push( selected + '<br>' );
}
}
var selected_options = options.join('');
cart_list.push('<div class="row mini-cart-product"><div class="col span_3 mini-image"><div class="product_image"><img src="' + image_url + '" alt="' + product_title + '" /></div></div><div class="col span_6">' + product_url + '<br>' + selected_options + '</div><div class="col span_3 text-right">$'+ line_price.toFixed(2) +'<br>x ' + quantity + '<input type="hidden" id="updates_' + item_id + '" value="' + quantity + '" /></div></div>');
} //endif
} // endfor
jQuery('.mini-cart-items').append( cart_list.join('') );
}
}
});
</script>
<div class="mini-cart">
<form action="//mysite.myshopify.com/cart" method="post">
<div class="mini-cart-items">
</div>
<div class="mini-cart-subtotal">
<div class="col span_7 pull-left">
<h3>SUBTOTAL</h3>
</div>
<div class="col span_5 text-right">
<span class="price"></span>
</div>
</div>
<div class="row text-right cart-buttons-row">
<a href="//mysite.myshopify.com/cart">View cart</a>
<input type="submit" id="checkout" name="checkout" value="Check Out">
</div>
</form>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment