Utiliser un éditeur de source externe sous Firefox

Utiliser un éditeur de source externe sous Firefox

Publié le 12. nov, 2009 par Aurélien Denis dans Firefox | 7 commentaires | 2 405 vues

Visualiser le code source d’une page Web est très pratique pour apprendre les techniques utilisées par le créateur d’un site Web. Pour autant, l’outil de prévisualisation de source inclut dans Firefox n’est guère très poussé. Remplaçons-le par un éditeur de texte externe comme Notepad++ qui décuplera les possibilités de modification.

Lancez une nouvelle instance de Mozilla Firefox puis saisissez about:config dans la barre d’URL.

Passez l’avertissement en cliquant sur le bouton Je ferai attention, promis !

Capture décran - Mozilla Firefox, message davertissement pour laccès à about:config

Capture d'écran - Mozilla Firefox, message d'avertissement pour l'accès à about:config

Recherchez ensuite les valeurs suivantes :

  • view_source.editor.external : double-cliquez dessus pour la basculer sur True ;
    Capture décran - Mozilla Firefox, passage sur True pour autoriser les éditeurs externes

    Capture d'écran - Mozilla Firefox, passage sur True pour autoriser les éditeurs externes

  • view_source.editor.path : indiquez le chemin de l’application qui servira d’éditeur externe. Par exemple, C:\Program Files\npp.4.8.2.bin\notepad++.exe. Ne saisissez pas de guillemets car cela ne fonctionnera pas ;

    Capture décran - Mozilla Firefox, chemin de lapplication externe

    Capture d'écran - Mozilla Firefox, chemin de l'application externe

Faites à présent un clic droit sur la page Web de votre choix puis Code source de la page. Dans cet exemple, Notepad++ se lance vous permettant d’éditer la source.

Capture décran - Notepad++, édition de la page Firefox Start (Google.fr)

Capture d'écran - Notepad++, édition de la page Firefox Start (Google.fr)

Cette astuce est définitivement incontournable pour les développeurs Web, de même que l’utilisation de Firebug.

Tags: ,

ARTICLE PRECEDENT ARTICLE SUIVANT
icone commentaire

7 Réponses pour “Utiliser un éditeur de source externe sous Firefox”

  1. serge

    24. nov, 2009

    Magnifique!Merci pour cette info – c’est énormément de temps gagné. Je utilise notepad++, CSS free Toolbox et firebug avec IE Tab pour développer mon blog. Trois sur quatre je trouvé grâce à vous les gars. Maintenant cet article vas me encore aider ;) Merci.P.S. on peut ajouter que pour trouver le editor.path il suffit clic droit sur le raccourci de Notepad++ sur le bureau -> propriétés -> copier « Cible » ( sans quottes )

    Reply to this comment
  2. Maigret

    25. nov, 2009

    @serge : merci de ton commentaire et bonne remarque pour trouver le chemin ! :cool:

    Reply to this comment
  3. serge

    25. nov, 2009

    C’est avec plaisir.En revanche tu sais si c’est possible de éditer les fichiers avec notepad++ en passant par FileZilla ( de même que de les ouvrir avec Firefox ) car dans l’option « éditer » de filezilla le blocknote est utilisé par défaut. On peut changer ça?

    Reply to this comment
  4. Maigret

    26. nov, 2009

    @serge : bien sûr que c’est possible ! :)

    Vas dans Edition puis Paramètres. Cliquez sur Editions des fichiers puis configures ton éditeur de texte favori.

    Ensuite, quand tu édites un document, fais Ctrl + S pour l’enregistrer puis bascules de nouveau sur la fenêtre de FileZilla. Une boîte de dialogue t’invite alors à remettre en ligne le fichier que tu viens de modifier.

    Sinon, pour Notepad++ il existe un plugin FTP. C’est très pratique pour faire des modifications de code : http://sourceforge.net/projects/npp-plugins/files/FTP_synchronize/FTP_synchronize_0_9_6_1_dll.zip

    Reply to this comment
  5. serge

    27. nov, 2009

    Merci Maigret,encore des minutes libres en plus … De que l’accès web, je l’installe ( je passe pour l’instant par PC+SonyEricson+Bouygue option WebMail / 10€ au lieu de 30 de la clef 3G+  mais FTP et téléchargement passent pas toujours) A+

    Reply to this comment
  6. Fredy

    12. fév, 2010

    Perso, j’ai testé mais la plupart du temps, j’utilise l’option « voir le code source de la sélection » et malheureusement, ça ne s’ouvre pas dans notepad++. J’ai donc désactiver l’option.

    Reply to this comment
icone nouveau commentaire

Laisser une Réponse

XHTML: Vous pouvez utiliser ces tags : <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Plus dans Firefox (5 sur 5 articles)