Tab Modifier
Bonjour,
Je viens vous parler de mon projet personnel "principal". Il s'agit de Tab Modifer. C'est une extension Chrome gratuite et open-source.
La première version a été soumise sur le Chrome Web Store en février 2014 et la dernière mise à jour date d'août 2016 soit 31 releases en tout.
J'ai beaucoup travaillé et itéré sur ce projet pour arriver à un résultat qui me convient.
A quoi ça sert ?
Comme le slogan l'annonce : prenez le contrôle de vos onglets !
En effet, en configurant quelques règles, vous pourrez personnaliser les onglets de Chrome. Voici les fonctionnalités proposées :
- Renommer l'onglet
- Changer l'icône (favicon) de l'onglet
- Epingler l'onglet
- Toujours demander confirmation avant de fermer l'onglet
- Rendre l'onglet "unique"
- Couper le son de l'onglet
Et tout ça, automatiquement juste en créant des règles.
Pourquoi ?
En tant que développeur Web, il m'arrive d'avoir à ouvrir plusieurs onglets d'un même site sur plusieurs environnement différents, par exemple, le site "Back-office" qui a 3 onglets d'ouverts : version de développement (localhost), version de pré-production, version de production. Il est facile de se tromper d'onglet quand les 3 s'appellent "Back-office". Il faut sans cesse sélectionner l'onglet pour regarder l'URL complète.
C'est en ce sens que j'ai créé Tab Modifier. Je souhaitais pouvoir renommer mes onglets côté client, par exemple :
- [DEV] Back-office
- [PREPROD] Back-office
- [PROD] Back-office
Il n'était pas compliqué de gérer ceci dans l'application directement, mais je voulais proposer une solution "grand public".
Au fur et mesure d'autres fonctionnalités sont arrivées pour toucher davantage d'utilisateurs.
Comment on l'utilise ?
En installant via le Chrome Web Store, vous aurez la petite icône 
dans vos extensions. En cliquant dessus vous arriverez sur l'interface afin de créer votre première règle.
Voici un screenshot qui contient déjà des règles en exemple :
Cliquer sur le "+" ouvre une fenêtre pour créer une nouvelle règle :
Il faut donner un nom à sa règle pour la retrouver puis indiquer le fragment d'URL sur lequel appliquer la règle, prenons zestedesavoir.com/forums. On peut changer la fonction de détection, par défaut sur "Contains", ce qui signifie : "Tous les sites dont l'URL contient zestedesavoir.com/forums".
Une fois ces choix effectués, on peut indiquer quels sont les actions à appliquer (cf. celles que j'ai présentées plus haut).
Changer le titre
On peut indiquer un nouveau titre qui remplacera systématiquement l'existant, on peut également inclure des variables dans le titre, notamment des sélecteurs CSS entourés d'accolades comme {title} qui correspond au contenu de la balise HTML <title>. Voici quelques idées :
- Coucou !
- Bonjour {title}
- Contenu d'un ID : {#mon_id_html}
On peut également ajouter une expression régulière (tout en bas du formulaire qu'on ne voit pas sur le screenshot) dans le champ "URL matcher" et utiliser ces variables dans le titre.
Voici une règle complète :
- URL fragment :
github.com - URL matcher :
github[.]com/([A-Za-z0-9_-]+)/([A-Za-z0-9_-]+)(ceci correspond à l'adresse d'un projet GitHub, le premier est le nom de l'utilisateur ou de l'organisation, le second le nom du projet). - Title :
{title} | $2 by $1
$1 correspond au nom de l'utilisateur ou de l'organisation.
$2 correspond au nom du projet.
Si je me rends sur https://github.com/sylouuu/chrome-tab-modifier, le titre de l'onglet deviendra "sylouuu/chrome-tab-modifier: Take control of your tabs | chrome-tab-modifier by sylouuu". Aucun intérêt mais c'est pour l'exemple !
Changer l'icône
Soit on choisit une icône parmi une galerie intégrée, soit avec une URL externe. Ce lien doit être accessible de l'extérieur, et non pas un lien de type "file://". C'est une restriction de sécurité du navigateur.
Les autres actions
Il y a 4 autres actions/états possibles sont activables ou désactivables, sans plus de personnalisation.
- Pinned
- Protected
- Unique
- Muted
Les paramètres
Au delà de l'aspect "configuration des règles", une deuxième page propose :
- Activer des notifications en cas de nouvelle version de l'extension, option désactivée par défaut.
- Importer un fichier JSON de règles compatible.
- Exporter un fichier JSON des règles, à des fins de backup par exemple ou pour partager avec ses amis.
- Supprimer toutes les règles.
Toutes les règles et paramètres de l'extension sont stockés sur la machine du client (grâce au localStorage).
Liens utiles
- L'extension sur le Chrome Web Store. J'ai des bons retours, presque 5 000 utilisateurs, une note de 4.39/5 sur 41 votants.
- Le projet GitHub, pour le moment 106 stars pour 11 forks.
Merci de m'avoir lu pour les plus courageux, hâte d'avoir vos retours.
