Shopify themes, liquid, logos, and UX
Hello!
I was wondering if someone can advise how to add an image on a product page then link that image to pdf.
So in my case, I want to link an image with another file, a step-by-step how to guide.
The image is separate from the file I will be attaching it to, so i can alt tag the image.
I am using superstore version 5.1.0
Any help would be very much appreciated!
Solved! Go to the solution
This is an accepted solution.
Hi @TUB ,
If you use Dawn theme. May I suggest to update code these steps:
1. Go to Settings-> custom data -> Products
2. Add 2 metafields
- Name: icon, Type: files(images)
- Name: pdf, Type: files( Accept all file types)
3. Go to each product to add data to these fields
4. Add code below to anywhere that you would like to show
{% if product.metafields.custom.icon.value and product.metafields.custom.pdf.value %}
<a href="{{ product.metafields.custom.pdf.value.url }}" target="_blank">
<img src="{{ product.metafields.custom.icon.value| image_url: width: 50}}" alt="" />
</a>
{% endif %}
This is an accepted solution.
Amazing! I am using superstore theme, but I will give it a shot.
So after I have created the metafield, do I paste the code in custom liquid on the template product page?
Thank you!
This is an accepted solution.
Hi @TUB ,
If you use Dawn theme. May I suggest to update code these steps:
1. Go to Settings-> custom data -> Products
2. Add 2 metafields
- Name: icon, Type: files(images)
- Name: pdf, Type: files( Accept all file types)
3. Go to each product to add data to these fields
4. Add code below to anywhere that you would like to show
{% if product.metafields.custom.icon.value and product.metafields.custom.pdf.value %}
<a href="{{ product.metafields.custom.pdf.value.url }}" target="_blank">
<img src="{{ product.metafields.custom.icon.value| image_url: width: 50}}" alt="" />
</a>
{% endif %}
This is an accepted solution.
Amazing! I am using superstore theme, but I will give it a shot.
So after I have created the metafield, do I paste the code in custom liquid on the template product page?
Thank you!
Yes, you can do it
Hey Community! It’s time to share some appreciation and celebrate what we have accomplis...
By JasonH Nov 14, 2024In today’s interview, we sat down with @BSS-TekLabs to discuss practical strategies for...
By JasonH Nov 13, 2024The year-end shopping spree is around the corner! Is your online store ready for the ...
By JasonH Nov 10, 2024