Move the extensions in the toolbar?
-
New user, everything going well. Except...
to move the extension icons in the menu bar from the far RIGHT side of the bar to the LEFT, near the navigation buttons? Really no way? I mean, my 1Password extension is in an inconvenient position on the right and I want to move it to the far left.modedit edited text on user's request
-
@MyVivaldiBrowser You can move all extensions to the left with custom CSS ⇒
.toolbar-extensions {order: -1;}
-
Thanks. But CSS is not easy to do for laymen. Vivaldi does so much but forgot to include this one simple function. Should be built-in to the UI.
I see your how-to now, but where is the CSS file? -
@MyVivaldiBrowser Will come at some point, but are you willing to wait months to years for it? I included the CSS needed in above post. Enable “Allow for using CSS Modifications” in
vivaldi://experiments
, create a.css
file and copy the code into it, link to that file fromvivaldi://settings/appearance/
.Or wait.
-
@MyVivaldiBrowser It's very easy (in Linux and Windows at least) with Shift + mouse-hold-left to move them.
You can move panel-icons the same way, even the items in the status bar. -
I made a big mistake in my first post. Sorry. ️
This: Except...no way to move the extension icons in the menu bar from the far left side of the bar to the right,
Should be:
....to move the extension icons in the menu bar from the far RIGHT side of the bar to the LEFT,
-
@MyVivaldiBrowser You mean to move them left of adress-bar?
-
@MyVivaldiBrowser I know, the code already does exactly that.
-
Yes. To the left of of address bar. Sorry to be so confusing.
-
@Gwen-Dragon Thanks
-
@MyVivaldiBrowser
I tried the css-solution from @luetage . And it works.
It is not difficult to manage it.- Take a simple text-editor,
- paste in this code:
.toolbar-extensions {order: -1;}
- name the file as "custom.css" and save it on your computer somewhere.
- paste in this URL in your vivaldi - adressbar:
vivaldi://experiments/
-
and check the box Allow for using CSS modifications
-
open your settings by pasting this URL into your adress - bar:
vivaldi://settings/appearance/
-
find this section to give the right path to your custom.css (sorry my screenshot is in german, but you'll find it):
-
Then close the browser and restart.
That's it. good luck!
-
Thank you for the detailed CSS how-to. I was on the verge of doing that CSS but then I discovered the option to which hide individual extensions, and the way to show them again. So that will suffice for now. Also, I wanted to move individual extensions from the right to the left, not all of them.
If I eventually proceed with the CSS I'm going to make a note that I did that and keep that note in Vivaldi in case version updates don't maintain the CSS or I need to revert back. -
You can simply press Ctrl+Drag with Mouse to arrange extensions order