Your browser does not seem to support JavaScript. As a result, your viewing experience will be diminished, and you have been placed in read-only mode.

Please download a browser that supports JavaScript, or enable it if it's disabled (i.e. NoScript).

Modifications to Vivaldi are not officially supported

Code being shared on this forum has not been reviewed by the Vivaldi Team. Issues, including security issues, may be present.

L

Inspecting the Vivaldi UI with DevTools
modding guide • • luetage

155

41
Votes

155
Posts

39816
Views

O

@Pathduck hi apologies i have manged to get ti working .
The issue i was having and why it didnt work like you showed i had my custom css running.
This was (and still is blocking / wrapping my new tab icon but i know what they are called now.

So i need to work out how to get my custom css working correctly even several AI LLM cannot get it correct.

I been trying to get it working for week see here but at least i know how to find the names.
Sorry again it was a lot easier as you showed but me not removing the custom css was a error. CHeers for help.
C

Modding Vivaldi
guide • • Christoph142

250

46
Votes

250
Posts

136564
Views

L

@jcdickinson I don’t see how this loads modification files and patches window.html. But it’s not my problem, that’s for the next NixOS user to find out.
C

Patching Vivaldi with batch scripts
guide • • Christoph142

127

12
Votes

127
Posts

38740
Views

P

Windows
Here is a modified Version without the need to edit the Installation Path(If Vivaldi is installed as a user):
:: Author: debiedowner :: Editor: Phobos @echo off REM make current directory work when run as administrator cd "%~dp0" set installPath="%localappdata%\Vivaldi\Application\" echo Searching at: %installPath% for /f "tokens=*" %%a in ('dir /a:-d /b /s %installPath%') do ( if "%%~nxa"=="window.html" set latestVersionFolder=%%~dpa ) if "%latestVersionFolder%"=="" ( echo No window.html found in "%latestVersionFolder%" pause & exit ) else ( echo Found latest version folder: "%latestVersionFolder%" ) if not exist "%latestVersionFolder%\window.bak.html" ( echo Creating a backup of your original window.html file. copy "%latestVersionFolder%\window.html" "%latestVersionFolder%\window.bak.html" ) echo copying js files to custom.js type *.js > "%latestVersionFolder%\custom.js" echo patching window.html file type "%latestVersionFolder%\window.bak.html" | findstr /v "</body>" | findstr /v "</html>" > "%latestVersionFolder%\window.html" echo ^<script src="custom.js"^>^</script^> >> "%latestVersionFolder%\window.html" echo ^</body^> >> "%latestVersionFolder%\window.html" echo ^</html^> >> "%latestVersionFolder%\window.html" pause
K

Give Vivaldi that MacOS look
• Kjala

3

1
Votes

3
Posts

106
Views

B

@Kjala

Said:

Give Vivaldi that MacOS look.

Could it be that you have a dual personality? 😁 😁 😁
D

Beautify your pre-loading (white)screen CSS mod
• dude99

23

6
Votes

23
Posts

1413
Views

Z

@Swashbuckler
I'll try,
IIRC, that setting managed the start up screen.
K

Regarding the close a tab with a right click
• KOGIDA

3

0
Votes

3
Posts

68
Views

B

@KOGIDA

Install AHK and use this code:

https://www.autohotkey.com/download/
~RButton:: Send, !o return
Shortcut for close tab : ALT+o

As @luetage said I don't recommend it.

Use the mouse gesture "Down".
D

Windows button persist when hiding title bar
• diusonem

3

0
Votes

3
Posts

68
Views

D

Yes, I have this
#header { display: none; } .window-buttongroup { display: none !important; }
without that the button are on the header.

Screenshot 2024-07-25 at 20.12.36.png

similar to Guest Profile.
S

Collapsing vertical tabs that expand on-hover (with and without floating tabs)
css • • sakaiyo

79

10
Votes

79
Posts

6416
Views

N

@immaintheme

That seems to do nothing at all as far as I can tell. I ramped it up to 2000ms (so should be two whole seconds) but its still closing as soon as the mouse leaves the panel.

My mistake, I added the root section to my own .css because I had already made alterations to the code, and didn't notice you'd actually added other variables to the original!

I integrated it properly and now it seems to be working, thankyou so much 🙂
O

Open in Dialog mod
• oudstand

63

12
Votes

63
Posts

2787
Views

O

@oudstand Nevermind that I was thinking of something else. I wanted to know if it would behave like another window. But thanks for the response!
S

AutoHide Tab Bar + Address Bar | Show on Hover
• shenghuoyishujia

84

6
Votes

84
Posts

7635
Views

N

@oudstand said in AutoHide Tab Bar + Address Bar | Show on Hover:

@nirin Currently I've never tested it with vertical tabs and the web panels on the left. I use the horizontal tabs at the top and the web panels on the left. I'd have to invest some time to make it work for your setup as well. Since everyone can position everything somewhere else, it's hard to support all use cases. I'll think about it, if I can make adjustments to support more setups.

Ahh ok, I appreciate you thinking it over. Trying to make vivaldi work for me as my brief trip to the Firefox camp ended up with disappointment (sidebery vertical tabs are way better than vivaldis, but firefox android browser is about 8 years behind the times on features I need aha).
S

Fix for pre-loading white screen when opening sites and bookmarks?
• Swashbuckler

1

0
Votes

1
Posts

35
Views

No one has replied
N

Double-clicking a tab that is in an accordion group, will retract that group
• nirin

11

3
Votes

11
Posts

150
Views

N

@barbudo2005 said in Double-clicking a tab that is in an accordion group, will retract that group:

@nirin

Not related to the OP, but it is my opinion that any function that goes from manual to automatic eases the load on the whole browser.

Try the Mod by @nafumofu that Group tabs automatically by domain:

https://forum.vivaldi.net/topic/98184/group-tabs-by-domain

It works like a charm.

Interesting, though I find I generally make tab folders/groups out of related items, rather than related by the domain.

Eg. If I'm doing research into new smart home tech, I may have a tab group folder called 'smart tech' and have open tabs for amazon, homeassistant, reddit etc all in that folder.

Unfortunately you can't really do any of this in vivaldi without jumping through a bunch of extra hoops.
P

How to disable HTML5 canvas in vivaldi and prevent fingerprinting
• Ptitchat

1

1
Votes

1
Posts

50
Views

No one has replied
D

Ergonomic Colorful Download Popup List
• dude99

7

7
Votes

7
Posts

775
Views

V

@MasterLeo29

"the colorful progress bar aspect" work perfect...👍 👍 👍

would it be possible to create a percentage progression in the button?, the percentage is displayed during the download, is it possible to read it and place it in the button?

3c735678-1dc1-47cc-be31-2eee90030fd5-progress bar.png
N

Group tabs by domain
• nafumofu

41

9
Votes

41
Posts

1528
Views

B

@nafumofu

What new projects for Vivaldi are playing in your head?🤫 🤫 🤫
B

Is the list of closed tabs modifiable with CSS?
• barbudo2005

12

0
Votes

12
Posts

172
Views

D

@barbudo2005 <offtopic> No, we create a forest of palm trees by face-palming. 😉 scnr
A

How do I reference this Vivaldi Highlight color in CSS?
• allanmohr

8

0
Votes

8
Posts

108
Views

A

HAH! Apologies, I didn't think about that before posting - I had already removed that section. Honestly, I'm in a good spot where I'm at. Ultimately I just wanted to start removing static colors in my CSS and replace them with vars from the Theme so that they can adjust more dynamic.....

ie. statically set WHITE font color is fine when the background is dark, but if I change themes to white background, we have an issue!

I really appreciate all of your followups. I'm good for now, and thank you.
N

Can scroll bar appearance be fixed? Or is it a chromium bug?
• nirin

3

0
Votes

3
Posts

102
Views

B

@nirin

Another modification is to homogenize the same font on all pages, which makes reading easier since your eyes get used to a single font:
*:not([class*="ico"], [class*="fa"], [class*="control"] *, [class*="button"], [role*="button"],[type*=button], button, [id*="button"], [class*="btn"], [class*="mjx"], [class*="vjs"], [class*="bb"], [class="ll"], i, [class="i"], [class*="symbol"], img, svg) {font-family: Lato !important; font-weight: 400 !important; text-align: justify; line-height: 1.5; letter-spacing: 0.01rem !important;}
You can change "text-align" and "line-height" in some specific pages because they are not "!important"

To improve readability use:
* {text-rendering: geometricPrecision !important; -webkit-font-smoothing: subpixel-antialiased !important; font-optical-sizing: auto !important;}
Download Lato font in this page:

https://fonts.google.com/specimen/Lato
D

Automate 2-level tab stack columns V3
• dude99

3

9
Votes

3
Posts

890
Views

D

@nirin This mod is written back in 2023, so much have changed and CSS have evolved a lot, so I'm sure someone can remake this CSS mod with newest additional CSS functions.

So, when this mod do break, just open a new thread an request for something similar to this, I'm sure some CSS wizards in this community will made a better one in no time. LOL
B

Open link in split view
• bazylizon

19

3
Votes

19
Posts

623
Views

L

@CasketPizza This should work ☛ https://forum.vivaldi.net/post/767369
Haven’t tested extensively, might fail on some links.