Paramètre de CSS de Vivaldi

Il y a quelques années, j’avais fait un article pour expliquer comment mettre la barre de signets verticalement dans Vivaldi. Cette méthode n’est plus d’actualité et était de toute façon remise à zéro lors des mises à jour du navigateur.

La nouvelle méthode est elle persistante, et même si elle semble similaire, elle utilise des options qui n’étaient pas là dans Vivaldi avant.

Activer les modifs CSS de l’interface

Pour commencer, il faut activer 2-3 trucs dans les options du navigateur, y compris des options expérimentales.

Premièrement, activez les mods CSS. Pour ça, allez sur l’adresse vivaldi://experiments/ puis cochez la case « Allow for using CSS modifications ». Relancez le navigateur.

Rendez-vous ensuite dans les paramètres, et cherchez « CSS ». Vous devez alors voir apparaître une option qui permet de spécifier un dossier :

Paramètre de CSS de Vivaldi
Mettez-y un dossier de votre choix. Je vous conseille de choisir un sous dossier nommé « userChrome » dans le dossier de profil de Vivaldi. Sous GNU/Linux, le dossier de profil se trouve dans ~/.config/vivaldi/.

Ce dossier « userChrome » va contenir des fichiers CSS contenant le code CSS correspondant aux modifs de l’interface du navigateur.

Activer la barre de signets

Ensuite, dans les paramètres, toujours, assurez-vous que la barre de signets soit en haut, que les signets soient affichés sous formes d’icônes seulement :

Afficher les signets sous forme d’icônes.

Utiliser du CSS pour mettre cette barre verticalement sur la droite

Ce que mon code CSS va faire maintenant, c’est :

  • pivoter la barre 90° dans le sens horaire (la barre se trouve alors à gauche et les icônes sur le côté)
  • déplacer cette barre (sur la gauche) vers l’autre côté, à droite
  • faire pivoter les icônes de −90° pour les remettre dans le bon sens.
  • faire en sorte que la barre n’empiète pas sur la fenêtre principale du navigateur (la partie où s’affichent les pages)

Le code en question :

/* Bookmarkbar : turning it on the side, placing it on the right */
#app #browser #main .bookmark-bar {
	transform: rotate(90deg) scale(1, 1)!important;
	transform-origin: 0% 0%!important;
	position: relative!important;
	left: 100%;
	height: 34px;
}

/* flip back the individual icons */
#app #browser #main .bookmark-bar button {
	transform: rotate(-90deg)!important;
}

/* gives margins to the main frame */
#app #browser #main .inner {
	margin-right: 35px!important; /* gives place to the new bars position */
	margin-top: -35px!important; /* claims the place from its old position */
}

Ce code est à placer dans un fichier CSS dans le dossier créé précédemment. Donnez-lui le nom que vous voulez ; par exemple « vertical-bookmarks.css ».

Enregistrez ce fichier, puis redémarrez Vivaldi, et la barre devrait être vertical, à droite :

Vivaldi avec la barre de signets à droite.

Quelques notes

Ceci est testé avec Vivaldi 3.7.2218.58 (Stable channel) (64 bits) sous Linux Mint 20.
Le code CSS utilisé est le même que celui de mon astuce d’il y a quelques années.

Vivaldi le dit bien : l’option pour le CSS peut, un jour, être modifié ou retiré. Dans ce cas, ce mod ne fonctionnera plus : la barre de signets sera alors de nouveau en haut, horizontalement. Ça ne sera pas grave (aucune perte de données), mais il faudra alors trouver autre chose.

À l’époque d’Opera, il était possible de mettre la barre de signets verticalement d’une simple option dans les réglages. On peut espérer que cette option revienne un jour dans Vivaldi. En attendant, ce bricolage permet de dépanner.

Toute l’interface de Vivaldi est accessible en CSS. Pour en explorer les éléments, il faut lancer Vivaldi dans un mode spécial, avec la commande vivaldi --debug-packed-apps --silent-debugger-extension-api, et ensuite utiliser les outils de développeurs pour l’explorer et moder ça.

5 commentaires

gravatar
Trit’ a dit :

Intéressante astuce. Mais pense à mettre à jour : on est à la version 3.8, maintenant.

J’en ai une autre : a priori, tu as créé un nouveau dossier Speed Dial pour ne pas avoir de vignettes. Inutile de faire ça pour garder une page SD vierge : il suffit de désactiver la case « Speed Dial » dans le volet à droite dans la page des signets, après avoir sélectionné le dossier de signets concerné.
Tu peux même masquer le « + » à gauche de la barre donnant accès aux signets, à l’historique et aux notes en décochant la case « Afficher le bouton « + » » dans les paramètres du Speed Dial (vivaldi://settings/startpage/).

gravatar
Antoine a dit :

Pourquoi utiliser Vivaldi plutôt que Firefox ?

gravatar
Le Hollandais Volant a dit :

@Antoine : Parce que la politique de Mozilla me gonflait de plus en plus et malgré quelques bons points, ça fait longtemps que je pensais changer pour Vivaldi. C’était déjà mon navigateur par défaut sous Android depuis un moment, et mon navigateur secondaire sur desktop.

Par ailleurs, même si Vivaldi n’est pas à proprement parler Libre, il est en totalité (ou quasi-totalité ?) open-source et donc auditable (et éditable). Voir là.

Par ailleurs, leur philosophie est très proche de celle de Mozilla en ce qui concerne la vie privée et le combat contre les trackers et les pubs. Ce secteur n’est donc plus sous monopole de Mozilla…

Par contre, Vivaldi le fait discrètement sans le crier sur tous les toits à coup de campagnes publicitaires virales (les pubs de Mozilla sur Twitter m’ont achevé).

Niveau navigateur, Firefox continue de supprimer des petites fonctionnalités pratiques de son navigateur, avec l’excuse bidon de la vitesse.
Vivaldi, lui, en ajoute. C’est un truc que j’aimais sous Opera 12, et aussi sous Vivaldi. On peut le personnaliser profondément, une fois pout toute, et après il ne traîne pas dans les pattes à faire sa pub partout à coup de notif à chaque mise à jour et sur la page « newtab ».

En somme, Vivaldi n’est pas parfait (y a deux-trois bricoles qui j’aimais mieux chez Firefox), mais il répond nettement mieux à ce que j’attends d’un navigateur aujourd’hui (et switcher a été incroyablement facile : toutes mes extensions Firefox sont également dans le Chrome Store).

gravatar
Antoine a dit :

Merci Timo pour ces éléments et ton avis motivé. J'utilise Firefox mais ça me désole aussi de constater que des fonctions (telles la pratique capture d'une page web complète au format image) sont moins immédiatement accessibles dans les dernières versions.

gravatar
Antoine a dit :

Désolé, je complète dans un deuxième temps. Je ne comprends pas qu'il n'y ait pas un peu de concurrence/émulation entre navigateurs opensource. Pour moi, après le système d'exploitation, c'est sans doute le logiciel le plus "important/utilisé" sur un poste standard au même niveau, selon les usages, qu'une suite bureautique. Je me doute bien que le développement d'un navigateur web est un projet monstrueux mais vu le caractère central du "produit", je ne trouverais pas déconnant un fork. Je sais j'écris depuis mon canapé en mode yakafokon.


Votre commentaire sera visible après validation par le webmaster.