Extensions pour le navigateur Vivaldi. Comment télécharger des plugins dans le navigateur Vivaldi. Recherche rapide par onglet

25.06.2020

L'extension que vous créez peut être intégrée à l'interface du navigateur (non pas en tant qu'extension supplémentaire, mais en tant que partie intégrante du navigateur). Désolé pour la tautologie.

Tu auras besoin de:

Connaissance des bases de CSS, HTML, JS et travail avec DOM.
Si vous avez peur, vous pouvez utiliser les annuaires en ligne (comme moi).
Éditeur de codes. Tout ce que votre cœur désire, de préférence avec le rétroéclairage Javasvript. J'utilise Sublime Text 3.
Au moins une demi-heure de temps libre

Pas zéro. Tricherie

Créez un fichier MyLinks.user.js (assurez-vous d'ajouter .user., sinon le navigateur ne comprendra pas qu'il s'agit d'une extension) dans n'importe quel répertoire approprié. Ouvrons-le.

Afin de raccourcir le code, j'ai utilisé une fonction qui simplifie la création d'éléments html à partir de js (je joins un lien vers la source) :

Fonction create(nom, attributs) (
var el = document.createElement(nom);
if (type d'attributs == "objet") (
pour (var i dans les attributs) (
el.setAttribute(i, attributs[i]);
}
}
pour (var je = 2;je< arguments.length; i++) {
var val = arguments[i];
if (typeof val == "string") ( val = document.createTextNode(val) );
el.appendChild(val);
}
retourner el;
}

La première étape. Et le deuxième... et le troisième...
Tout d'abord, nous devons créer un conteneur (carré) dans lequel nos liens seront stockés :

var linkBox = create("div", ( identifiant : "linkBox"));

Vous pouvez immédiatement définir des styles pour cela, pour plus de commodité. j'ai utilisé la méthode style.cssTexte :

linkBox.style.cssText = " largeur : 180 px ; position : fixe ; haut : 100 px ; droite : 0 px ; z-index : 999 ; arrière-plan : #fff ; rembourrage : 10 px ; ombre de la boîte : 0 0 20px 0px #999 ; affichage :flex;flex-direction:colonne;justify-content:espace-entre;text-align:left;";
var lienVivaldi = create("a", ( href : "https://forum.vivaldi.net/category/20/%D1%80%D1%83%D1%81%D1%81%D0%BA%D0% B8%D0%B9"),
"Forum Vivaldi RU");
var habr = create("a", (href : "https://habrahabr.ru/top/"), "Habrahabr");
var vk = create("a", (href : "https://vk.com/vaskm"), "Vkontakte")

LinkBox.appendChild(linkVivaldi);
linkBox.appendChild(habr);
linkBox.appendChild(vk);

Nous mettons notre boîte, en effet, sur la page :

Document.body.appendChild(linkBox);

Ajouter le masquage automatique de notre boîte par timeout :

LinkBox.onmouseover = fonction ()(
if (document.querySelector("#linkBox").style.right == "-180px") (
document.getElementById("linkBox").style.right = "0";
setTimeout(5000);
}
setTimeout(function())(document.getElementById("linkBox").style.right = "-180px";), 5000);
};

Ah oui, nous avons oublié. Ajoutez une bande bleue à gauche. Au départ, il était destiné à servir de bouton, puis est resté uniquement pour la beauté :

var toggler = create("span", ( id:"boxToggler"), "");
//ajoutez-le immédiatement à notre box
linkBox.appendChild(toggler);

Les styles peuvent être écrits non seulement par des instructions explicites via js (comme ci-dessus).
De nombreux forums disent qu'il est impossible de connecter votre fichier CSS depuis le navigateur. Par conséquent, nous allons créer notre propre fichier à l’intérieur du document. Avec flexbox et marges.

// Créez votre propre style CSS
var style = document.createElement("style");

