Trying to change the style of rich text product description with code. I found a solution, but it takes 10 secs to load?

Ask the community
, ,
1

Hi folks!

I am making a custom dynamic product page using the data from the Products database. I want to use the text from the rich text field, but change the style to match the page design, so this is what I have come up with:

In my function createTextValue I am removing the

and replacing

with
from the html version of the product description, in order to preserve the line breaks that were written in the description field when adding the product to the collection. Those are necessary for readability.

Then I use whatever the function creates to add my own formatting in style tags (I saw that done in other forum posts).

$w.onReady(function () {
    let productData = $w("#dynamicDataset").getCurrentItem()
    let productDescription = productData.description;
    
    function createTextValue(productDescription) {
        return productDescription.replaceAll("<p>", "")
        .replaceAll("</p>", "<br>")
        }
        
    $w("#text222").html = '<p style="text-align:center"><span style="line-height:1.5">'+createTextValue(productDescription)+'</span></p>';

This works, but my problem is that it takes 10 seconds to load, and until then the placeholder text is shown.

If I don’t use my createTextValue function, it loads immediately.

How can I fix this issue? I don’t NEED to use the function I made, it is just a means to get to an end. Any other way of editing the style of the description text while preserving the line breaks would be fine.

Btw - I have tried writing the line breaks into the description text itself when adding the product. This also works, however I am concerned that it would show up with
in the middle of the description text when the product is migrated to facebook and instagram.
Edit: I tried applying this method and it does work,
written into the product description directly does not show up in the description for the product when it migrates to facebook and instagram! I am still curious about my problem about the slow loading.

Hope anyone has some idea of how to solve my issue :slight_smile:

  • Kathrine