How to Add a Vertical Tab Sidebar to Firefox

In 2021, Microsoft added a vertical tab feature to Edge. Enabling Edge’s vertical tabs option activates a sidebar that contains open side tabs. Users can then switch between pages by clicking their tabs in that sidebar.

Unfortunately, Firefox does not have such a built-in vertical tab feature. However, that doesn’t mean you can’t have a tabbed sidebar in Mozilla’s flagship browser. You can add vertical tabs to Mozilla Firefox with the Tab Center Reborn and Sidebery extensions.

How to Get Vertical Firefox Tabs with Tab Center Reborn

Tab Center Reborn is a freely available tab sidebar extension for Firefox rated 4.8 (out of five) by users. Its vertical sidebar integrates all the default sidebar options from Firefox’s standard horizontal tabbar. That extension’s sidebar can also adapt to your browser’s theme when you choose to do so.

You’ll immediately notice that the sidebar has thumbnails for open side tabs. Admittedly, these thumbnails are a bit small and not entirely clear. Still, it’s still a visual feature that Firefox’s horizontal tab bar doesn’t have.

The second thing you’ll probably notice is the search box at the top of the vertical sidebar. You can search for open page tabs by entering keywords for them in the Filter Tabs box. Firefox’s horizontal tab bar also has a tab search feature, but it only becomes available when you have many pages open.

Tab Center Reborn has some keyboard shortcuts. Press the Shift + F1 hotkey to open and close the vertical sidebar. Pressing the Shift + F2 hotkey will open your last active page tab.

To check out the options for Tab Center Reborn, click the Open Settings button at the top right of the vertical sidebar. There aren’t that many customization options available, but you can make some changes to the sidebar’s appearance and behavior. For example, you can select Enabled for the Compact Mode setting to remove thumbnail previews.

You customize the vertical sidebar more by entering CSS scripts in the CSS text box. Check the Custom Stylesheet checkbox to enter a script there. Pressing the Save CSS button applies the specified script’s adjustment to the sidebar.

If you’re not very CSS savvy, check out the Tab Center Reborn tweaks page. That web page contains a series of CSS scripts that you can copy and paste into the CSS box to apply them. Select the code of a script there, press the keyboard shortcut Ctrl + C and paste it into the CSS box with the keyboard shortcut Ctrl + V.

How to get vertical Firefox tabs with Sidebery

Sidebery is a vertical tabbed sidebar plugin that displays side tabs with a tree structure. This means that subpages from the same websites branch off from their homepages in that sidebar. This extension also includes a sidebar for bookmarks.

You can add Sidebery to Firefox by clicking the Add to Firefox option. Then you’ll see a Toggle Sidebary sidebar button on Firefox’s URL toolbar. Click that button to see the sidebar with vertical tabs.

Sidebery displays your open side tabs in the default panel. When you open linked pages from the same website in new tabs, you’ll notice how they branch off from their root pages in the sidebar. You can click a small arrow to the left of the primary root tab to collapse or expand its web page subtree.

Firefox’s native sidebar for horizontal tabs does not support tab grouping at the time of writing. However, you can group page tabs in Sidebery’s sidebar. To do so, right-click a page in the sidebar and select the Group option. Then drag and drop other pages in the sidebar to the same group. Click on the grouped tab to select and open pages from it.

To access your favorite sites, click the Bookmarks button on the panel at the top of the sidebar. There you can click on your bookmarks folders to view and open the saved pages from them. You can also manage your bookmarks from there by right-clicking on saved pages to select Delete, Edit and Create Folder options.

Sidebery includes a wide range of customization options for you to fine-tune. Tap the Open Settings button at the top right of the vertical tab row to display the Sidebary/Settings tab. There you can configure the settings for appearance, general, mouse, key binding, panel, bookmarks, container and tab tree – plus more.

Click Appearance on the left side of the Settings tab to check out the sidebar’s visual options. There you can increase or decrease the sidebar text size by changing the Font Size option. Select dark for the Color scheme option to make the sidebar black.

To fully configure the sidebar color scheme, hit the Edit Styles button just below these appearance options. Then you can customize the colors by activating the standard color settings. Click on the round palette buttons to select different colors from there. You can restore all default settings by clicking Reset at the bottom of the Styles Editor.

Leave a Comment