How to Customize or Rearrange Links on the Google Bar

Google Bar is the black toolbar like thing that appears at the top of all Google web services, with links to Google’s flagship products like Search, Google+, YouTube, Maps, Play, Gmail, and so on. A dropdown menu at the end gives users access to more products that couldn’t be fitted on the bar. While the bar is extremely handy if you use Google’s products a lot, the inability to customize which links appear on the bar diminishes the utility of the bar to the point that some users absolutely loathe it. But if you can customize the bar and rearrange the links on it, the bar can become useful again. Here is how to do it.

Rearrange Google Apps Menu Bar User Script [Firefox and Opera]

This is a Greasemonkey user script that lets you replace the links on Google bar with any links of your choice. To use this first you need to install the Greasemonkey add-on on Firefox. Those who use Opera can install the equivalent Violent Monkey extension. After this you can install the “Rearrange Google Apps Menu Bar” user script. Those who use Chrome as their web browser, this user script will not work. But for these people we have another solution which we will address shortly.

The user script will automatically make some rearrangement on the Google bar. To replace these with your own links, you have to edit the user script. This can be done by clicking the Greasemonkey button in the toolbar and loading the script in your preferred text editor.

In Opera, you can click on the Violent Monkey button in the toolbar and click the Manage scripts button, and then click on the Edit button.

The script contain several lines such as these:

// Add Plus
    newOrderedList.innerHTML += '<li class=gbt><a target="_blank" class="gbzt" href="https://plus.google.com"><span class="gbtb2"></span><span class="gbts">+</span></a></li>';
    // Add Gmail
    newOrderedList.innerHTML += '<li class=gbt><a target="_blank" class="gbzt" href="https://mail.google.com"><span class="gbtb2"></span><span class="gbts">Gmail</span></a></li>';
    // Add Voice
    newOrderedList.innerHTML += '<li class=gbt><a target="_blank" class="gbzt" href="https://voice.google.com/"><span class="gbtb2"></span><span class="gbts">Voice</span></a></li>';
...
...

All you need to do is edit the parts indicated by bold in the script, and replace them with links of your choice.

Do keep in mind that you will completely replace the default Google bar links with your own. You will also lose the drop-down menu at the end of the bar.

Big G Black Bar Sorter [Chrome]

This is a fantastic extension for Chrome that lets you reorder the links on the Google bar just by drag and drop. Grab a link with the mouse, drag it and drop it on another place. The latest version of this extension lets you add custom links to the bar. To do this, head over to http://biggblackbarsorter.com and add remove, and modify custom links.