Display the Files with the file name and its url by using metafields

[Hugasme]

Hi

I have 100 files i need to show 50 files this as table in page template

How to show this in page with file name, and its url for download

File names are different

What is the way do it?

Thanks.

[MetafieldsGuru]

Hi there,

Sasha here from Metafields Guru team.

It’s totally doable, but a major theme customization is required. Shopify won’t display metafields content on the product page unless you add a proper Liquid code snippet. Here’s the link to a great step-by-step tutorial on how to customize the product page template and display a metafield on the storefront. However, working with the file reference metafields is slightly different.

Let’s say you’ve created a file reference metafield with the following settings:

If you copy the plain Liquid code:

{{ product.metafields.set_test.file.value }}

and add it to the product page template, you’ll see the following output:

That’s because he payload returned by Liquid is a complete “generic file” object.

Obviously, Liquid can’t convert an object into a valid HTML to be displayed on the storefront. But we can do that. Basically, the idea is to get the essential details from that generic file object and combine them with the HTML elements. Here’s the advanced version of the code to make the file metafield visible:

{% assign file_object = product.metafields.set_test.file.value %} 
{% if file_object != blank %} 
 
  {% assign file_url = file_object.url %}
  {% assign file_name_with_shopify_extension = file_url | split: '/' | last %} 
  {% assign file_name = file_name_with_shopify_extension | split: '?' | first %} 
   
    

    {{ file_name }}
   

   
 

{% endif %}

With the updated code, you’ll get a proper link to the related page:

And just like that, you can browse through all the “file” metafields and display them on the product page.

Hope this helps!

P.S. If you feel like this task is too complicated for you, you may want to consider hiring a Shopify Expert and delegating the job to this person.

Best regards,

Sasha Kachkovskyi

Co-founder and CEO

256 Development

[Hugasme]

Thanks for answer Yeah it will works for the product template but i need a solution in page template.

Example

I uploaded 10 pdf files in files settings with the Name format of

KB_Sector_AS

KB_Division_SD like this i have 10 even 100

Now i need to show this files name and its links

Can this possible in Page template

Thanks.

[hockey2112]

This works great for a single file field, thanks! How can I make it work for a multiple-file field though? Is there a “foreach” that needs to wrap around this code, or something like that?

[fideas]

For anyone else having trouble getting this to work with multiple pdfs/files, I have a working solution:

{% assign file = product.metafields.custom.technical_datasheet.value %}

{% for field in file %}
{% assign file_output = file %}
{% assign file_url = field.url %}
{% assign file_name_with_shopify_extension = file_url | split: '/' | last %} 
{% assign file_name = file_name_with_shopify_extension | split: '?' | first %} 
**Download:** {{ file_name }}

{% endfor %}

I adapted this from the following page by @MetafieldsGuru : https://support.metafields.guru/support/solutions/articles/44001935862-how-to-add-custom-downloadable-files-using-metafields-

[theshopdude]

Thanks for this post!

[anciwasim]

Thank you you solved my Problem!!!