Editing HTML (and More) with Bluefish

14 October, 2020

If you were building web pages back in the 1990s, you might remember all of the dedicated HTML editors that were out there. If you were anything like me, you tried more than a couple of them.

Most of those editors have faded from memory, their bits and bytes dispersed ... well, wherever they’ve been dispersed to. One of the few that survived on the Linux desktop is Bluefish. And it survived for a good reason. Bluefish is a solid HTML editor that’s actually more than an HTML editor.

Let’s take a look at it.

Getting Bluefish

The fastest and easiest way to do that is to install it using your Linux distribution’s package manager or software centre.

You can also grab an installer from the Bluefish website or flex your techie muscles and compile the editor’s source code.

Working with Bluefish

When you fire Bluefish up for the first time, the interface is reminiscent of the Geany text editor.

Bluefish when you first start it up

You can get underway by:

Editing an HTML file with Bluefish

You can insert the most commonly-used HTML tags by clicking a toolbar button. Those buttons aren’t always the most intuitive, though, especially if not familiar with all of the HTML tags that they represent.

The buttons are grouped under tabs — for example, Formatting, Fonts (which includes headings and font styles), and Tables.

Toolbar buttons and tabs in Bluefish

It can be a bit of a pain to jump between tabs to find the buttons that you need. You can, however, right click on any button and select Add to Quickbar to put the button under the Quickbar tab

Bluefish also has several wizards for creating a new page, lists, tables, and a CSS file (to format your pages). This enables you to set those constructs up quickly and correctly.

The table wizard in Bluefish

There’s no live preview. After you save the file you’re working on, you can click the Preview in browser button to open it in your default web browser.

Creating Projects

Using an editor like Bluefish for cobbling together individual web pages can seem like a bit of a waste of its flexibility. But what if you want to create and maintain a full website? You can do that by creating a project, which enables you to better organize all the elements of your website.

To create a project, select Project > New Project.

Creating a new project in Bluefish

In that window, enter the name of your project and select the template to use from the Templates list. Then, click Create Project. Bluefish asks you where you want to put save the project. Choose a folder and then click Save.

Then, add files to your project. The fastest way to do that is to right click in the lower part of the pane on the left side of the screen. Then, select New File. When asked, give file a name and click Save. You can also add a folder (for, say, images) by right clicking and selecting New Directory.

When you need to work on you website, select Project > Open Project.

More Than Just an HTML Editor

You can do more than just edit HTML in Bluefish. It’s also a basic IDE for programming and scripting. You can code in PHP, Python, C, JavaScript, and other languages. I’m not a coder, so I can’t tell you know how well Bluefish works as an IDE.

Bluetooth is also a serviceable plain text editor. With this tool, you wind up with a pretty flexible package.

Final Thoughts

If I was working on the web a bit more seriously, Bluefish would be my go-to editor. While I could use it for my general text editing, it’s a bit heavy for my taste — heavier than my usual editor.

Bluefish is a solid HTML editor that does a little bit more. And I have to admit I have a soft spot for it, if only because it reminds me of some of the dedicated HTML editors that I used in the 1990s.

Scott Nesbitt