').addClass('productsMetafieldWrapper'); const validMetafieldTypes = [ 'single_line_text_field', 'multi_line_text_field', 'list.single_line_text_field', ]; //only allow the type whose value we can get root level -- for eg : metafield.value for (let i = 0; i < metafieldNameSpaceAndKeys.length; i++) { let metafieldData = metafieldNameSpaceAndKeys[i]; if ( metafieldData.hasOwnProperty('showOnProductCard') || metafieldData.hasOwnProperty('showOnModal') ) { if (origin == 'PRODUCT_CARD' && !metafieldData.showOnProductCard) { continue; } else if ( origin == 'PRODUCT_VARIANTS_MODAL' && !metafieldData.showOnModal ) { continue; } } let productMetafieldAccessKey = `metafield_${metafieldData?.namespace}_${metafieldData?.key}`; let productMetafieldData = {}; // variant level metafield if (metafieldData.origin == 'variant' && selectedVariant) { productMetafieldData = selectedVariant?.[productMetafieldAccessKey] || {}; } else { // product level metafield productMetafieldData = productData?.[productMetafieldAccessKey] || {}; } const isTaxMessage = metafieldData?.namespace === 'custom_tax_message' && metafieldData?.key === 'render'; if ( validMetafieldTypes.includes(productMetafieldData?.type) || isTaxMessage ) { let metafieldContainer = gbb.$('

').addClass('metafieldContainer'); let metafieldLabel = gbb.$('

').addClass('metafieldLabel'); metafieldLabel.text(metafieldData?.label); let metafieldValue = gbb .$('

') .attr('metafield-key', metafieldData?.key); if (metafieldData?.key === 'produkt_eignung') { metafieldContainer.addClass('produktEignungContainer'); } if (metafieldData.origin == 'variant') { metafieldValue.addClass(`variant_metafield_${metafieldData?.key}`); } else { metafieldValue.addClass(`product_metafield_${metafieldData?.key}`); } if (isTaxMessage) { metafieldValue.text(gbbCustomT('taxMessage')); } else if (metafieldData?.key === 'product_highlights') { const rawHighlights = productMetafieldData?.value || ''; const highlightsContainer = gbb.$('

').html(rawHighlights); const highlightIconSvg = ''; highlightsContainer.find('p').each(function () { const paragraph = gbb.$(this); const paragraphHtml = paragraph.html(); paragraph .css({ display: 'flex', alignItems: 'flex-start', gap: '6px', margin: '0 0 8px 0', }) .html( `${highlightIconSvg}${paragraphHtml}` ); }); metafieldValue.html(highlightsContainer.html()); } else if (metafieldData?.key === 'highlight_feld_inhalt') { metafieldContainer.addClass('highlightMetafieldContainer'); const iconImg = gbb .$('') .attr( 'src', 'https://www.viktilabs.de/cdn/shop/files/Icon-bulb.png?v=1702591469' ) .addClass('highlightMetafieldIcon'); const contentWrapper = gbb .$('

') .addClass('highlightMetafieldContent'); metafieldValue.text(productMetafieldData?.value || ''); contentWrapper.append(metafieldLabel); metafieldContainer.append(iconImg); metafieldContainer.append(contentWrapper); metafieldContainer.data('contentWrapper', contentWrapper); } else if (metafieldData?.key === 'badges') { let values = productMetafieldData?.value || []; if (typeof values === 'string') { try { values = JSON.parse(values); } catch (e) { values = [values]; } } if (!Array.isArray(values)) { values = [values]; } const listWrapper = gbb.$('

').addClass('metafieldList'); values.forEach((val) => { listWrapper.append( gbb.$('

').addClass('metafieldListItem').text(val) ); }); metafieldValue.append(listWrapper); } else { metafieldValue.text(productMetafieldData?.value); } if (metafieldData?.key === 'highlight_feld_inhalt') { const contentWrapper = metafieldContainer.data('contentWrapper'); contentWrapper.append(metafieldValue); } else { metafieldContainer.append(metafieldLabel); metafieldContainer.append(metafieldValue); } metafieldWrapper.append(metafieldContainer); } } if (selectedVariant?.unitPriceMeasurement) { const price = Number(selectedVariant.price) / 100; const unitData = selectedVariant.unitPriceMeasurement; const quantity = Number(unitData.quantityValue); const quantityUnit = unitData.quantityUnit; const referenceValue = Number(unitData.referenceValue) || 1; const referenceUnit = unitData.referenceUnit || ''; let normalizedQuantity = quantity; if (quantityUnit === 'G') { normalizedQuantity = quantity / 1000; // g → kg } else if (quantityUnit === 'ML') { normalizedQuantity = quantity / 1000; // ml → l } if (price && normalizedQuantity > 0) { const unitPrice = price / normalizedQuantity; let unitPriceContainer = gbb .$('

') .addClass('metafieldContainer unitPriceContainer'); let value = gbb .$('

') .addClass('unitPriceValue') .text( `${gbb.utility.formatPrice(unitPrice.toFixed(2) * 100)} / ${referenceUnit}` ); unitPriceContainer.append(value); metafieldWrapper.append(unitPriceContainer); } } const isInStock = selectedVariant?.availableForSale; if (isInStock) { const stockMessage = gbb .$('

') .addClass('stockMessage') .text(gbbCustomT('inStock')); const taxContainer = metafieldWrapper .find('.product_metafield_render') .closest('.metafieldContainer'); if (taxContainer.length) { taxContainer.append(stockMessage); } } if (selectedVariant?.sku?.startsWith('BUN')) { metafieldWrapper.attr('data-hide-bundle', 'true'); const productItem = metafieldWrapper.closest('.gbbProductItem'); if (productItem.length) { productItem.attr('data-hide-bundle', 'true'); } } if (origin === 'PRODUCT_CARD') { setTimeout(() => { const productItem = metafieldWrapper.closest('.gbbProductItem'); if (!productItem.length) return; const actionContainer = productItem .find('.gbbProductActionContainer') .first(); const priceContainer = actionContainer .find('.gbbProductItemPricesContainer') .first(); const buttonWrapper = actionContainer .find('.gbbProductButtonWrapper') .first(); const unitPriceContainer = metafieldWrapper .find('.unitPriceContainer') .first(); const taxMessageContainer = metafieldWrapper .find('.product_metafield_render') .closest('.metafieldContainer') .first(); if (!actionContainer.length) return; if (unitPriceContainer.length && priceContainer.length) { unitPriceContainer.insertAfter(priceContainer); } else if (unitPriceContainer.length && buttonWrapper.length) { unitPriceContainer.insertBefore(buttonWrapper); } else if (unitPriceContainer.length) { actionContainer.append(unitPriceContainer); } if (!taxMessageContainer.length) return; if (unitPriceContainer.length) { taxMessageContainer.insertAfter(unitPriceContainer); } else if (priceContainer.length) { taxMessageContainer.insertAfter(priceContainer); } else if (buttonWrapper.length) { taxMessageContainer.insertBefore(buttonWrapper); } else { actionContainer.append(taxMessageContainer); } }, 0); } return metafieldWrapper; } catch (error) { gbb.utility.debugError('error in prepareHTMLforProductMetafields', error); } }

Free shipping from 49€ within the EU and Switzerland

Sign up for the Viktilabs email newsletter