This is my code in the section:
<meta itemprop="url" content="{{ shop.url }}{{ product.url }}">
<meta itemprop="image" content="https:{{ product.featured_image.src | img_url: 'grande' }}">
<meta itemprop="name" content="{{ product.title }}">
<meta itemprop="description" content="{{ product.description | strip_html | truncatewords: 15}}">
{% for field in product.metafields.areviews %} {{ field | last }} {% endfor %}
<meta itemprop="brand" content="{{ product.vendor }}"><div itemprop="offers" itemscope itemtype="
http://schema.org/Offer">
<meta itemprop="priceCurrency" content="{{ shop.currency }}">
<meta itemprop="price" content="{{ variant.price | divided_by: 100.00 }}">
<meta itemprop="url" content="{{ shop.url }}{{ product.url }}">
</div></div>
{% if section.settings.spd_style == "pd_center_img" %}
{% include 'product-details-center-image' %}
{% elsif section.settings.spd_style =="pd_variabale" %}
{% include 'product-variabale' %}
{% elsif section.settings.spd_style =="pd_sidebar" %}
{% include 'product-details-sidebar' %}
{% elsif section.settings.spd_style =="pd_sticky" %}
{% include 'product-details-sticky' %}
{% endif %}
{% comment %}
To take advantage of a callback on the select dropdown, add option_selection.js
and customize the JS in timber.productPage as needed.
Currently, timber.productPage does the following:
- Hides your <select> tag from above
- Breaks out the product variants into separate product options, if more than one exists
- Generates a <select> tag for each product option
- Enables/disables elements based on variant availability
Callback notes:
- Keep the callback available to the global scope (window.selectCallback) so that advanced
addons can override it.
{% endcomment %}
{{ 'option_selection.js' | shopify_asset_url | script_tag }}
<script>
var selectCallback = function(variant, selector) {
// BEGIN SWATCHES
if (variant) {
var form = jQuery('#' + selector.domIdPrefix).closest('form');
for (var i=0,length=variant.options.length; i<length; i++) {
var radioButton = form.find('.swatch[data-option-index="' + i + '"] :radio[value="' + variant.options[i] +'"]');
if (radioButton.size()) {
radioButton.get(0).checked = true;
}
}
}
// END SWATCHES
{% if section.settings.show_sku %}
if (variant) {
$('.engoj-variant-sku').text(variant.sku);
}
else {
$('.engoj-variant-sku').empty();
}
{% endif %}
var quantity = 1,
totalPrice;
if (variant) {
if (variant.available) {
// Selected a valid variant that is available.
$('.engoj-btn-addtocart').removeClass('disabled').removeAttr('disabled').val('Add to Cart').fadeTo(200,1);
} else {
// Variant is sold out.
$('.engoj-btn-addtocart').val('Sold Out').addClass('disabled').attr('disabled', 'disabled').fadeTo(200,0.5);
}
quantity = parseInt($('#Quantity').val(), 10);
totalPrice = variant.price * quantity;
if ( variant.compare_at_price > variant.price ) {
$('.enj-product-price').html(Shopify.formatMoney(variant.price, window.money_format));
$('.enj-product-price-compare').html(Shopify.formatMoney(variant.compare_at_price, window.money_format));
} else {
$('.enj-product-price').html(Shopify.formatMoney(variant.price, window.money_format));
$('.enj-product-price-compare').html(Shopify.formatMoney(variant.compare_at_price, window.money_format));
}
} else {
// variant doesn't exist.
$('.engoj-btn-addtocart').val('Unavailable').addClass('disabled').attr('disabled', 'disabled').fadeTo(200,0.5);
}
/*begin variant image*/
if (variant && variant.featured_image) {
var originalImage = jQuery(".engoj_img_main");
var newImage = variant.featured_image;
var element = originalImage[0];
Shopify.Image.switchImage(newImage, element, function (newImageSizedSrc, newImage, element) {
var $el = $(element);
$el.attr('src', newImageSizedSrc);
$(".engoj-nav-item:eq(0)").trigger('click');
$('.zoomLens').css('background-image','url("'+newImageSizedSrc+'")');
});
}
/*end of variant image*/
}
jQuery(function($) {
new Shopify.OptionSelectors('productSelect', {
product: {{ product | json }},
onVariantSelected: selectCallback,
enableHistoryState: true
});
// Add label if only one product option and it isn't 'Title'. Could be 'Size'.
{% if product.options.size == 1 and product.options.first != 'Title' %}
$('.selector-wrapper:eq(0)').prepend('<label for="productSelect-option-0">{{ product.options.first | escape }}</label>');
{% endif %}
// Hide selectors if we only have 1 variant and its title contains 'Default'.
{% if product.variants.size == 1 and product.variants.first.title contains 'Default' %}
$('.selector-wrapper').hide();
{% endif %}
});
</script>
{% schema %}
{
"name": "Product detail page",
"settings": [
{
"type": "select",
"id": "spd_style",
"label": "Select Layout Style",
"options": [
{
"value": "pd_center_img",
"label": "Product Center Image"
},
{
"value": "pd_variabale",
"label": "Product Variabale"
},
{
"value": "pd_sidebar",
"label": "Product Sidebar"
},
{
"value": "pd_sticky",
"label": "Product Sticky"
}
],
"default": "pd_variabale"
},
{
"type": "header",
"content": "Product Extended Style"
},
{
"type": "select",
"id": "style_page",
"label": "Select Style",
"options": [
{
"value": "left",
"label": "Style Thumbnail Left"
},
{
"value": "right",
"label": "Style Thumbnail Right"
}
],
"default": "left",
"info": "*only when you choose Layout Style 'Product Variabale'"
},
{
"type": "paragraph",
"content": "Please scroll to bottom and click add service box to add content for servicebox"
},
{
"type": "header",
"content": "Product Sidebar Style"
},
{
"type": "select",
"id": "style_sidebar",
"label": "Select Style",
"options": [
{
"value": "left",
"label": "Style Sidebar Left"
},
{
"value": "right",
"label": "Style Sidebar Right"
},
{
"value": "no_sidebar",
"label": "Style No Sidebar"
}
],
"default": "left",
"info": "*only when you choose Layout Style 'Product Sidebar'"
},
{
"type": "header",
"content": "Config"
},
{
"type": "checkbox",
"id": "show_rating",
"label": "Show rating star",
"default": true
},
{
"type": "checkbox",
"id": "show_size-guide",
"label": "Show size guide",
"default": true
},
{
"type": "checkbox",
"id": "show_sdes",
"label": "Show summary description",
"default": true
},
{
"type": "checkbox",
"id": "show_engo_listul",
"label": "Show promo list",
"default": true
},
{
"type": "checkbox",
"id": "show_social_share",
"label": "Show social share",
"default": true
},
{
"type": "checkbox",
"id": "show_quantity",
"label": "Show quantity box",
"default": true
},
{
"type": "checkbox",
"id": "show_sku",
"label": "Show SKU",
"default": true
},
{
"type": "checkbox",
"id": "show_cate",
"label": "Show Categories",
"default": true
},
{
"type": "checkbox",
"id": "show_tag",
"label": "Show Tag",
"default": true
},
{
"type": "header",
"content": "Description Tab"
},
{
"type": "checkbox",
"id": "enable_description_tab",
"label": "Enable?",
"default": true
},
{
"type": "text",
"id": "destab_title",
"label": "Title",
"default": "Description"
},
{
"type": "header",
"content": "Addition Tab"
},
{
"type": "checkbox",
"id": "enable_addition_tab",
"label": "Enable?",
"default": true
},
{
"type": "text",
"id": "addtab_title",
"label": "Title",
"default": "Additional Information"
},
{
"type": "textarea",
"id": "addtab_content",
"label": "Content"
},
{
"type": "header",
"content": "Review Tab"
},
{
"type": "checkbox",
"id": "enable_review_tab",
"label": "Enable?",
"default": true
},
{
"type": "paragraph",
"content": "After enabling reviews you will need to install the free [Shopify Product Reviews](https:\/\/apps.shopify.com\/product-reviews) app."
},
{
"type": "text",
"id": "reviewtab_title",
"label": "Title",
"default": "Review"
},
{
"type": "header",
"content": "Related Product"
},
{
"type": "checkbox",
"id": "enable_related_product",
"label": "Enable?",
"default": true
},
{
"type": "text",
"id": "related_product_title",
"label": "Title",
"default": "Related products"
},
{
"type": "range",
"id": "related_product_limit",
"label": "Limit products",
"min": 2,
"max": 50,
"step": 1,
"default": 8
}
],
"blocks": [
{
"type": "servicebox",
"name": "Service Box",
"settings": [
{
"type": "text",
"id": "title_box",
"label": "Title Box",
"default": "FREE SHIPPING"
},
{
"type": "text",
"id": "content_box",
"label": "Content Box",
"default": "Only oder from $ 230"
}
]
}
],
"presets": [
{
"name": "Product detail Page",
"blocks": [
]
}
]
}
{% endschema %}
Where should i place this snippet?
