Shopify themes, liquid, logos, and UX
I want to add this field in the product grid.
See picture below.
Here is the code of the field in the product page in yellow:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
.gerundetes-element p {
background-color: #FFD700;
padding: 2px;
border-radius: 10px;
display: inline;
font-size: 20px;
}
</style>
<title>Gerundete Ecken</title>
</head>
<body>
<div class="gerundetes-element">
<p>🧑🏽"...Riecht wie {% if product.metafields.custom.riecht_wie_ %}
<b>{{ product.metafields.custom.riecht_wie_ | metafield_text}}“</b>
{% else %}
<b>eine bekannte Luxusmarke"</b>
{% endif %}</p>
</div>
</body>
</html>
check this code
{% for product in collection.products %}
<div class="product-grid-item">
<div class="gerundetes-element">
<p>🧑🏽"...Riecht wie {% if product.metafields.custom.riecht_wie_ %}
<b>{{ product.metafields.custom.riecht_wie_ | metafield_text}}“</b>
{% else %}
<b>eine bekannte Luxusmarke"</b>
{% endif %}</p>
</div>
<!-- Include other product grid elements here -->
</div>
{% endfor %}
Can you not use a Rich Text metafield to hold the HTML value?
Look how it looks now
I need the correct metafield for each product
Shopify and our financial partners regularly review and update verification requiremen...
By Jacqui Mar 14, 2025Unlock the potential of marketing on your business growth with Shopify Academy's late...
By Shopify Mar 12, 2025Learn how to increase conversion rates in every stage of the customer journey by enroll...
By Shopify Mar 5, 2025