Ubuntu / Linux news and application reviews.

Firefox Ubuntu Tabs In The Title Bar

If you like how Chrome displays the window controls (close, minimize and maximize buttons) next to the tabs and want this in Firefox under Linux, 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):

Firefox no titlebar buttons Ubuntu

Firefox tabs in titlebar screenshot Ubuntu



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 menu and remove the Firefox titlebar


1. For this you'll need Stylish and Hide Caption Titlebar Plus Firefox extensions. Install them, restart Firefox and proceed to step 2.

2. In Firefox, go to Addons, select the Hide Caption Titlebar Plus extension and click "Preferences". Here, on the "Look & Feel" tab, set the following:
  • Show Firefox's titlebar: Disabled
  • Uncheck "New Firefox 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:

HCTP look feel tab


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:

HCTP settings


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:

Firefox HTCP dragndrop


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


CCSM screenshot

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 stable. If you're using Minefield for instance, 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.