Add And Use Multiple Source Code Editors In Firefox
The Firefox web browser will display the source code of any website by default in its own interface.
There are two configuration parameters that can be set so that another external source code viewer is used for viewing source codes (setting view_source.editor.external to true and view_source.editor.path to the path of the external editor on the local hard drive in about:config)
But what if a user wants to use different source code viewers and editors depending on the object to be analyzed? Some web designers might want to view HTML code in a program like Notepad++ but XML or CSS in a different program that is better suited for that code.
Update: Firefox users can use Firefox's own Developer Tools which have improved greatly in recent years for viewing sources of all types of code. But some may want to load code in external programs still. End
Firefox: Change Source Code Editor
Dafizilla ViewSourceWith is the ultimate Firefox add-on for this purpose. The add-on can be used to add multiple source code editors, image viewers and editors, and other editors to the web browser which can then be selected to open a specific object or file in Firefox.
A right-click displays an additional View ... item which depends on the item the right-click was performed on.
It can be View Source or View Image for instance depending on whether you right-click on a blank spot on the page or an image. This means that you can use the add-on for more than just viewing the source code in different programs.
The programs that you want to use in Firefox for viewing and editing source code and other web elements need to be configured in the extension's options first. This is done easily, as you just have to add the path to the application to do so. You can also change parameters that are passed to the program -- not required usually --, or add a description.
The add-on supports relative and absolute paths which is great for portable use. Keyboard shortcuts can be configured so that it becomes even easier to open objects in external programs.
Firefox users can also:
- open page source as DOM document
- open CSS and JS files present on page
- open images using your preferred image viewer (e.g. GIMP or ACDSee)
- open PDF links with Acrobat Reader or Foxit Reader or what you prefer
- edit textboxes content with your preferred editor and automatically see modified text on browser when you re-switch focus on it, this simplifies wiki pages editing
- open server side pages that generate the browser content, this simplifies web developer's debug
- open files listed in Javascript console. When editor opens file the cursor can be moved to line number shown on javascript console
Dafizilla ViewSourceWith is available for all Firefox versions. The developer maintains several faqs on the project website which can help in configuring the program for advanced uses.
