${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
Best Sellers
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${opt.values.map((val)=>{ const selected = data.selectedValues[opt.name][0] === val ? 'selected' : ''; return `
${val}
` }).join("")}
${selectedValues[index][0]}
${function() {
const current_page = 'collection'
const force_image_size = "natural";
const product_hover_on = true;
const product_show_sale_label = true;
const product_save_type = "percent";
const badge1 = "";
const badge2 = "";
const badge3 = "";
const product_title_mobile_hide = false;
const product_title_style = "full";
const enable_collection_thumb_image = true;
const variantNames = ["color"];
const thumbMaxNum = 4;
const suffix_id = "1653716977175" || '';
const url = data.url;
const productId = data.id;
const price = Number(data.price);
const productAvailable = data.available;
const productVariants = data.variants || [];
const customTags = data.tags.split(',').filter(item => item.indexOf('custom_') !== -1);
const images = data.images || [];
const image = data.image || {};
const imageWidth = image.width;
let imageHeight = image.height;
let image2 = null;
let imageHoverOn = false;
if (force_image_size !== 'natural') {
imageHeight = imageWidth * force_image_size;
}
if (product_hover_on) {
for (let i = 1; i < images.length; i++) {
const img = images[i];
if (img.src && img.src.indexOf('video=') === -1) {
image2 = img;
imageHoverOn = true;
break;
}
}
}
let compareAtPrice = Number(data.compare_at_price);
let offRatio = data.off_ratio;
let discountMaxUrl = url;
const showFrom = data.price_min != data.price_max ? true : false;
for (let i = 0; i < productVariants.length; i++) {
const variant = productVariants[i];
if (variant.price == price && compareAtPrice < variant.compare_at_price) {
compareAtPrice = variant.compare_at_price;
offRatio = variant.off_ratio;
variant.available && (discountMaxUrl = variant.url);
}
}
const soldOutText = "Sold out";
let soldOn = false;
let saleOn = false;
let customOn = false;
if (productAvailable) {
if(customTags.length) {
customOn = true;
} else {
if (product_show_sale_label && price < compareAtPrice) {
saleOn = true;
}
}
} else {
soldOn = true;
}
const diffPrice = compareAtPrice - price;
const saveLabelContent = product_save_type == 'percent' ? (offRatio + '%') : `
${showVariants.map((item, idx) => {
let showMoreHtml = '';
if (idx == thumbMaxNum) {
showMoreHtml += `
`;
}
return `
${showMoreHtml}
`;
}()}
${customTags.map(item => {
return `
${item.replace('custom_', '')}
`;
}).join('')}
${saleOn ? saveText : soldOutText}
${badge1}
${badge2}
${badge3}
${heading}
From
${data.has_only_default_variant ?
`
` :
`
`}
${
data.options.length > 0 && `
`
}
Sorry, there are no products in this collection.