Skip to content

Instantly share code, notes, and snippets.

Avatar

Shopify Partners shopifypartners

View GitHub Profile
View four-smart-reasons-to-embed-shopify-store-html-container-element.js
client.fetchProduct('your-product-id').then(function(product) {
var html =
"<img class='product__image' src='" + product.selectedVariantImage.src + "' >" +
"<h2 class='product__title'>" + product.title + "</h2>" +
"<a class='product__buy' href='" +
product.selectedVariant.checkoutUrl(1) +
"'>Buy Now!</a>";
$('#product-1').html(html);
View four-smart-reasons-to-embed-shopify-store-updates.js
var variantSelectors = generateSelectors(product);
$('.variant-selectors').html(variantSelectors);
function generateSelectors(product) {
var elements = product.options.map(function(option) {
return '<select name="' + option.name + '">' + option.values.map(function(value) {
return '<option value="' + value + '">' + value + '</option>';
}) + '</select>';
});
View four-smart-reasons-to-embed-shopify-store-AddVarianttoCart.js
var $cartLineItems = checkout.lineItems.map(function (lineItem, index) {
var $lineItemTemplate = $(lineItemEmptyTemplate);
var itemImage = lineItemImages[lineItem.variant_id];
$lineItemTemplate.find('.cart-item__img').css('background-image', 'url(' + itemImage + ')');
$lineItemTemplate.find('.cart-item__title').text(lineItem.title);
$lineItemTemplate.find('.cart-item__variant-title').text(lineItem.variant_title);
$lineItemTemplate.find('.cart-item__price').text(formatAsMoney(lineItem.line_price));
$lineItemTemplate.find('.cart-item__quantity').attr('value', lineItem.quantity);
$lineItemTemplate.find('.quantity-decrement').attr('data-variant-id', lineItem.variant_id);
$lineItemTemplate.find('.quantity-increment').attr('data-variant-id', lineItem.variant_id);
View dirty-css-hacks-for-responsive-email-content-stacking.html
<table> <!--“Desktop” width: 600px - 300*2-->
<tr>
<td class=”col” width=”300”>...</td>
<td class=”col” width=”300”>...</td>
</tr>
</table>
View dirty-css-hacks-for-responsive-email-content-switching.html
<table> <!--“Desktop” width — 600px - 300*2-->
<tr>
<td class=”sub-col” width=”300”>...</td>
<td class=”main-col” width=”300”>...</td>
</tr>
</table>
You can’t perform that action at this time.