Download button

[Jesselia]

Hi,

I am having some trouble with a code and I could really use some of your help!

On my Shopify website I have 6 different collection.  One of the collections is called“Free Wallpaper” and I want customers to be able to download free wallpaper from there without having to go through a check out as the wallpaper is free.

I want there to be several different wallpapers and the customer can choose which one they want and click on the download button.

I uploaded the wallpapers as “Products” and tagged them as “downloadable” and put them on $0.00 and removed the “physical product.”

I used the Debutify version 4.8.0 and not the Dawn Theme. I followed a guide for the dawn theme thinking it wouldn’t be that different. The video says that in “section”there is a main-product.liquid file whoever I can’t find that one.

I can only find product-template.liquid in "Snippets" , product-template.liquid in “Sections" and product.json in Templates - which one do I need to choose?

I have tried these codes:

  Here’s a summary of what we have tried so far to replace the "Add to Cart" button with a "Download" button for free wallpapers:

1. Added a "downloadable" Tag:
• You added a tag called "downloadable" to the product in Shopify's admin to help differentiate products that should have a download button instead of an "Add to Cart" button.
2. Modify the Button Code Logic:
   • If the product had the tag "downloadable," it would show a download link instead of the "Add to Cart" button.
• We tried modifying the code in the relevant Liquid file to include a conditional check:
• Specifically, we used this condition: {%- if product.tags contains 'downloadable' -%} to determine which button should be displayed.
3. Inserted a Download Button:
   • Example URL: https://cdn.shopify.com/s/files/1/0801/8136/3023/files/Fireflyelegantfountainpenonpaper_magical43701....
• For products with the "downloadable" tag, we inserted an <a> tag linking to the file URL directly:
• This button would replace the original "Add to Cart" button when the condition was met.
4. Code Debugging Attempts:
• To confirm if the conditional statement was being executed properly, we suggested adding visible indicators (<p> tags) to see which condition was being triggered on the storefront.
5. Placement and File Corrections:
• We ensured that the conditional code was placed where the original "Add to Cart" button code was located.
• Made sure to edit the correct files, which are typically product-template.liquid in sections or snippets depending on the theme.
6. Issues Encountered:
• Despite these changes, the "Add to Cart" button continued to display for the "downloadable" product

What am I doing wrong or missing?😭😭

Thank you!!

[Guleria]

Hello @Jesselia ,

You need to check in file snippets -> buy-buttons.liquid

{{ 'products.product.add_to_cart' | t }}

Thanks
 

[Jesselia]

could. you please elaborate a bit?😭

[Sandy-Stoq]

@Jesselia 👋 Totally understand that it'd be easier for the customer to download files for free without going through checkout - but I think using a checkout flow and a digital downloads app (like ours - Filemonk) might be a better experience for you and for your customers.

1. It's super easy to get started - all you need to do is upload your files and link them to products. Filemonk handles everything else.
2. Customers get instant access to their downloads immediately after checkout - via email and through a "Download" button on Thank you page.
3. No coding required whatsoever, and 24*7 help.

And the best part is - you can track the number of downloads and orders, giving you insight into how well your free products are doing and expand on them to bring more customers in. 🙂