How to add 'Read more' in the Rich Text section

[Russell1232]

Hello,

Looking to add a 'Read more' and perhaps 'Read less' button to a Rich Text section in my front page store. Using Brooklyn theme. Any help is appreciated.

Thanks,

[KetanKumar]

@Russell1232 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

[Russell1232]

Hi ketankumar,

Here is my url: Caribou49.myshopify.com

Thanks so much.

[KetanKumar]

@Russell1232 

thanks 

can you please try this code

https://codepen.io/royketelaar/embed/avWxve?theme-id=light#:~:text=CodePen%20Embed%20%2D%20Read%20mo....

https://codepen.io/royketelaar/pen/avWxve

[Russell1232]

Hi KetanKumar,

There is no place to add the html code in the Rich Text section, but I created a custom html section and applied it there. However, I am not getting the desired results. I copy and pasted the html code in the 'HTML section' however it does seem to work. (See below) You can see that the 'Read more' text is present and so is all the text. When I click on the 'Read more' text it simply refreshes the web page. Perhaps I am doing something wrong. Please let me know what you think.

[KetanKumar]

@Russell1232 

can you please user HTML, CSS and javascript same as demo

[Russell1232]

Thank you @KetanKumar . I am just not sure where to apply the html, css and javascript. Still learning. My apoligies. Please let me know how to apply all these codes.

[KetanKumar]

@Russell1232 

It can be done by doing some code customization. please send me a personal message and we can discuss what you'd like

[Russell1232]

Hi KetanKumar,

I was able to add the .js code to theme.js.liquid and the css code to theme.scss.liguid. I also added the html text to a new custom html section. It looks pretty good except when I click on read more or read less, which function well, the page refreshes to the top thereby losing one's place in the text in question. Any ideas?

Best,

[KetanKumar]

@Russell1232 

can you please share further issue screenshot or video

[Russell1232]

Hi KetanKumar,

I will send you the video link via pm.

Thanks.

[KetanKumar]

@Russell1232 

ok i will check and update

[Dimitrios22]

Hello,

I'm also trying to add a read more button in a text section (brooklyn theme). Can anyone help me with this code? I tried some, but they don't work...

Much appreciated!

[KetanKumar]

@Dimitrios22 

can you please sent store URL and issue images