Help with "Read more" button and hyperlinks not working.

Ask the community
, ,
1

Hi,

We have created a “Read more” button on our website, but since then, the hyperlinks inside the text doesn’t work anymore. Any ideas? See below the coding used to create the Read more button.

let fullText; // variable to hold the full text
let shortText; // variable to hold the short version of the text

// For full API documentation, including code examples, visit Velo API Reference - Wix.com

$w.onReady( function () {
//TODO: write your page related code here…
// how many characters to include in the shortened version
const shortTextLength = 755 ;
// read the full text and store it in the fullText variable
fullText = $w( “#text1” ).text;
// grab the number of characters defined in shortTextLength and store them in the shortText variable
shortText = fullText.substr( 0 , shortTextLength) + “…” ;
// set the contents of the text element to be the short text
$w( “#text1” ).text = shortText;

});

export function button3_click(event) {
//Add your code for this event here:
// check the contents of the text element
if ($w( “#text1” ).text === shortText) {
// if currently displaying short text, display the full text
$w( “#text1” ).text = fullText;
$w( “#button3” ).label = “Read Less” ;
} else {
// if currently displaying full text, display the short text
$w( “#text1” ).text = shortText;
$w( “#button3” ).label = “Read More” ;
}

}

2

Hello,

It could be happening because you reassign the contents of the text element to short/full text on click. You can see the related formatting issue discussed here .

I would recommend you to try and implement it using our new Show More/Less tutorial.

Corvid Tutorial: Expand Text with a Read More Link

3

If you want to preserve the links, you will need to use the .html property ( not the .text property) of the text boxes:

$w("#text1").html = fullText;

Be aware that HTML text will size may differ from plain text.