Hello there, Roblox developers! The title describes exactly what you will learn Iearn this tutorial. I am going to show you how to acheive the following:
In case if you didn’t catch on, we will be creating speaker tags, PLUS, I will also teach you some
bonus features , such as changing the color of your text and how to set tags based on your group rank.
About the Chat
Before we start modifying the chat, we need some background information on the chat itself. More details can be found below, but in short, in Roblox, there is a Chat Service and you may have not paid attention to it but it is there:
Whenever you playtest, that service will be filled with module scripts that are responsible for the chat. Below is a picture of all the modules within the chat service:
If you aren’t familiar with advanced scripting, please don’t touch the contents of the chat as that might break your chat. In the Lua Chat System, there are speakers. These, well, are speakers. It can be you or someone else but each time you chat, a event is called. We are going to take advantage of the event and try to modify some data sent through the event. So that is all the knowledge about the chat you are going to need for this tutorial and if you want to learn more, please go here.
Implementation
Now you have a very basic understanding of the chat, we can start coding! First thing first, we are going to create a new script in ServerScriptService. Then, we are going to get some services: ServerScriptService and ChatService.local ServerScriptService = game:GetService('ServerScriptService')
local ChatService = require(ServerScriptService:WaitForChild('ChatServiceRunner'):WaitForChild('ChatService')) -- do not use game:GetService("Chat")
If you saw my comment there, you might wonder, why can I not use game:getservice? The answer is: if you look closely, we are getting a script within ServerScriptService, so the script called ChatServiceRunner is within ServerScriptService and we are using the require keyword to obtain the modulescript, not the actual Chat Service. Next we are going to create a function that describes what happens when a player speaks:
local function onPlayerChatted(PlayerName)
--all the tags will be set here
end
Right now, we have a empty function, so let us add some stuff! We need to define who the speaker is, so we will add this line of code: local Speaker = ChatService:GetSpeaker(PlayerName)
local function onPlayerChatted(PlayerName)
local Speaker = ChatService:GetSpeaker(PlayerName)
end
Next comes the fun part. We will add some tags and change the chat colors. Below are the lines of code to do each:
adding speaker tags
Speaker:SetExtraData('Tags', {{TagText = 'YourTagName', TagColor = Color3.fromRGB(0, 255, 42)}, {TagText = '2ndTagName', TagColor = Color3.fromRGB(234, 155, 16)}})
Adding chat tags took one line of code, you can change the tag color by adjusting the Color3 value. If you notice a pattern, you will see that each time you add {{TagText = 'YourTagName', TagColor = Color3.fromRGB(0, 255, 42)}, that is one extra tag being added. So use this to your advantage to add as many tags as you like! Next we will see how to change your chat color, aka your actual words.
chat color code
Speaker:SetExtraData('ChatColor', Color3.fromRGB(212, 175, 55))
IF you want to change the player name’s chat color, the following line of code will do:
player name color
Speaker:SetExtraData('NameColor', Color3.fromRGB(255, 10, 20))
If we chuck it all together, we get this final function here:
local function onPlayerChatted(PlayerName)
local Speaker = ChatService:GetSpeaker(PlayerName)
Speaker:SetExtraData('Tags', {{TagText = 'YourTagName', TagColor = Color3.fromRGB(0, 255, 42)}, {TagText = '2ndTagName', TagColor = Color3.fromRGB(234, 155, 16)}})
Speaker:SetExtraData('ChatColor', Color3.fromRGB(212, 175, 55))
Speaker:SetExtraData('NameColor', Color3.fromRGB(212, 175, 55))
end
This function will not work yet, that is because we never really binded the function that special event I was talking about earlier so lets add this line of code to complete the script:
ChatService.SpeakerAdded:Connect(onPlayerChatted)
Now we are pretty much done! My complete script is shown below:
local ServerScriptService = game:GetService('ServerScriptService')
local ChatService = require(ServerScriptService:WaitForChild('ChatServiceRunner'):WaitForChild('ChatService')) -- do not use game:GetService("Chat")
local function onPlayerChatted(PlayerName)
local Speaker = ChatService:GetSpeaker(PlayerName)
Speaker:SetExtraData('Tags', {{TagText = 'YourTagName', TagColor = Color3.fromRGB(0, 255, 42)}, {TagText = '2ndTagName', TagColor = Color3.fromRGB(234, 155, 16)}})
Speaker:SetExtraData('ChatColor', Color3.fromRGB(212, 175, 55))
Speaker:SetExtraData('NameColor', Color3.fromRGB(212, 175, 55))
end
ChatService.SpeakerAdded:Connect(onPlayerChatted)
If you don’t have a group, this should work fine. Thanks for reading! BUT, if you do have a group, take a look at the optional section to see how you can spice it up.
Optional (only if you have group admin)
Alright, we will continue based off of the previous script. First, we will stick another service in the beginning, which is the Players service.
local ServerScriptService = game:GetService('ServerScriptService')
local ChatService = require(ServerScriptService:WaitForChild('ChatServiceRunner'):WaitForChild('ChatService'))
local Players = game:GetService("Players") -- call player service
Next, before we script the onPlayerChatted function, please locate your group configure page. Continue on down to the “Roles” tab, should be on the left. Mine is shown here:
The red circle shows the rank of that role. In this case, the rank is 1 for member and 255 for the owner. Now that you know what ranks are, we can go back to our script and add some more code. This is our onPlayerChatted function again:
local function onPlayerChatted(PlayerName)
local Speaker = ChatService:GetSpeaker(PlayerName)
Speaker:SetExtraData('Tags', {{TagText = 'YourTagName', TagColor = Color3.fromRGB(0, 255, 42)}, {TagText = '2ndTagName', TagColor = Color3.fromRGB(234, 155, 16)}})
Speaker:SetExtraData('ChatColor', Color3.fromRGB(212, 175, 55))
Speaker:SetExtraData('NameColor', Color3.fromRGB(212, 175, 55))
end
Let’s say you want to add 3 tags for your group:
- Owner Tag
- Admin Tag
- Member Tag
- Guest will have no tag cuz we don’t care about guests lol
To achieve this, we first need to take a look at this function: player:GetRankInGroup(123456) This function will return the 0-255 (seen above) rank of the player and the parameters is your group ID, aka 123456. We can use this to create some logic to check whether a player is a certain rank or not:
if Players.PlayerName:GetRankInGroup(123456) == 255 then
print(PlayerName .. " is owner of group 123456")
end
That little example demostrates the Player:GetRankInGroup(123456) function. Now we just need to implement that function into the main onPlayerChatted function:
local Speaker = ChatService:GetSpeaker(PlayerName)
if Players.PlayerName:GetRankInGroup(123456) == 255 then --if player is owner of group, set the tags
Speaker:SetExtraData('Tags', {{TagText = 'Owner', TagColor = Color3.fromRGB(0, 255, 42)}})
Speaker:SetExtraData('ChatColor', Color3.fromRGB(212, 175, 55))
Speaker:SetExtraData('NameColor', Color3.fromRGB(212, 175, 55))
elseif Players.PlayerName:GetRankInGroup(123456) == "whateverRankAdmin" then --else if player is admin set tags
Speaker:SetExtraData('Tags', {{TagText = 'Admin', TagColor = Color3.fromRGB(0, 255, 42)}})
Speaker:SetExtraData('ChatColor', Color3.fromRGB(212, 175, 55))
Speaker:SetExtraData('NameColor', Color3.fromRGB(212, 175, 55))
elseif Players.PlayerName:GetRankInGroup(123456) == 1 then --else if player is member set tags
Speaker:SetExtraData('Tags', {{TagText = 'Member', TagColor = Color3.fromRGB(0, 255, 42)}})
Speaker:SetExtraData('ChatColor', Color3.fromRGB(212, 175, 55))
Speaker:SetExtraData('NameColor', Color3.fromRGB(212, 175, 55))
end
That is the logic to setting the group ranks and as always, you can tweak the Color3 value to your choice. And that is pretty much it for the group implementation, so here is the final script below:
local ServerScriptService = game:GetService('ServerScriptService')
local ChatService = require(ServerScriptService:WaitForChild('ChatServiceRunner'):WaitForChild('ChatService'))
local Players = game:GetService("Players") -- call player service
local function onPlayerChatted(PlayerName)
local Speaker = ChatService:GetSpeaker(PlayerName)
if Players.PlayerName:GetRankInGroup(123456) == 255 then --if player is owner of group, set the tags
Speaker:SetExtraData('Tags', {{TagText = 'Owner', TagColor = Color3.fromRGB(0, 255, 42)}})
Speaker:SetExtraData('ChatColor', Color3.fromRGB(212, 175, 55))
Speaker:SetExtraData('NameColor', Color3.fromRGB(212, 175, 55))
elseif Players.PlayerName:GetRankInGroup(123456) == "whateverRankAdmin" then --else if player is admin set tags
Speaker:SetExtraData('Tags', {{TagText = 'Admin', TagColor = Color3.fromRGB(0, 255, 42)}})
Speaker:SetExtraData('ChatColor', Color3.fromRGB(212, 175, 55))
Speaker:SetExtraData('NameColor', Color3.fromRGB(212, 175, 55))
elseif Players.PlayerName:GetRankInGroup(123456) == 1 then --else if player is member set tags
Speaker:SetExtraData('Tags', {{TagText = 'Member', TagColor = Color3.fromRGB(0, 255, 42)}})
Speaker:SetExtraData('ChatColor', Color3.fromRGB(212, 175, 55))
Speaker:SetExtraData('NameColor', Color3.fromRGB(212, 175, 55))
end
end
ChatService.SpeakerAdded:Connect(onPlayerChatted)
If you read all of that, you should pat yourself on the back because wow! that was a long read. Now you will know how to implement group ranks into your speaker tags.
If you read this tutorial, tell me how I did, I would love some constructive feedback in the thread below. Also, you can post problems below so I can see where went wrong. Also, please pick a choice on the poll to see how I did in explaining this topic, your feedback helps! grammar and spelling don’t count, just how well this tutorial worked for you as a whole
- Very Concise
- Understandable
- Hard to read
- No clue what this is
0 voters