RichText Dialogue FontColor Showing in a TextLabel

[turbotwink_y]

I’m trying to make a dialogue system that highlights important information.
(Typewriter effect)
This is what i want:

this is what happens though: (only for a couple of seconds though)

I’d like to know how to fix this. this is my code:

	local message = [[Oi, you can foind artifacs by diggin in <font color="#ffff00">'Artifact Nodes'</font> around this here desert with a shovel of ya choosin'. You can foind all the way from tetanis-infected nails to whole gold bahs!]]
	for i = 1, #message do
		script.Parent.Type.PlaybackSpeed = math.random(10,13)/10
		script.Parent.Type:Play()
		script.Parent.Context.Text = string.sub(message, 1, i)
		wait(.05)
		if string.sub(script.Parent.Context.Text,-1) == "," or string.sub(script.Parent.Context.Text,-1) == "." or string.sub(script.Parent.Context.Text,-1) == "?" or string.sub(script.Parent.Context.Text,-1) == "!" or string.sub(script.Parent.Context.Text,-1) == "-" then
			wait(.25)
		end
	end

So, how would i make it not show the <font color="#000000"> and </font> parts in the string, but just the former string without the richtext modifiers?

[TenX29]

The apostrophes between the font tags are most likely interfering with the rich text formatting. In a rich text string, apostrophes that need to be visible should be escaped by replacing each of them with '. More on this at Rich Text Markup | Roblox Creator Documentation

[turbotwink_y]

It’s still going to do the same thing. The text adds each letter per 0.05 seconds. Its going to say &ap halfway through, then after 0.15 seconds it’ll finally say '

The <font color="#ffff00">Artifact Nodes</font> is the root issue.

[TenX29]

It seems you’re manually trying to achieve the same effect Roblox already has an implementation for, which is the TextLabel.MaxVisibleGraphemes property. It should work with rich text, saving you the trouble of dealing with it yourself.

Typewriter Effect: New property MaxVisibleGraphemes (Live)

We have wanted to support developers with a better way to add a “typewriter” style effect to your text. The most common method used today, is to update the string by adding 1 additional character repeatedly, which can cause some issues. Besides enabling a cool effect, there are additional benefits with using the new solution: More performant and intuitive method to add a typewriter effect to an entire string Remove visual issues with text wrapping, as the text string no longer changes in siz…

[turbotwink_y]

This doesn’t work. There must be an easier way, that thread has no information I can gather. The posts are just like “Wow this worked for me thanks!” Yet, no working code sample in sight.

[TenX29]

There was a good code example at the end of the OP of the thread. I also linked the relevant documentation. In case you haven’t been able to implement it with your project yet, here is a simplified version of the typewriter effect:

-- Assuming this script is a direct child of a TextLabel
-- Make sure the text is hidden initially
script.Parent.MaxVisibleGraphemes = 0

-- Set the text label content
script.Parent.Text = message

-- For each grapheme in the message string, increment MaxVisibleGraphemes by 1
for _, grapheme in utf8.graphemes(message) do
	script.Parent.MaxVisibleGraphemes += 1
	task.wait(0.05)
end

You should of course also remove the rich text tags to avoid pointless iterations before getting the graphemes iterator, as that contains the rich text tags as well.