For anybody who makes use of the WordPress.com stats plugin, you’ll discover it inserts a small smiley picture in your footer. This picture must be loaded to trace the stats.
Some folks would possibly assume this little smiley face is “cute”. The remainder of one can find the smiley picture unpleasant (and probably evil wanting) and can search for methods to take away it. This put up will go over:
- Initially, what not to do when hiding the smiley
- The right way to correctly disguise it, with some further absolute place goodness for sure layouts
- Should you’d slightly not disguise it, how you can simply middle the smiley picture
What To not Do
Don’t ever use show:none to cover the WP Stats Smiley.
Initially, I need to go over the one factor you shouldn’t do when trying to cover the WP Stats Smiley, and that’s use: show:none. Yeah, I mentioned that twice, however I used to be simply ensuring you didn’t miss it.
Yeah, that’s the identical code you should utilize to get a CSS Killswitch impact, but it surely’s undoubtedly not one thing you need to be utilizing to not show a picture, which must be loaded to precisely show stats.
What to do as an alternative
In response to this put up, the developer recommends to make use of the next code to your stylesheet (i.e. model.css) when you want to disguise the smiley:
img#wpstats{width:0px;peak:0px;overflow:hidden}One thing just like the above code could be the next:
img#wpstats{visibility:hidden}The distinction between visibility:hidden and show:none is visibility:hidden will nonetheless take up house within the design, whereas show:none won’t (and keep in mind, you may’t use show:none until you need your stat monitoring to be borked).
On sure layouts, there’s a small drawback with this code taking on house beneath the footer, so I’ve considered a extra artistic answer.
Right here’s an instance of what I’m speaking about, discover the smiley within the decrease left nook which is inflicting the footer format to interrupt.
With the 2 above examples, the picture, whereas not seen, would nonetheless take up house within the format inflicting that mild grey bar (which is the background shade) to seem within the footer.
Absolute Positioning
A mix of absolute positioning plus the code above is an efficient option to get rid of this concern. You might strive one thing like this:
img#wpstats{place:absolute;high:0;width:0px;peak:0px;overflow:hidden}Centering the Picture
Relying in your format, as an alternative of hiding it, it could look considerably higher if the smiley picture was centered. You may simply do that with the next snippet of code.
img#wpstats{show:block;margin: Zero auto}Clarification:
- Units the picture to show as block (as an alternative of inline, by default).
- Units the left and proper margins to automated to successfully middle the now block picture.
You should use this CSS to correctly middle just about any “img” tag with out utilizing extra markup.
