LGforum (2803)
awc - CSS Trick - Change the chatbox '@' Vote_lcapawc - CSS Trick - Change the chatbox '@' Voting_barawc - CSS Trick - Change the chatbox '@' Vote_rcap 
Mr.Easybb (1586)
awc - CSS Trick - Change the chatbox '@' Vote_lcapawc - CSS Trick - Change the chatbox '@' Voting_barawc - CSS Trick - Change the chatbox '@' Vote_rcap 
Bloodbath (745)
awc - CSS Trick - Change the chatbox '@' Vote_lcapawc - CSS Trick - Change the chatbox '@' Voting_barawc - CSS Trick - Change the chatbox '@' Vote_rcap 
Rukiafan (533)
awc - CSS Trick - Change the chatbox '@' Vote_lcapawc - CSS Trick - Change the chatbox '@' Voting_barawc - CSS Trick - Change the chatbox '@' Vote_rcap 
Dom (513)
awc - CSS Trick - Change the chatbox '@' Vote_lcapawc - CSS Trick - Change the chatbox '@' Voting_barawc - CSS Trick - Change the chatbox '@' Vote_rcap 
puppycheese (446)
awc - CSS Trick - Change the chatbox '@' Vote_lcapawc - CSS Trick - Change the chatbox '@' Voting_barawc - CSS Trick - Change the chatbox '@' Vote_rcap 
pedro (330)
awc - CSS Trick - Change the chatbox '@' Vote_lcapawc - CSS Trick - Change the chatbox '@' Voting_barawc - CSS Trick - Change the chatbox '@' Vote_rcap 
Neymar (301)
awc - CSS Trick - Change the chatbox '@' Vote_lcapawc - CSS Trick - Change the chatbox '@' Voting_barawc - CSS Trick - Change the chatbox '@' Vote_rcap 
Hitsu (281)
awc - CSS Trick - Change the chatbox '@' Vote_lcapawc - CSS Trick - Change the chatbox '@' Voting_barawc - CSS Trick - Change the chatbox '@' Vote_rcap 
Flora (275)
awc - CSS Trick - Change the chatbox '@' Vote_lcapawc - CSS Trick - Change the chatbox '@' Voting_barawc - CSS Trick - Change the chatbox '@' Vote_rcap 


CSS Trick - Change the chatbox '@'

LGforumLGforum
Status : Working to restore AWC!

Posts : 2803
Join date : 2011-10-05
Age : 27
Location : UK
Tue 08 May 2012, 16:22
I see this asked about a lot on the support forum. Another chatbox feature that simply people say impossible, since we can't have Javascript in the chatbox page, but people are forgetting we can have css Smile So here's another little CSS trick for those of you wishing to change the '@' symbol in the chatbox for your moderators.

Code:
[panda=css]#chatbox > p span.user > span strong {
  display: none;
}
#chatbox > p span.user > span:after {
  content: 'MOD: ';
}
Change 'MOD: ' for whatever you like of course.

This will only work for user's who have a colored username. For those that don't its a little more difficult I reckon, but after I send this, I think I'll give it a go and edit this post if I'm successful.

Please note, I only tested this on PHPBB3, this forum, so if it works on any others or doesn't please post below so other users know. Thanks Smile

#tips #AWC
NeymarNeymar
Status : No status yet...

Posts : 301
Join date : 2012-03-11
Location : Glasgow, Scotland
Tue 08 May 2012, 18:05
Thanks LG, another very nice tip. I'll give it a try.
NikoNiko
Status : Welcome back AvacWeb!

Posts : 76
Join date : 2012-03-22
Age : 24
Location : Italy
Wed 09 May 2012, 18:01
Simple but beautiful Smile
FloraFlora
Status : No status yet...

Posts : 275
Join date : 2011-11-18
Location : USA
Thu 10 May 2012, 11:44
I love CSS tricks that are very useful. Thank you for sharing it LG. Smile
avatartpt8899
Status : No status yet...

Posts : 10
Join date : 2012-04-04
Mon 14 May 2012, 03:56
Bravo LG!
doannamthaidoannamthai
Status : No status yet...

Posts : 152
Join date : 2013-01-02
Age : 34
Sat 13 Jul 2013, 04:51
For all @ in Chatbox
Code:
[panda=css]#chatbox .user span, .online-users li a span, .online-users li span, .away-users li a span, .away-users li span {display: none;}
#chatbox .user a *, .online-users li a span:last-child, .away-users li a span:last-child {display: inline-block !important;}
#chatbox .user span:before, .online-users li a span:before, .online-users li span:before, .away-users li a span:before, .away-users li span:before {content :"Mod: " ; font-size : 12px;}
HitsuHitsu
Status : Finished on working fmAPI.

Posts : 281
Join date : 2013-09-09
Age : 22
Location : Indonesia
Thu 19 Sep 2013, 06:30
LG is this possible for AWC?
BloodbathBloodbath
Status : No status yet...

Posts : 745
Join date : 2013-05-31
Age : 25
Thu 19 Sep 2013, 06:47
@Hitsu wrote:[quotelink="http://www.avacweb.com/t220-css-trick-change-the-chatbox#15856"]LG is this possible for AWC?
AWC uses the same CSS selectors as the normal chatbox (starting with #chatbox), so this is very possible.
HitsuHitsu
Status : Finished on working fmAPI.

Posts : 281
Join date : 2013-09-09
Age : 22
Location : Indonesia
Thu 19 Sep 2013, 08:29
Ooh okay thanks for the info Smile
avatarluizr187
Status : No status yet...

Posts : 10
Join date : 2013-10-14
Mon 14 Oct 2013, 23:51
@doannamthai I did that and put -@ in [ic]{content :"this part " [/ic] and it did this: -@@ -@luiz187 in the corner
Sponsored content