Formated text output with variables/links

Hallo,

I would like to output a line of text on the website with wix velo (Wix Editor).
Variables and a link should be used in the text.
And I want to format the text (size, color).

Can I use the html property and pass the variables MY_TEXT and MY_LINK (from the CMS) somehow?

$w(“#Text”).html = ‘MY_TEXT + Rentals’;

Or is there another easy way?

Best thanks for help, Spectral

You did not explain, what for do you need it?
What are you trying to achieve?

Maybe your idea is ok, but the way to realize your idea is bad.

Explain your wished function in more detail.

Hi @CODE-NINJA,

I have a dynamic page with a repeater that accesses a CMS with 200 data records. Among other things, there is a rich text for each data record. However, I would like to generate a small part of the text (more or less a sentence) by code during runtime (this saves me writing this 200 times and changing it again if necessary). In this sentence there should be an internal link (always the same) and the title and a number from the CMS data record should be adopted.

I actually thought this couldn’t be too difficult, but I can’t get it to work…

Thanks for your help and best regards, Spektral

You still do not provide enough information.

What we know already?

-You are working on a → DYNAMIC-APGE!
-You also have a REPEATER on your → DYNAMIC-PAGE.
-Surely your whole setup is running by DATASET-CONNECTIONS and some setup inside of the PROPERTY-PANEL.

Here you spoke about —>

Can I use the html property and pass the variables MY_TEXT and MY_LINK (from the CMS) somehow?

Is that a FIELD inside of your DATABASE, where you have stored HTML-code?
You should give more details about how your page have been setted-up, since anybody can see what you already have done.

You also did not provide any code. Do you have already generated some code, or was my assumtion right and you did use → datasets and setup inside of the property-panel only?

Also your repeater will surely be connected to another dataset (non-dynamic), is that right? → That means 2 different databases are involved?

So, now we should pay attention!!!

DYNAMIC-PAGE means → it will show data for 1-item only at once.
Inside your repeater you can show your whole items, which are stored inside of your database (to which ever database your repeater is connected). The repeater is surely not connected to the dynamic-dataset, isn’t it?

Maybe you want provide more infos first? Maybe you even first want to provide a pic of your setup?

There are to many open questions.

$w.onReady(()=>{
     $w('#dynamicDataset').onReady(()=>{
          const curItem = $w('#dynamicDataset').getCurrentItem(); console.log(curItem);
          const title = curItem.title;  console.log('Title: ', title);
          const ownerID = curItem._owner; console.log('Owner-ID: ', ownerID);
          // add more code here........
     });
});

This little example should show you your current selected item on your dynamic page.
You will see all results inside of your → CONSOLE!

Hi russian-dima,

Perhaps my information about the dynamic page, the repeater and the CMS was rather confusing…

I have placed a text element on a page: $w(“#TitleText”)
With the help of Wix velo I want to change the content of the text element.
The text should then also be compiled from CMS entries.

For example, I have:

const itemObj = $w(“#dynamicDataset”).getCurrentItem();
$w(“#TitleText”).html = ‘About ’ + itemObj.title;

This gives me the desired text output, but “itemObj.title” is not formatted like “About”. And I don’t know how or if I can format the text output of “itemObj.title” (in terms of text size and color).

Best regards, Spektral

You have set your text-element to listen for HTML-Text not for ordinary (not formated) text.

That means you also have to format your text first and also feed your TEXT-ELEMENT with → formated html-strings → like →
<p style="color: red; font-style: italic;">Hello World</p>

Hello World

...or....

<h1 style="color: blue; font-family: 'Courier New', monospace; text-decoration: underline;">Greetings</h1>

Greetings

This is what your HTML-Text-Box is expecting!

But you better should use the options given by wix → Rich-Content-Box and doing all the text-design inside of your databse. Pay attention → this will work only by connection with a dataset. Maybe you can search for similar posts, i already have written about such problems in older posts.

Hi,

yes, I did that, but the editor here then formats the text instead of displaying it 1:1.
The line was:
$w("#TitleText").html = '<b><span style="color: #002E5D; font-size: 16px">About </span></b>' + itemObj.title;

The question is how can I output my “itemObj.title” in the desired text type…?
Or is the rich text box the only chance (which would probably be quite complex?)

Best regards, Spectral

let myValue = 'xxxxxxx';
let myString = '<b><span style="color: #002E5D; font-size: 16px">About ${myValue} </span></b>'

$w("#TitleText").html = myString;

This must do it, i think (not tested)!

Thanks for your help, I had already tried the curly brackets, but it doesn’t work (everything is treated as text).

CORRECTION!

let myString = <b><span style="color: #002E5D; font-size: 16px">About ${myValue} </span></b>

Do not use → ‘’ , or → “” , instead use → ``

But since this text editor is so silly → i can’T show it here, so see the PICTURE …

You can mark it as resolved. :rofl:

Next time keep your questions simply, but detailed! :rofl:

Yes, it works now!

So I was annoyed for two days because of an apostrophe :wink:

Thank you very much for your help !!!

1 Like