Créer un script bookmarklet en JS

Qu’est ce qu’un bookmarklet ?

Un bookmarklet (ou « marque-page scripté ») est un petit script JavaScript enregistré en tant que favori / marque-page de votre navigateur web. Le contenu du script est enregistré dans le champ URL du bookmark.

On peut ainsi les exécuter sur n’importe quelle page web en 1 clic !

Très appréciés des développeurs, on peut par exemple les utiliser pour :

• Récupérer les informations de la page (texte, hyperliens, images…)
• Traduire une page web
• Supprimer les publicités d’une page web
• Modifier le rendu graphique d’une page web (couleurs, polices, tailles…)
• Interroger un moteur de recherche en précisant l’objet de la recherche dans une boîte de dialogue prompt() ou en le sélectionnant directement dans la page
• Télécharger une page web au format PDF
• Envoyer des données du site à une autre adresse (un service web tiers)
• Etc.

Ils permettent ainsi de se créer très simplement des outils web basiques, sans passer par la complexité de l’écosystème des extensions navigateur.

Créer un bookmarklet

#1 Écriture du script

Un bookmarklet est un script JavaScript standard commençant toujours par javascript:.

En voici un exemple :

javascript: (function () {
	console.log("Hello World!");
})();

#2 Création du bookmarklet

Une fois votre script codé, il ne reste plus qu’à l’intégrer dans un bookmark.

1. Copiez (CTRL+C) le script JS dans votre presse-papier
2. Créez un nouveau marque-page / favori dans votre navigateur
3. Nommez explicitement votre marque-page selon ce qu’il fait. Exemple : Remove Ads
4. Collez (CTRL+V) le script JS copié dans le champ URL ou lien
5. Enregistrez le marque-page

#3 Utilisation du bookmarklet

Pour utiliser le script, rendez-vous sur la page web sur laquelle vous souhaitez exécuter le script, puis cliquez sur le marque-page dans la barre de favoris de votre navigateur.