Ajoutez des styles avec innerHTML normal (n'oubliez pas de mettre += , sinon chaque entrée effacera la précédente) :

// décore la bande de gauche. Vous pouvez l'ajouter via :avant
style.innerHTML = "#boxToggler(content: ""; position:absolute; top:0; bottom: 0; left: -10px; width: 14px; background: bleuet;)";

//la décoration elle-même
style.innerHTML+=" #linkBox a(padding: 5px 0 0 5px; line-height:8px; height:16px; font-size:14px;)";
style.innerHTML+="#linkBox a:hover(background: #ddd; text-decoration: none;)";
style.innerHTML+="#linkBox span(text-align: center;)";

Nous avons créé un fichier avec des styles, il ne reste plus qu'à le mettre dans notre document, traditionnellement en<tête>:

Document.head.appendChild(style);

Sauvons maintenant notre fichier. Ouvrez la page des extensions vivaldi://extensions/, cochez Mode développeur et faites glisser notre fichier directement dans la fenêtre. Une boîte de dialogue devrait apparaître avec l'autorisation d'installer. Nous sommes d'accord. Nous ouvrons n’importe quel site Web. Profitons-en. Pour ajouter une extension à la fonctionnalité principale du navigateur, nous plaçons notre fichier dans le répertoire racine du navigateur et écrivons le chemin d'accès dans le fichier browser.html.

Une extension est un petit logiciel qui peut être installé pour donner des fonctionnalités supplémentaires au navigateur Vivaldi. Les extensions vous permettent de personnaliser et d'améliorer davantage votre utilisation du navigateur et vont des outils de médias sociaux aux fonctionnalités liées à la confidentialité telles que le blocage des publicités.

Extensions à Vivaldi

Bien que Vivaldi vise à fournir autant de fonctionnalités intégrées que possible, de nombreux utilisateurs affinent davantage l'expérience de navigation à l'aide d'extensions.

Étant donné que Vivaldi est construit à l'aide du projet de navigateur Web Chromium, les extensions disponibles dans le Chrome Web Store peuvent également être installées dans Vivaldi. Dans certains cas, les extensions créées pour le navigateur Chrome se comporteront différemment lorsqu'elles seront installées dans Vivaldi, mais la plupart de vos extensions Chrome préférées fonctionneront parfaitement dans Vivaldi.

Si une extension ne fonctionne pas comme prévu, veuillez nous en informer en envoyant un e-mail à l'équipe d'assistance de Vivaldi en utilisant le formulaire de contact sur notre site Web. Contacter les développeurs d’extensions peut également aider.

Installer une extension dans Vivaldi :

Accédez au Chrome Web Store ;
Sélectionnez le Rallonges catégorie;
Recherchez l'extension souhaitée ;
Cliquez sur Ajouter à Chrome pour installer l'extension dans Vivaldi.

Autoriser les extensions tierces à contrôler la page de démarrage

Pour avoir une page de démarrage personnalisée utilisant une extension :

Ouvrez Vivaldi ;
Aller à > Page Nouvel onglet;
Cochez le Contrôlé par extension case à cocher.

Gestion des extensions

La page Extensions donne un aperçu des extensions actuellement installées, la possibilité de désactiver ou de supprimer des extensions et d'ajuster les paramètres spécifiques aux extensions.

Accéder à la page Extensions

La page Extensions est également accessible par :

en utilisant un raccourci clavier Ctrl Shift E / ⌃ ⌘ E ;
dactylographie Rallonges» dans les commandes rapides ;
faites un clic droit sur un bouton d'extension dans le et en sélectionnant Gérer les extensions;
en entrant vivaldi://extensions dans le ;
créer un pour l'action.

Masquage des boutons d'extension dans la barre d'adresse

Pour masquer un bouton Extension, ouvrez le menu contextuel avec un clic droit sur le bouton Extension et sélectionnez Masquer le bouton. Utilisez le Basculer les extensions bouton pour afficher ou masquer les extensions masquées. Les extensions masquées ont une couleur d’arrière-plan légèrement différente. Pour afficher à nouveau le bouton de manière permanente, faites un clic droit sur l'extension et sélectionnez Afficher le bouton.

Nous pouvons affirmer avec confiance qu'en termes de nombre de paramètres disponibles, Vivaldi est en avance sur tous ses concurrents. Apparence, fonctionnalité, performances - tout dans ce navigateur peut être personnalisé selon vos goûts et vos besoins. Bravo Vivaldi !

2. Groupes d'onglets

Le regroupement d'onglets était l'une des fonctionnalités phares d'Opera 12. Les utilisateurs qui travaillaient avec de nombreux onglets idolâtraient simplement cette fonctionnalité, qui leur permettait de ranger les sites ouverts avec quelques mouvements élégants.

Vivaldi a aussi exactement la même opportunité. Si vous n’y croyez pas, voyez par vous-même et parlez-en à vos collègues. Ce n'est que pour cela que l'on peut ériger un monument à vie aux promoteurs et danser en rond autour de lui.

3. Effets de page

Parmi les nombreuses fonctionnalités héritées du bon vieil Opera, on trouve également des filtres CSS spéciaux. Avec leur aide, vous pouvez appliquer un certain nombre de filtres intéressants et/ou utiles à n'importe quelle page, en modifiant son apparence. De cette façon, les utilisateurs ont la possibilité de corriger le mauvais goût de certains concepteurs de sites Web qui créent des pages absolument accrocheuses, et même d'activer un mode de lecture spécial.

4. Thèmes

De nombreux navigateurs prennent en charge les thèmes. Mais le plus souvent, cela signifie que vous pouvez simplement y insérer votre propre image comme arrière-plan. Vivaldi est allé beaucoup plus loin dans cette direction. Ce programme peut être coloré littéralement comme vous le souhaitez : arrière-plans clairs avec des onglets colorés, arrière-plans sombres avec des boutons clairs - tout dépend de votre imagination.

Il serait utile de rappeler que ce navigateur prend en charge la fonction de changement dynamique d'interface en fonction de la couleur de la page chargée. Il a l'air frais et ne devient jamais ennuyeux.

5. Informations dans la barre d'adresse

Le panneau d'adresses Vivaldi, en plus de ses responsabilités directes, sert également d'indicateur de chargement. Lorsque vous ouvrez une nouvelle page Web, elle affiche une barre de progression, la vitesse et le nombre d'éléments déjà chargés. Fonctionnalité méga pratique et utile.

6. Téléchargements et favoris dans la barre latérale

J'aime Chrome, mais la façon dont il gère les téléchargements ne résiste pas aux critiques. Le panneau inférieur n'est pas très pratique et pour afficher une page spéciale avec les téléchargements, vous devez parcourir un menu à plusieurs niveaux. Les choses ne vont pas mieux avec les signets.

Chez Vivaldi, tout est beaucoup plus simple et pratique. Tous les favoris et téléchargements se trouvent dans une barre latérale multifonctionnelle, accessible en un seul clic. Le même panneau existait dans l'ancienne version d'Opera, oui.

7. Notes intégrées

Une autre super fonctionnalité, directement d'Opera. Le preneur de notes intégré à la barre latérale vous permet d'enregistrer rapidement toutes les informations de la page actuellement ouverte, y compris les textes, liens, captures d'écran et fichiers. Un outil indispensable pour ceux qui non seulement s'amusent sur Internet, mais travaillent aussi.

8. Captures d'écran

Au travail, je dois très souvent faire des captures d'écran de pages. La présence chez Vivaldi d'un outil pratique pour les créer ne peut que se réjouir. Je suis sûr que je serai soutenu par de nombreux journalistes, designers, développeurs, blogueurs et autres personnes qui prennent souvent des photos de sites Web.

9. Commandes rapides, raccourcis clavier, gestes

Chaque utilisateur a ses propres méthodes préférées pour interagir avec l'ordinateur. Certains préfèrent les raccourcis clavier, d'autres utilisent principalement la souris. Donnez à certains une interface graphique belle et compréhensible, tandis que d'autres ne peuvent pas vivre sans la ligne de commande.

Le navigateur Vivaldi peut satisfaire toutes les catégories d'utilisateurs. Il dispose de raccourcis clavier, de commandes gestuelles de la souris et même d'une sorte de ligne de commande intégrée qui apparaît lorsque vous appuyez sur la touche F2. Avec son aide, vous pouvez accéder rapidement à l'onglet souhaité, trouver le mot requis sur la page, modifier les paramètres, c'est-à-dire effectuer presque toutes les actions.

10. Panneaux Web

J'ai déjà consacré plusieurs points à la barre latérale de Vivaldi, mais cela ne suffit toujours pas pour lister toutes ses fonctions. L'un de mes favoris est les panneaux Web intégrés. Cette fonction vous permet d'ouvrir tous les services nécessaires dans la barre latérale. Très pratique : vous pouvez placer ici un traducteur, un lecteur de musique, une liste de tâches et tout autre service que vous utilisez souvent.

Bien entendu, ce ne sont pas tous les avantages du navigateur Vivaldi. Contrairement à certains autres navigateurs Web, il présente tellement d'avantages et de caractéristiques distinctives qu'il n'est pas possible de les résumer en dix points. Je serais heureux si vous complétiez cette liste dans les commentaires.

J'utilise le navigateur Google Chrome depuis quelques années. C'est bon pour tout le monde, mais il y a des problèmes de performances. Lorsque vous ouvrez un grand nombre d'onglets - plus de 20 pièces - cela commence à ralentir. Son problème est l'utilisation du disque. Lorsque j'ai remplacé le disque de mon ordinateur portable par un SSD, les performances du navigateur ont considérablement augmenté. Et le système dans son ensemble. Mais même maintenant, ce problème n'a pas disparu - Chrome charge étrangement le disque.

J'ai entendu parler du navigateur Vivaldi (par M. Vigner). Il s'avère qu'il s'agit de la réincarnation du navigateur Opera sur le moteur Chromium, le même sur lequel est réalisé Google Chrome. Plus précisément une fourchette. Il était une fois mon navigateur préféré et principal. Mais ensuite quelque chose lui est arrivé et j’ai arrêté de l’utiliser.

J'ai aimé les paramètres flexibles ; vous pouvez personnaliser absolument tout ce que vous voulez. Il y avait un excellent client de messagerie. Au fait, oui, c'est la raison pour laquelle j'ai arrêté de l'utiliser : le client de messagerie a été supprimé. En général, j'ai décidé d'essayer ce Vivaldi. Mettre. Cela semble bon. Mais après un mois d'utilisation, je suis revenu sur Chrome, trouvant un tas de défauts et aucun avantage tangible par rapport à Chrome.

Extensions sur Vivaldi

Ils peuvent être installés exactement de la même manière que ceux installés sur Google Chrome.

Ce que j'ai immédiatement fait, c'est d'installer un adblock.

D'ailleurs, dans ce navigateur, je n'avais pas besoin d'utiliser , ce qui permet d'enregistrer tous les onglets et fenêtres ouverts, c'est-à-dire toute la session.

Ensuite, à tout moment, vous pouvez ouvrir n'importe lequel des sites de cette session. Cela peut être pratique lorsque vous devez passer rapidement à d'autres tâches et sites. Disons que je suis en train de configurer des serveurs, j'ai trois fenêtres ouvertes avec 10 à 15 onglets chacune, avec différents manuels, documents techniques, sites de test. Alors bam, vous devez supprimer tout cela de toute urgence et passer à la résolution d'un problème domestique, par exemple trouver un appartement. Si vous ouvrez plusieurs onglets ou fenêtres uniquement dans ce but, vous risquez de vous perdre complètement et les ressources de l'ordinateur ne sont pas en caoutchouc - il ralentira.

Nous devons fermer quelque chose et libérer les ressources du cerveau et de la machine. Mais après avoir résolu ce problème, vous devrez revenir à celui qui a été interrompu. Pour que plus tard je n'aie pas à me rappeler douloureusement pourquoi tout a été abandonné et ce qui a été fait en général, pour ne pas avoir à chercher à nouveau des manuels, j'utilise des sessions de sauvegarde. J'ai chargé la session et je me suis rapidement mis au travail. Ainsi, Vivaldi supporte cette fonction de manière native, sans extensions.

Parmi les avantages, c'est probablement tout. Eh bien, comme tout le reste, le navigateur est bon pour les utilisateurs exigeants. C’est juste que les autres avantages ne le distinguent pas, car ils sont présents dans n’importe quel navigateur basé sur Chromium. Y compris sa version la plus connue et la plus répandue, Google Chrome.

Que sont les navigateurs basés sur Chromium

À propos, oui, si vous pensiez que le navigateur Yandex, Amigo, Google Chrome et Vivaldi sont des navigateurs fondamentalement différents, alors ce n'est pas le cas. C'est essentiellement la même chose, les différences entre eux ne sont qu'externes - toutes sortes de gadgets tels que des barres, des boutons, des inserts, des logos. De nos jours, seuls les paresseux n’ont pas construit leur propre navigateur basé sur Chromium.

Mais les mêmes extensions conviennent à tous ces navigateurs, ils traitent les pages en utilisant les mêmes mécanismes et même leurs paramètres fins sont les mêmes. Car tous ces navigateurs sont basés sur le même moteur Chromium. Au fait, ne confondez pas Chromium et Chrome.

Mais revenons à Vivaldi. Pourquoi ne m'a-t-il pas autant plu ?

Comme je l'ai déjà dit, cela ne montre aucune amélioration des performances. Tout se bloque de la même manière que dans Chrome lors de l'ouverture d'un grand nombre d'onglets.

N'affiche pas de notifications lorsqu'un nouveau courrier est reçu dans des onglets comme Gmail

J'utilise la messagerie Web dans des onglets épinglés et j'ai besoin d'une sorte de notification lorsque de nouveaux messages arrivent. Lorsque cela se produit dans Chrome, l'onglet commence à «éblouir». Vivaldi ne dispose pas d'une telle fonctionnalité, vous pouvez donc parfois manquer certains messages importants auxquels vous souhaitez répondre rapidement.

Déplacer les onglets entre les fenêtres

La plupart des navigateurs ont depuis longtemps la possibilité de simplement glisser-déposer la souris, ce qu'on appelle. « glisser-déposer », extraire un onglet comme une nouvelle fenêtre ou lancer des onglets entre les fenêtres. J'ai été surpris, mais ce n'est pas chez Vivaldi. Vous pouvez uniquement ouvrir une nouvelle fenêtre, y ouvrir un nouvel onglet et copier l'adresse. Et puis fermez l'onglet dans la première fenêtre. Il y a trop de mouvements corporels pour une telle fonctionnalité nécessaire.

Outils de développement dans le Dock

C'est peut-être devenu la principale pierre d'achoppement dans mon utilisation de ce navigateur. Le fait est que j’administre et configure des serveurs et qu’il existe de nombreuses tâches liées à l’optimisation du site Web. C'est pourquoi le débogueur intégré au navigateur est l'un de mes principaux outils de travail. Grâce à lui, vous pouvez tester la vitesse du site, regarder les en-têtes http envoyés par le serveur. Vous pouvez visualiser les erreurs d'affichage des pages ou connaître l'adresse IP du site.

En général, sans lui, c'est comme être sans mains. Cette chose s'ouvre généralement dans le même onglet où la page elle-même est ouverte ; cela s'appelle le dock. Cela fonctionne dans Chrome et Firebug dans Mozilla, et même dans les débogueurs des navigateurs Windows, Edge par exemple. Vivaldi ne sait donc pas comment lancer le débogueur dans le dock.

Il l'ouvre dans une fenêtre séparée. Et c’est dix fois moins pratique que sur le quai. C'est très étrange, car lorsque j'utilisais Opera il y a de nombreuses années, il était capable d'ouvrir son Dragonfly dans le dock. En général, quand j'étais sur Vivaldi, je devais encore lancer Chrome. J'ai toujours deux navigateurs en cours d'exécution, en plus du principal, j'ai toujours Firefox en cours d'exécution avec plusieurs onglets, car je l'utilise pour travailler et il est toujours configuré via un proxy, dont j'ai aussi très souvent besoin, car j'ai également configuré un proxy .

Ainsi, si vous utilisez Vivaldi et lancez même Chrome pour le débogage, il s'avère que trois navigateurs sont déjà en cours d'exécution. Ce n’est pas grave, mes amis. C'est pourquoi je suis revenu sur Chrome. De plus, il existe une merveilleuse béquille xtab, qui permet de limiter le nombre d'onglets ouverts et ainsi de « résoudre » idiotement le problème des performances de Google Chrome.

C'est l'histoire, messieurs. Quel navigateur utilisez-vous?

Le navigateur Vivaldi est le dernier développement de spécialistes informatiques qui ont créé une extension basée sur Chromium. Malgré le fait que le navigateur soit apparu relativement récemment, de nombreux utilisateurs ont déjà découvert les fonctions de ce logiciel.

Aujourd'hui, des millions d'utilisateurs suivent avec grand intérêt l'évolution du navigateur et attendent des fonctionnalités supplémentaires. Étant donné que le navigateur est en cours de test, des erreurs se produisent souvent lors du lancement de l'extension.

Certaines personnes pensent que le crash du système est dû à des problèmes avec l'ordinateur. Cependant, nous nous empressons de vous faire savoir que ce problème est une panne du système qui sera résolue dans un court laps de temps. C'est ce que disent les développeurs du nouveau logiciel. Et avant que les professionnels n'améliorent la nouvelle version de l'extension, nous vous proposons de vous familiariser avec les fonctionnalités de Vivaldi.

Il convient de noter que les options et l'interface de Vivaldi sont assez similaires à celles de Chromium. Ce n’est pas pour rien que des experts ont développé un navigateur utilisant les technologies du moteur Chromium. La version 1.0.249.12 vous permettra d'utiliser l'extension. Il faut tenir compte du fait que Vivaldi est téléchargé depuis le portail Web officiel. Il est recommandé de télécharger la nouvelle version depuis le Chome Web Store. Grâce à un panneau d'extension spécial, des boutons apparaîtront devant vous.

Un panneau s'ouvre sur le côté gauche, également appelé barre latérale. Cette option inclut désormais des signets, des blocs-notes, des téléchargements et de nouveaux portails Web s'ouvrent. Pour utiliser des options supplémentaires, vous devez ajouter une nouvelle page et saisir l'adresse. Lorsque le panneau apparaît, vous devez utiliser le panneau latéral, qui contient divers services Web. Cette fonctionnalité est conçue pour le confort de l’utilisateur.

Les personnes intéressées peuvent utiliser la version mobile. Un navigateur pratique et sécurisé n’endommagera pas votre ordinateur, car il dispose d’un serveur de sécurité. Dans un avenir proche, les utilisateurs pourront utiliser les extensions Vivaldi, car les développeurs testent encore le nouveau navigateur. Afin de garantir le fonctionnement du navigateur, vous devez installer AdBlock. A noter que cette extension est supportée par tous les navigateurs.

Si vous utilisez le bouton gauche, vous pouvez accéder à la section courrier. Le gestionnaire de téléchargement est installé exactement de la même manière que sur le navigateur Opera. À l'aide des paramètres, vous pouvez personnaliser l'interface, modifier le design et l'arrière-plan et définir la police.

Un regroupement pratique d'onglets vous permet de gérer les cookies, une liste d'onglets fermés, les affichages d'images et la prise en charge des moteurs de recherche.

Tout le monde peut télécharger l'aperçu technique, qui permet de gérer la messagerie, les extensions de navigateur, la navigation, etc.

Des technologies innovantes ont été utilisées pour créer un navigateur innovant. Le logiciel prend en charge des extensions telles que React et javascript. L'interface utilisateur est prise en charge par Node.js.

Pour ajouter un nouveau panneau, vous devez cliquer sur « + » et saisir l'URL. En ajoutant un panneau Web, vous verrez un panneau latéral, qui, à son tour, est intégré aux panneaux du navigateur. En cliquant sur le portail Web, la page correspondante s'ouvrira, qui donnera accès à des programmes tels que Skype, Twitter, Facebook, TollSjekk, Techmeme, Hackernews.

Vivaldi peut être téléchargé depuis le portail officiel. L'extension est disponible pour Linux, Windows, Mac. Bientôt, les développeurs ouvriront l'accès à d'autres appareils. Afin d'améliorer le nouveau navigateur, vous devez suivre les instructions. En contactant les développeurs de Chromium, vous pouvez poser des questions qui vous intéressent.