Fandom

Community Central

Admin Forum:Chat button styling

19,023pages on
this wiki
Add New Page
Talk0 Share

Ad blocker interference detected!


Wikia is a free-to-use site that makes money from advertising. We have a modified experience for viewers using ad blockers

Wikia is not accessible if you’ve made further modifications. Remove the custom ad blocker rule(s) and the page will load as expected.

This Forum has been archived

Forums: Admin Central Index Technical Help Chat button styling
Central's forums are a place for the community to help other members.
To contact staff directly or to report bugs, please use Special:Contact.
Note: This topic has been unedited for 1361 days. It is considered archived - the discussion is over. Do not add to unless it really needs a response.


I'm trying to style the chat button in the right rail at w:c:tardis. But I'm not quite understanding the CSS element name. It's . . . different to how the other buttons are in the rail. Could someone who knows a little bit more about CSS please take a look at the "start a chat" button and tell me what element names I would use to style it? Thanks czechout@fandom    fly tardis  <span style="">21:24:57 Sat 10 Sep 2011 

Try using div.chat-join button. On a sidenote: the amount of custom styling you're using, CSS3 in particular, makes the wiki run slower on weaker computers - box-shadow is known to slow down a page. Sovq 06:48, September 11, 2011 (UTC)
Yeah, I've been trying to scale back the box-shadow-y-ness for Firefox users, because I understood they were particularly affected. Is it your understanding that other browsers have an issue with it as well? It's hard for me to see it, because I've got an old computer and browsers, and I'm not noticing horrible load times.
In any case, div.chat-join button was one of my initial ideas, and it's not worked. (I've tried it both as .div.chat-join button and div.chat-join button, cause i'm still not quite sure when to apply a prepending "." and when not to. Neither case has worked, though.) czechout@fandom    fly tardis  <span style="">16:56:14 Sun 11 Sep 2011 
Odd, when I add div.chat-join button to the set of button overrides you use for other buttons in Firebug, it works fine. The dot - "." - indicates css classes called in the article with class="CSSCLASS", so it should not be added before the "div" part in this case.
I opened your wiki both in Chrome and Firefox and in both of them scrolling, opening navigation menus or triggering ":hover" styling effects have quite a bit of a delay. But then again I probably do have the oldest computer around here ;). Sovq 17:53, September 11, 2011 (UTC)
If by “re-styling” you mean changing the wording, you do not have to use CSS/JS. You can do it by editing the relevant files in the MediaWiki namespace. Hope this helps! — SpikeToronto 07:20, September 11, 2011 (UTC)
No, I mean the actual style of the button — though every bit of knowledge helps. What's throwing me, I suppose, is that if you inspect another button in the right rail, you get a specific class name, like "wikia-button-upphotos". But the chat button doesn't seem to have a class attached. It seems to be created by something that looks more like "raw" JS: <button onclick="onChatButtonClick()">
Anyone got any ideas? czechout@fandom    fly tardis  <span style="">16:56:14 Sun 11 Sep 2011 
Okay, so now it's just getting weird. I can remove the join chat image by specifying the element
div.chat-join button img
but I can't affect the button's actual styling by referring to
div.chat-join button
Anyone know what to make of that? czechout@fandom    fly tardis  <span style="">13:52:52 Mon 12 Sep 2011 
Have you tried !important;? Did you clear the cache? TK999 13:57, September 12, 2011 (UTC)
It must be a problem on your end. Try another browser/another account/refresh and purge the cache properly. Sovq 13:59, September 12, 2011 (UTC)
How "must" it be a problem on my end? I've tried three different browsers and have obviously cleared the cache in all of them. I've also had multiple users confirm for me that they, too, aren't seeing a change in the start/join button, except that the image has now been taken away. Obviously, if we can see that the image has been successfully removed, we're not having simply browser/cache issues. I mean, the goal here is to make the chat button to look like all the other buttons in the right rail. You're not saying that you are seeing a successfully styled start/join chat button, are you? czechout@fandom    fly tardis  <span style="">14:43:28 Mon 12 Sep 2011 
Hold on, I'm an idiot. I had a stray space between a * and a / in my note about the section, meaning that I accidentally remarked out the styling of the very element I was trying to style. So I guess it was a problem on my end. Not quite as basic as failing to clear the cache, but — yeah, embarrassing nonetheless.
So, anyway, thanks for everyone who helped me . . . get back to where I was when I opened the thread. Sorry for wasting everyone's time. Still, I guess we have definitely learned, for posterity, that the element name for styling the chat buttons are
div.chat-join button and div.chat-start button
I'll just be exiting quietly through the side door now . . . czechout@fandom    fly tardis  <span style="">15:06:40 Mon 12 Sep 2011 
To be fair, the "must" part was a poor choice of wording on my part. Since I only tested the change without actually editing MediaWiki:Wikia.css, then syntax errors also were a possibility. Sovq 15:44, September 12, 2011 (UTC)
No worries, your wording got me thinking about boneheaded mistakes for which I'd not yet actually checked. Everything helps in diagnosing a fiddly bit of code. :) czechout@fandom    fly tardis  <span style="">15:25:29 Wed 14 Sep 2011 

Also on Fandom

Random Wiki