If you look at the Runescape Wiki Chat, it has shortcuts to things such as Rules, Information, Logs, and Stats. How can I enable this on my wiki?
This is a script written by User:Joeytje50, although this, along with many other parts such as chatmod icons, are in widespread use. Any modification like this requires two things to start off with.
Copy the contents of both those pages onto your wiki. The frist page will already exist, the second you will need to make.
For this particular addition, you will need to put the following in MediaWiki:Chat.js on your wiki
//Chat's topic. Remember to escape single quotes in the topic using \' to prevent this from breaking. var chatTopic = 'Welcome to the RuneScape Wiki chat.<br /><a href="/wiki/RuneScape:Chat" target="_blank" title="RuneScape:Chat" style="position:relative;text-decoration:underline;">Rules</a> • <a href="/wiki/RuneScape:Chat/Help" target="_blank" title="RuneScape:Chat/Help" style="position:relative;text-decoration:underline;">Information</a> • <a href="/wiki/RuneScape:Chat/Logs" target="_blank" title="RuneScape:Chat/Logs" style="position:relative;text-decoration:underline;">Logs</a> • <a href="sactage.com/rsw.php" target="_blank" title="Sactage\'s statistics" style="position:relative;text-decoration:underline;">Stats</a>' $(function() { $('#ChatHeader .public.wordmark').prepend('<div class="chattopic" style="text-align:center;position:absolute;width:60%;z-index:0;font-size: 13px;color:#3A3A3A;font-weight:bold;line-height:1.6;margin-left:110px;">'+chatTopic+'</div>') .find('a').attr('style','position:relative;text-decoration:underline;') }) $('#ChatHeader .public.wordmark div:not(:first-child)').remove()
The first chunk is what you will need to change for your wiki contained between var chatTopic = '
and the closing '
If you need to put any apostrophes within the header you will need to escape them like this: \'
which you can see in use as Sactage\'s
It's pretty much whatever html you want to put in, but remember any linebreaks need to be <br /> instead of newlines. Wiki mark-up is also unavailable, so you will need to use proper html links such as <a href="/wiki/PAGENAME" title="TITLE">NAME OF LINK</a>
The same applies for things like italics of bold, where you will need to use <i>Italic text</i> and <b>bold text</b> instead.
And I really need to bug Joey into making a proper help page for this stuff.
Thanks, this helped me alot.
The only thing is...my text is black and I need to make it white.
Is there a way to change the color?
color:white
In the line that reads
$('#ChatHeader .public.wordmark').prepend('<div class="chattopic" style="text-align:center;position:absolute;width:60%;z-index:0;font-size: 13px;color:#3A3A3A;font-weight:bold;line-height:1.6;margin-left:110px;">'+chatTopic+'</div>')
chnage the color:#3A3A3A;
to color:#fff;
or color:white;
Each style needs to be separated by a ; or it will break.