Show More button with Rich Text

I followed tut below, works fine with plain text, but doesn’t seems to work with rich text. only see html code
https://support.wix.com/en/article/corvid-tutorial-creating-a-show-more-link

Did I mistake or isn’t it possible with wix.

See (hidden) page: https://www.sunandgrapes.com/huurhuizen-detail/casa-emma—studio

It would be good to see your code used here so we can know what version you are working with.

It sounds like you are simply using the static option of this tutorial, which is to simply write all of your needed text into the text box element.
https://support.wix.com/en/article/corvid-tutorial-creating-a-show-more-link#working-with-static-text-1

Then you would have simply added a text element to your page and added all your needed text into this text box.

So, note that this is just a normal text box and whatever you type in there will be shown on your website.

To use rich text, you would need to use a rich text box which is only available to you as an user input, which can’t be used with this tutorial.

You should therefore look at using the dynamic option of this tutorial and have all your rich text saved in rich text fields in your dataset.
https://support.wix.com/en/article/corvid-tutorial-creating-a-show-more-link#working-with-dynamic-text

Then you can easily bring in your rich text from your dataset and, as long as you have edited the text to how you want it shown in the dataset field itself, then you won’t need to alter any settings of the text box element in the Wix Editor or it will overwrite any settings that you have already setup within the dataset.
https://support.wix.com/en/article/corvid-about-formatting-text-elements

You will find many posts about rich text not holding as people have not set it up correctly, if you search the forum you will find those posts like some here.
https://www.wix.com/corvid/forum/community-discussion/database-why-doesn-t-the-rich-text-formatting-hold
https://www.wix.com/corvid/forum/community-discussion/problem-with-rich-text-field

Thx, I will have a look. Here is the Code:

  1. let fullText; // variable to hold the full text

  2. let shortText; // variable to hold the short version of the text

  3. $w.onReady( function () {

  4. $w(“#dynamicDataset”).onReady( function () {

  5. // how many characters to include in the shortened version

  6. const shortTextLength = 20;

  7. // set the fullText variable to be the text from the collection

  8. fullText = $w(‘#dynamicDataset’).getCurrentItem().fullText;

  9. // if no text to display, collapse the text element and the button

  10. if (!fullText) {

  11. $w(‘#text44’).collapse();

  12. $w(‘#button24’).collapse();

  13. } else {

  14. // if the text has fewer or the same number of characters as shortTextLength characters, display it as is and collapse the “Show More” button

  15. if (fullText.length <= shortTextLength) {

  16. $w(‘#text44’).text = fullText;

  17. $w(‘#button24’).collapse();

  18. } else {

  19. // create the shortened version of the text and display it in the text element

  20. shortText = fullText.substr(0, shortTextLength) + “…”;

  21. $w(‘#text44’).text = shortText;

  22. }

  23. }

  24. });

  25. });

  26. export function button24_click(event) {

  27. // display the full text

  28. $w(“#text44”).text = fullText;

  29. // collapse the button

  30. $w(“#button24”).collapse();

  31. }