Dynamically Format Text

Learn how to dynamically format text colour and font size using Corvid (a.k.a. Wix Code). 

This example shows you how to dynamically format a text elements colour and font size using code and a button. Try the example below.

#btnFormat
Try it!
Change this text colour and size dynamically.
#txtToFormat

Page Code

 

let toggle = 0;

 

export function btnFormat_click(event) {

 

    if(toggle===0){

        $w("#txtToFormat").html = `<p style = "color:red;font-size:40px"> ${$w("#txtToFormat").text}</p>`;

        $w("#btnFormat").label = "Change back";

        toggle = 1;

    } else {

        $w("#txtToFormat").html = `<p style = "color:blue;font-size:20px"> ${$w("#txtToFormat").text}</p>`;

        toggle = 0;     

        $w("#btnFormat").label = "Change Format";

    }

        

            

}

Please wait ...
Disclaimer: To the best of our knowledge, this code works for its stipulated purpose. If you find an error in our code, or know of a better way to achieve the same result - please contact us! All our code snippets come with full support to help you implement them on your own website - simply contact us for help.