I have been wanting to add an image to the WP-Ban message that all people I banned get to see. I just could not figure it out.
Why? Because sometimes I’m a little slow on the uptake.
I Googled my little heart out trying to find instructions. I even found the forum for the WP-Ban plugin. I posted my question. No one answered. I asked people. No one knew.
I asked the fabulous Kim from Just Ask Kim if she knew, but she was not familiar with the plugin. However she did find a screenshot for me that turned on a dim light bulb in my brain.
The page that shows up for people who are banned with that plugin, is a basic HTML web page. I had previously customized the message, but always wanted to add an image for more visual impact. Kim told me to just add HTML for the image.
Makes sense, right?
Yeah, sense to someone who’s brain is not addled with illness, lack of sleep & too much to do.
MY brain said “HTML! Ok, I’ll do this then.” I uploaded the image I wanted to my blog and added the URL of that image to my code.
Only “this” was CSS NOT HTML.
I added the following and was rather confused when the code showed up and not the image.
background: #ffffff url(http://lastshredsofsanity.com/wp-content/uploads/2012/02/Ban-Message-FRS.png) no-repeat fixed center center;
When that did not work, I tried just the URL for the image.
Again, no dice.
THEN the light bulb finally got to it’s full brightness and I decided to make a post on my blog that would not be published. I added the image on the Visual tab, then switched to the HTML tab (LIGHT BULB!!) and copied the code into the banned message box in the plugin. I hit save and voila! custom ban message with image!
Place your image & custom text code BELOW the opening tag & BEFORE the closing tag
This is the code I entered:
<img alt=”” src=”http://lastshredsofsanity.com/wp-content/uploads/2012/02/Ban-Message-FRS.png” />
I also customized the text:
<h1 style=”text-align: center; font-weight: bold;”>The Asylum, aka Last Shreds Of Sanity, is a Free Range Stupid Free Zone.
<h1 style=”text-align: center; font-weight: bold;”>You are obviously one of them, and therefore, have been banned.
Sucks to be you, huh?
I got the above code the same way….by typing out what I wanted it to say in a faux blog post, formatting the text, then switching to the HTML tab and copying the code. The code is then placed into the Banned Message area of the plugin interface.
Previously, the message the banned got was:
DUUUUUDE! You got 404’d!! Bummer.
You must have done something wrong. The page didn’t load. Try reloading the page again. You may have to repeat this a few times before it works.
Good luck, man.
Now the banned see this:
So now you, too, can have a truly custom image for your ban message page.
Category: Tech and Blog Tutorials