How to create a 'Read More' button in the Lorenza theme?

Hello,

I’m using the Lorenza theme. How do I create a “read more” button on my product descriptions? I want the product description to show partially and then fade to a “Read more” button like in the attached photo. Thank you.

Hello,

This is going to require some JavaScript. I am not sure of the file structure for your theme but we could figure out what the right file is as most people follow certain naming conventions when creating themes. What you will want to do is download a copy of your theme for a fallback. In that same dropdown where you download your theme you will see edit code. There is a little search bar and what you are looking for is product. The file may be named something like product.liquid.

You can confirm you have the right page by clicking anywhere you see text and then click CTRL F. This will pop up a search menu at the bottom. Type in product-form__inner. You may want to copy and paste just to make sure you have it typed out correctly. If you found it you are on the right page. Now what you will want to do is enter the custom Javascript. If you have a {schema} section located at the bottom you’ll want to place this code just above it. I will show you an example of where to put it:

Here is the code to put in that place:


Hopefully this works for you.

Thanks for your reply. I cannot find the sections you mentioned but I have attached image of the sections in my theme. Which section should I put the code in?

It is more likely located in your templates folder. Do you have anything there that has product in the name? The main-collection-product-grid shouldn’t be it.

Hi @CraftAntler ,

Crystal here from Fluorescent!

While this is a third-party code customization that isn’t directly supported, I’m happy to show you which file you will need to edit. The file that you would be looking to change, is called the main-product.liquid file found in the Sections folder. The product.json template in the Templates folder, is likely not the one you want to edit in this case.

I hope that helps, and if you need anything else please reach out to us in our Help Centre.

Crystal C
Customer Support & Quality Assurance Specialist, Fluorescent.co