Firefox 4: Get Tabs In The Title Bar (Like Chrome)

If you like how Chrome displays the window controls (close, minimize and maximize buttons) next to the tabs and want this in Firefox, you'll be glad to know it's quite easy to achieve.


Before we proceed, here are a couple of screenshots using Ambiance and Orta Stylish themes (these are styles for the buttons only):

How it works

What you'll get: window controls (close, minimize, maximize buttons) next to the Firefox menu and no titlebar for maximized Firefox windows only. Unmaximized windows will still have the regular window titlebar and buttons (unless you apply the tweaks at the end of the post).

Using Stylish, you'll also get those buttons to integrate with Ambiance and Orta GTK themes. Unfortunately for now these are the only 2 styles available so if you use a different theme, the buttons won't respect your GTK theme.

There is another way of doing this: using Window Applets but that's for those that use a Gnome Panel on top. If you don't use a Gnome Panel, then the instructions in this post will allow you to still have window buttons in Firefox while removing the titlebar.

Get the window controls next to the Firefox 4 menu and remove the Firefox titlebar

1. For this you'll need the latest Firefox 4 (either from the Mozilla daily PPA or from HERE), Stylish and Hide Caption Titlebar Plus Firefox extensions. Install them, restart Firefox 4 and proceed to step 2.

2. In Firefox 4, go to Addons, select the Hide Caption Titlebar Plus extension and click "Preferences". Here, on the "Look & Feel" tab, set the following:

• Show Firefox 4's titlebar: Disabled
• Uncheck "New Firefox 4's option: Place Tabs in the Titlebar
• Skin for minimize, max & close buttons: "Auto. Current theme's skin"
• Minimize, Max & Close Buttons located at top-right corner: Disabled
• Uncheck Floating buttons appears when hovering micro-button or main menu is activated

Here's a screenshot with the exact settings:

On the "Look & Feel 2" tab (yes, another Look & Feel tab):

• Uncheck: Enable custom Firefox Application "Home" button

Here's a screenshot for this too:

3. Right click on the tab bar and select customize, then drag and drop the "[hcp] Min, Max, Close Buttons" item next to the Firefox menu:

4. Now you should see some buttons next to your Firefox menu but they look ugly. To get some nice looking Ambiance-style buttons, install HCTP Ambiance theme. There's also an Orta HCTP theme (only enable one!).

Update: here's another Orta style with a modified alignment which looks better (thanks to Janhouse!).

5. Install CompizConfig Settings Manager:

sudo apt-get install compizconfig-settings-manager

And go to the "Window Decorations" plugin settings and under "Decoration windows", enter:

any & !(class=Firefox & state=maxvert & role=browser)

Important: "class=Firefox" is for those using Firefox 4 stable from the FF stable Ubuntu PPA. If you're using Minefield, replace "Firefox" with "Minefield".

Now when you maximize Firefox, the titlebar should be removed and the window buttons should be displayed next to the Firefox menu (or wherever you've placed the buttons).

Apply this for unmaximized Firefox windows too

If you want to remove the window titlebar and get the close, minimize and maximize buttons for unmaximized Firefox windows too, in step 5 above, instead of "any & !(class=Firefox & state=maxvert)" use:

any & !(role=browser & class=Firefox)

You'll also need to edit the Ambiance / Orta Stylish user style to get the buttons on unmaximized Firefox window: Go to Addons > User Styles, then right click "HCTP Ambiance theme" or "HCTP Orta theme", select "Edit" and then:

- for Ambiance, remove the following code (you should find it somewhere near the end of the file):

/*Hide Buttons when unmaximized */
#main-window[sizemode="normal"]
.hc-mmcbuttons-cls
{
display:none !important;
}

Then click save.


- for Orta there are 2 steps:

1) search for "#main-window[sizemode="maximized"] #TabsToolbar{" (it should be somewhere near the top of the file) and remove "#main-window[sizemode="maximized"]" so that the line looks like this:

#TabsToolbar{

2) then, just like for Ambiance, remove the following code (you should find it somewhere near the end of the file):

/*Hide Buttons when unmaximized */
#main-window[sizemode="normal"]
.hc-mmcbuttons-cls
{
display:none !important;
}

Then save.

Credits for the instructions and user styles: arzali @ Ubuntuforums.