How to Remove Rainbow Banner from WordPress Reader (Temporarily)

In her post titled Listen Up WordPress, InsanityBytes explained her frustration over the rainbow banner that WordPress put at the top of the Reader – signifying marriage equality and the Supreme Court’s decision today – and her inability to remove said banner. If you still see the rainbow banner (I have no idea how long they’ll keep it up) and want to temporarily remove it, there is a way. It’s as simple as unchecking a box, but finding the right box will require a bit of exploration into the inner workings of browser code (which might be fun for you). The downside is that the rainbow will show up again if you refresh the page, but that shouldn’t be a problem since the Reader loads new posts without reloading the whole page. If you need a more permanent solution, go here.

How to make the rainbow banner image disappear from the top of the WordPress Reader

Step 1 – Make sure your on a page with the rainbow in a desktop browser…RemoveRainbow1

Step 2 – Pull up the browser’s developer tools somehow (you can Google how to do this for your browser). In most it’s in the menu at the top or even in the right-click menu. Here’s how I get to it in Safari. Right-click and then “Inspect Element”.

RemoveRainbow2

You should be able to find a page of elements like this. Congratulations, you’re looking at the HTML you’re browser uses to render the website. This is called the DOM (Document Object Model). Select the DOM element you see highlighted here called “header”. It’s nested under html and body.

Find it? Great! Notice what happens when you click it? Look at the style rules (click around to open them if they aren’t visible). They change depending on which DOM element you select. The one for “header” has a CSS style rule for “.masterbar” that looks like a rainbow of colors. That’s the culprit and you can see it at the bottom right of this image. You’re almost done…RemoveRainbow3

Step 3 – Uncheck that box under the “.masterbar” style rules (see screenshot). That’s it! Check your other window where the WordPress Reader is…RemoveRainbow4

You should now see this! No rainbow. 🙂RemoveRainbow5

 

Personally, I like the rainbow and join with WordPress in celebrating marriage equality. However, they should have provided a way to permanently remove it. If you forget and refresh the page, you can just do these three steps again to make the rainbow disappear from your Reader again.

Feel free to play around in the developer area of your browser, explore and learn new things. It doesn’t affect anything permanently and any changes you make will be gone when you refresh. It’s just affected your local browser window. I hope this helped.

Gentleness and respect,
–Russell

23 comments

  1. Thanks for the tip! Here is another way. Pull up the page with the rainbow flag, and cut a piece of paper or cardboard to cover it. Then, use Scotch tape to tape the paper or cardboard over the rainbow flag!

    You can still read everything else that you need to read!

    Resistance is not futile!

    Squeeky Fromm
    Girl Reporter

    Liked by 3 people

  2. Thank you – these instructions are all way too technical for a non-nerd like me, but I applaud and commend your attitude! That you personally are pro gay marriage but resent having this rainbow flag imposed upon bloggers and even show them how to remove it is not only nobly thought but exactly illustrates the issue here: WordPress.com as a service provider must stay absolutely neutral in all ideological questions. Editing out that rainbow (or covering it up with cardboard) won’t mend what’s principally wrong with putting it up in the first place.

    Liked by 1 person

  3. Here’s my question: Is there a way for me to keep it up there on my page even if they do decide to take it down? Personally, I like the reminder that bigotry can be overcome when people get over themselves long enough to think about someone else for a change. And, since the WordPress folks are pretty much allowing me to barbecue in their backyard for free, I’m not sure it’s my place to complain if their tiki torches are the wrong color…

    Liked by 2 people

    1. Haha. Vance! I’m so glad you asked that, my friend. There sure is a way. Go to Step 2, then instead of unchecking a box, put the cursor at the end of one of the style tag lines under the “.masterbar” class. Then hit Enter to start a new style and paste in the following style code…

      background: linear-gradient(to bottom, #e24c3e 0%, #e24c3e 16.66667%, #f47d3b 16.66667%, #f47d3b 33.33333%, #fdb813 33.33333%, #fdb813 50%, #74bb5d 50%, #74bb5d 66.66667%, #38a6d7 66.66667%, #38a6d7 83.33333%, #8c7ab8 83.33333%, #8c7ab8 100%);

      Now you should see the rainbow banner again! 🙂

      Gentleness and respect,
      –Russell

      Like

      1. If you want it there more permanently (even after you reload the browser window) the WordPress Happiness Engineer said you can install an Add-on/extension such as Stylish.

        Once you have the add-on installed, you should be able to add a tag like this for wordpress.com…

        .masterbar{
        background: linear-gradient(to bottom, #e24c3e 0%, #e24c3e 16.66667%, #f47d3b 16.66667%, #f47d3b 33.33333%, #fdb813 33.33333%, #fdb813 50%, #74bb5d 50%, #74bb5d 66.66667%, #38a6d7 66.66667%, #38a6d7 83.33333%, #8c7ab8 83.33333%, #8c7ab8 100%) !important;
        }

        🙂

        Like

    2. Personalised headers? Great idea, come to think of it… But don’t mistake WordPress.com for a charity. As a free-blog user you owe them nothing – those free blogs are an incentive; their profits are derived from the customers (nothing wrong with that).

      Like

    1. I’m sorry, but I have to respond to this: you’re just wrong. This is like saying that the crucifix is a symbol of anti-atheist bigotry. Furthermore, after the decision on Friday, my wife and I went to a local church, in which church two separate churches came together to celebrate the step forward represented by Obergefell. There were rainbows all over the room, banners, tablecloths, stickers, etc. So I suppose these Christians were bigoted against themselves? There are Christian churches all over this country that openly embrace the rainbow banner.

      With as much respect as I can muster, and all the gentleness in the world, it occurs to me that the fact that you see it as such indicates that you of all people need to have it plastered all over everything you see.

      Like

      1. Any church that celebrates that dreadful ruling had rejected the authority of scripture and can no longer be considered Christian. I will amend my statement, the rainbow banner represents to me anti-Christian bigotry and apostasy.

        Like

          1. I am so sorry. I did indeed misread. I’m very off the grid right now, reading and typing on the small screen I disdain. I weighed in to register my support, but I owe my family the focus they deserve. I should have given you the benefit of the doubt. I’ll join the digital fray again in a few days.

            Liked by 1 person

  4. Thanks for the help. Going to remove it now. Seems every corporation has changed its avatar, but when WP went rainbow for ALL of us, that was the straw that broke me.

    I note that WordPress has closed all “forums” on the subject matter of the banner, saying the forum was not the place for such a discussion. WELL then, I kinda think they should have thought of that BEFORE assuming we’d all want the banner. I can see it as an option, like the winter snowflakes are, otherwise, don’t force us to accept.

    Like

  5. It struck me as interesting, that this rainbow only has 6 colours. I’d just finished doing a WordPress Photo Challenge that was about the 7 colours of the rainbow…

    I’m not a free-blog user, but even if I was, I don’t think the rainbow should be a universal ‘banner’ on everyone’s ‘Reader’ and ‘My Sites’ page. WordPress is irritating some portion of it’s own user base by forcing bloggers to view something that might be offensive to them.

    While I have no problem with Gay Marriage, I simply do not want to be greeted by a rainbow, or any other banner WordPress thinks they should force on me.

    Liked by 1 person

Thoughts?

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s