Modding Vivaldi
-
@Christoph142 Could you add a note about the thing with the timers to make sure the mod works? I just found this out and it would have helped to have it here.
-
@code3 I don't have the slightest idea what you're talking about.
-
@Christoph142 Oh, sorry. See here: https://forum.vivaldi.net/topic/58888/help-with-js-error/3?_=1616956787037. It has to do with Vivaldi using react and dynamic rendering. If you donât make js mods maybe @Gwen-Dragon can edit it or it could be a separate post, though personally I think it does belong in this âhow toâ post.
-
@code3 This is already exemplified in inspecting ui with devtools. It should also be noted most mods need different initiation functions nowadays. Setting a timeout, or calling the function repeatedly, on browser start wonât get you far when Vivaldi removes your elements regularly. Our approaches have changed significantly over time, because the browser has changed.
-
@luetage I think you mean this:
setTimeout(function wait() { const browser = document.getElementById('browser'); if (browser) { console.log('Hello, World!'); } else { setTimeout(wait, 300); } }, 300)
I did not see that. I think maybe you could explain why this timer is necessary, and that other workarounds may be necessary in other cases in order to write vanilla js on top of React.
-
@code3 Thereâs no allâinâone solution and neither this guide, nor the other one try to teach people coding. To me it seems like the Vivaldi team doesnât want people to mess with the code in the first place, thatâs why only CSS modding is officially supported â and only as an experiment. The entry barrier to modding Vivaldi is high, but you can learn by doing. On one side itâs far easier than a few years back, because so many mods already exist you can learn and copy from, on the other side Javascriptâ and to an extent CSS modding has become harder overall. Many CSS selectors in the UI have disappeared, in favor of tightening up the code and speeding up the UI (which could be arguedâŠ) and most of the elements in the UI get removed instead of being toggled with CSS. Thereâs no good way to do a howâto, the howâto are in a way the existing, maintained mods itself.
-
@luetage I agree with you, but the barrier to modding would be lower if there was some sort of guide, beyond "this is where to place the files," because, as you mentioned, there are complexities to modding on top of Vivaldi that even experienced users of JavaScript might not have experienced.
@luetage said in Modding Vivaldi:
Thereâs no good way to do a howâto, the howâto are in a way the existing, maintained mods itself.
Then maybe there should be a (pinned) post with examples of good mods to learn from, with certain important elements pointed out. Users who have been modding for a while can help out.
-
@luetage For instance:
https://lonm.vivaldi.net/2018/01/26/mod-making-process/
These things should be at the mod forum. -
@guigirl Alright, I know. But still, it would be helpful to them so they donât have to answer all my questions. And, I could assemble this list of resources, I would just need a few others to chime in, but most of the resources I can find myself.
-
@guigirl I know. But they feel obligated to answer my questions, and maybe if I put together some help for new users it could reduce the amount of questions asked.
-
@code3 said:
-
"it would be helpful to them so they donât have to answer all my questions"
-
"they feel obligated to answer my questions"
If you really think in that way, your point of view of this Forum is absolutely wrong.
-
-
@barbudo2005 I am not saying you have to answer my questions. I am glad that you have, I just think it would be more helpful to everyone if there was an FAQ/brief guide. I am not asking you to make it and you do not have to agree with me.
-
@code3 Maybe your first language is not English like me but....
When you say : "they feel obligated to answer my question" I understand perfectly what you are meaning.
-
@christoph142 said in Guide | Modding Vivaldi:
In any case there is only one single file in Vivaldi that you should ever need to modify. This file is located at YOURVIVALDIDIRECTORY\Application\VERSION\resources\vivaldi and called browser.html. You should back it up before you fiddle with it. You did the backup, right? OK, here's the fun part:
Where is browser.html on macOS Big Sur ?
According to a comment I read on Reddit you don't need to modify broswer.html anymore, is that correct ? -
@dpn You need to modify
browser.html
for JS mods only.For CSS mods:
@christoph142 said in Guide | Modding Vivaldi:
Vivaldi 2.6 and above
Open vivaldi://experiments
Enable "Allow for using CSS modifications"
Open Appearance section in settings
Choose the folder you want to use
Place your CSS files inside it
Restart Vivaldi to see them in effect -
@vegardheimdal Extensions and user scripts donât have access to the user interface. You can automate the installation of mods and make it a simple command you trigger whenever Vivaldi has been updated. Look at the according bash scripts in the pinned topics on this forum board for help.
-
@dpn said in Guide | Modding Vivaldi:
Where is browser.html on macOS Big Sur ?
Found it. Just in case anybody else is wondering...
Vivaldi.app/Contents/Frameworks/Vivaldi Framework.framework/Versions/Current/Resources/vivaldi/browser.html
-
@guigirl You should really ask this in the Hooks topic
-
@guigirl Well, no idea. As I see it only questions/issues regarding the implementation of regular modifications, as described in OP, should go here. Questions about actual coding should be a new topic, or, if they are about a specific existing mod, should go into the topic of this mod.
-
Edge Browser has a group function, anyone able to successfully re-create this by modding vivialdi Accordion to look as like groups in edge ?