{{tag>extension programmation optimisation internet navigateur firefox brouillon}}
----

====== Bookmarklet : Des Marques pages Scriptés ======

Un bookmarklet (ou un marque-page scripté) est un petit programme JavaScript qui s'exécute dans le navigateur :

    * soit en tant qu'URL dans un **favoris/marque page**, avec la plupart des navigateurs Web. 
    * soit en tant qu'hyperlien dans une page web. 

A la fois pratique pour les utilisateurs,
et pratique pour les développeurs/designers (et permet de s'ouvrir à d'autres possibilités Javascript ...).

**Les scripts bookmarklet ne sont pas nécessairement compatibles tout navigateur.**

Voir [[http://blog.jeanviet.info/partage/10-bookmarklets-pour-surfer-sur-le-web-astucieusement.htm|une introduction aux bookmarklets - avec une animation - et 10 bookmarklets pour commencer]].

===== Description =====

Les bookmarklets sont aussi appelés favelets, du fait qu'Internet Explorer associe la dénomination favoris aux signets.

Les bookmarklets peuvent être sauvegardés et utilisés comme des signets de pages normales et sont donc des outils 'en 1 clic'. Lors de la sélection du signet, le navigateur ne se contente pas d'afficher la page, mais exécute le code JavaScript du bookmarklet pour apporter des fonctionnalités intéressantes au navigateur, telles que :

    * modifier le rendu graphique d'une page web (en changeant par exemple la couleur, la police de caractères, la taille des images, etc.)
    * récupérer des informations d'une page web (hyperliens, images, texte, etc.)
    * interroger directement un moteur de recherche, en précisant l'objet de la recherche soit dans une boîte de dialogue, soit directement en le sélectionnant dans la page courante
    * soumettre la page courante à un service web tiers (par exemple ajouter automatiquement la page à del.icio.us)

L'URL d'un bookmarklet commence par javascript: et est suivie du code JavaScript à exécuter. Cependant, l'utilisation des bookmarklets est limitée car les navigateurs ont une limite de caractères pour l'URL.


===== Sélection de bookmarklet =====

   * [[http://www.bugmenot.com/faq.php#05|BugMeNot]] : trouver des logins pour le site en cour de visite.

==== Jeux====
   * [[http://erkie.github.com/|Kick Ass]]
   * [[http://fontbomb.ilex.ca/|FontBomb]]

==== Liens ====

  * [[https://www.squarefree.com/bookmarklets/pagelinks.html|Link Bookmarklets]]
     * LinkedImage : Ouvrir toutes les images pointées par des liens dans la pages.
     * LinkedPage : Ouvrir toutes les pages pointées par des liens dans la pages.
     * Openalllinks : Ouvrir tous les liens.
     * Openselectedlinks : Ouvrir les liens dans le texte sélectionné.



==== Formulaire - zone de texte ====

  * [[https://www.squarefree.com/bookmarklets/forms.html|Forms Bookmarklet]]
     * Toggle Checkboxes : Inverser les Boites à cocher.

  * [[http://www.howtocreate.co.uk/bookmarklets.html|Forms]]
     * Tick All / Untick All : Tout cocher / décocher.

==== Données - Texte - Images ====

  * [[https://www.squarefree.com/bookmarklets/pagedata.html|Text and Data Bookmarklets]]
     * Highlight : Surligner toute occurrence du texte recherché.
     * Zoomimagein : Agrandir l'image
     * Zoomimageout : Rétrécir l'image.
     * Sort Table : Trier un tableau html par ordre alphabétique.
==== Zapper des éléments ====
  * [[https://www.squarefree.com/bookmarklets/zap.html|Bookmarklets for Zapping Annoyances]]
     * Zap image : zapper les images de la page.

==== Autres ====
  * [[https://www.squarefree.com/bookmarklets/misc.html|Miscellaneous Bookmarklets]]
     * Up : monter d'un répertoire d'url.
     * Top : monter à l'url de base.
     * Increment : Incrémenter l'url.
     * Decrement : Décrémenter l'url.



==== Pour développeur & designer ====
  * **[[http://speckyboy.com/2009/02/16/32-indispensable-bookmarklets-for-web-developers-and-designers/|32 Indispensable Bookmarklets for Web Developers and Designers]]**


  * [[https://www.squarefree.com/bookmarklets/validation.html|Validation]] (en)
  * [[https://www.squarefree.com/bookmarklets/webdevel.html|Développement Web]] (en)


==== Pour amateur de site d' "image" ====

  * [[https://www.squarefree.com/pornzilla/|Les bookmarklets des Outils Pornzilla]].


===== Transformer un script Greasemonkey en Bookmarklet =====
Nous vous proposons quelques méthodes pour transformer des scripts [[greasemonkey]], ou tout autre script javascript en bookmarklet.

==== Méthode Perl ====

<code>
#!/usr/bin/env perl
#
# https://daringfireball.net/2007/03/javascript_bookmarklet_builder

use strict;
use warnings;
use URI::Escape qw(uri_escape_utf8);
use open  IO  => ":utf8",       # UTF8 by default
          ":std";               # Apply to STDIN/STDOUT/STDERR

my $src = do { local $/; <> };

# Zap the first line if there's already a bookmarklet comment:
$src =~ s{^// ?javascript:.+\n}{};
my $bookmarklet = $src;

for ($bookmarklet) {
    s{^\s*//.+\n}{}gm;  # Kill comments.
    s{\t}{ }gm;         # Tabs to spaces
    s{[ ]{2,}}{ }gm;    # Space runs to one space
    s{^\s+}{}gm;        # Kill line-leading whitespace
    s{\s+$}{}gm;        # Kill line-ending whitespace
    s{\n}{}gm;          # Kill newlines
}

# Escape single- and double-quotes, spaces, control chars, unicode:
$bookmarklet = "javascript:" .
    uri_escape_utf8($bookmarklet, qq('" \x00-\x1f\x7f-\xff));

print "// $bookmarklet\n" . $src;


</code>

Source : https://daringfireball.net/2007/03/javascript_bookmarklet_builder

==== Méthode Internet ====

<note warning>Attention : Certains scripts peuvent être dangereux, veuillez lire la description - et vérifier les avis.</note>

Nous nous proposons de transformer les scripts greasemonkey en bookmarklet - ou simple favori dans votre navigateur.

Trouvez vous un script [[greasemonkey]] intéressant sur le site [[https://userscripts.org/scripts|userscript.org]].

Ensuite faite un clic droit sur "Install" à droite -> Puis Voir le code source du script.

Copiez le contenu du fichier et passez le [[http://dean.edwards.name/packer/|dans ce générateur]] ( ou [[http://wildmary.net-sauvage.com/utils/bookgenerator.php|un autre]] ).

Collez ensuite le résultat dans un de vos favoris, sans oublier de rajouter javascript: devant le code !

<note important>Cette manipulation peut ne pas fonctionner avec tous les scripts, parfois pour certaines raisons logiques, ou parfois il vous faudra mettre vos main dans le code.</note>



===== Liens =====

  * **[[https://www.hongkiat.com/blog/100-useful-bookmarklets-for-better-productivity-ultimate-list/|100+ Useful Bookmarklets For Better Productivity | Ultimate List]]**
  * [[https://www.squarefree.com/bookmarklets/| Jesse's Bookmarklets Site]].
  * [[https://www.squarefree.com/pornzilla/|Outils Pornzilla]].
  * [[http://samrod.com/| Bookmarklet de Samrod Senasa.]] (surtout bookmarklet de site ex : wikipedia , amazon, google ... )

  * [[http://www.mvps.org/dmcritchie/ie/bookmarklets.htm|Bookmarklets  (JavaScript Favelets)]]
  * [[http://shakacss.af83.com/|ShakaCSS est un bookmarklet sympa pour débugger ses CSS, sous licence MIT.]]
  * [[http://www.marklets.com/bookmarklets/| Marklets.com - Répertoire de Bookmarklet]]
  * [[http://www.bookmarklets.com| Bookmarklets.com]]
  * [[http://www.latentmotion.com/how-to-create-a-jquery-bookmarklet/|How to Create a jQuery Bookmarklet]]

  * [[http://www.pcmag.com/print_article2/0,1217,a=116252,00.asp| Bookmarklets Boost Web Surfing]].

  * [[http://www.bookmarklet.fr/annuaire/|Petit annuaire de bookmarklet(fr)]]

  * [[http://ptaff.ca/smart/|Smart Bookmarks Bookmarklets]] (fr)


  * [[http://www.dmoz.org//Computers/Software/Internet/Clients/WWW/Browsers/Bookmarklets/|Catégorie bookmarklet sur dmoz]]


----

//Contributeurs :  [[:utilisateurs:psychederic|Psychederic]].//