customize <a> style

Discussion Ask a question
,
1

I’m stucking about replacing tag in text element to make style automatically by coding.

like…

$w.onReady(function () {
	let textElements = $w("Text");
	for (var t of textElements){
		t.html = t.html.replace(/<a/g, '<a style="background-color:#aa7100;text-decoration:underline;"');
	}
)};

It breaks all text link to “#”.
What wrong about this? It seems better when I checked content in “t.html” by sending another text element.
2

Hey Itoh,

Welcome to the Wix Code forums.

I think this will work for you:

let text = $w("#text1"); // id of element must have # (hashtag)
console.log(text);
text.html = text.html.replace(/<a/g, '<a style="background-color:#aa7100;text-decoration:underline;"');
console.log(text.html);

I included console.log to make sure it was working.

Good luck,

Yisrael

3

Thanks for your help, but still have same trouble.
Also, it seems no trouble check with console output. but every links in actual page still have no links.

4

I tried the code out on a test page and it worked fine. Maybe you’re doing something slightly different. You’ll have to go over everthing carefully.

Good luck,

Yisrael

5

Hm…
btw, I paste your source for test, I got error about text.html(/<a/g,…) is not function. Is it little mistake? I mind it causes because I replaced it text.html.replace(/<a/g,…).
And I think it can replace Element array by for loop. Is it correct?

6

You are right - somehow replace got deleted from my code. I fixed my code above. Thanks

7

I’m confused about this!

$w.onReady(function () {
	$w("#text1Post").html = $w("#text1Pre").html.replace(/<a/g, '<a style="background-color:#aa7100;text-decoration:underline;"');
	// this makes good, but I don't says so.

	let text = $w("#text2");
	text.html = text.html.replace(/<a/g, '<a style="background-color:#aa7100;text-decoration:underline;"');
	// this still can't get well.
});
8

Sorry, I don’t understand.

My example code above works just fine. I checked it. I don’t understand what you’re trying to do. But if it works for you then that’s great.

9

Simply, this can’t get I want. While replace html content, link also replaced “#”, like . I don’t set rel attribute but this add by some stuff. It seems just broken for me. I think if this returns I planned, all element will be override like css.
Just, I don’t know why such thing occures.

10

replace() is a Javascript function (not necessarily Wix Code). I don’t know why this isn’t working for you. I tried this with a href=“#” and it worked fine. You might need to check your code more carefully.

You might want to check this reference as well: JavaScript String replace() Method

11

Hmmmmm…I I don’t want to change link to “#”. The problem is this changes all href attribute to “#” in spite of I don’t want so.
I can get right replace ( like ) seeing from console.log. But all link in acctual pages are replaced “#”.
Acctualy, I’m a noob in coding. I mistake about like scope, type, and so on, maybe. Also English is :(. Sorry about poor writing.