Displaying the brand logo of a product adds a nice touch and trust points to any website. We store the URL of the brands logo as a metafield on Shopify products. Use this snippet on your Product Details Page (either directly in the Template or Product Section) to render the logo image.
Create a new snippet called partbot-brand-logo.liquid
{% if product.metafields.partbot.brand_logo_url %}
<div class="h-6 w-[120px] relative">
<img src="{{ product.metafields.partbot.brand_logo_url.value }}" class="h-full w-full object-contain object-left" width="120px" height="auto" alt="product.vendor" />
</div>
{% endif %}We’ve added TailwindCSS class names as an opinionated example. You’ll want to adjust the image size and styles to suit your theme and design needs.