Helper programs

You can do just about everything text-related with BBEdit, but even so, sometimes you can incorporate other programs into your workflow to make life even better.

ImageOptim

Everybody should have a copy of ImageOptim and use it religiously. This great free little utility allows to you compress JPG, PNG, and GIF image files, which can sometimes have astonishing amounts of non-essential information in them.

Image compression used to be important in the old days before broadband became more widespread, but it might be argued that it is even more important now with all the handheld devices out there on LTE and 4G networks.

Microsoft Excel

BBEdit has some great table tools, but Excel allows so many shortcuts it can be a real asset.

Datatables.js and tablecloth.js.

PHP

[using PHP for includes and some other basic tasks instead of (or alongside) BBEdit includes, or SHTML]

FTP programs

After awhile, using BBEdit to transfer your files to your server will morph from a great feature into the bane of your existence … Usually after your site grows beyond a certain number of files. This is because while BBEdit is uploading your files, you can’t use it for anything else. Yes, I know this is a good idea, but if you are as impatient as I am, waiting for BBEdit to chew through all your files both on your local computer and on your server will seem to take forever, and that just won’t do. Fetch has been around for decades, and for most of that time was my go-to FTP program because it seemed always to work. You can even create a worksheet entry that involves Fetch and uploads your files, allowing you to go back to BBEdit. With Transmit, though, after the first upload, it knows which files are changed, and just works on those. Even on sites with thousands of pages, uploading that one changed page takes mere moments. It’s uploading bliss.

Local servers

One of BBEdit’s many HTML-friendly features is the built-in Preview, which we have already used. If for any reason you want to preview your pages using a different approach (and you are not using CodeKit for some reason), you have a bunch options, some better than others.

With only a couple of files and not much in the way of content, it’s fairly easy to FTP your files to your server, and then use your browser to visit your site online to verify that everything looks and works the way you want. As your site grows, it’s a really bad idea to use your live website as your only way of checking to see that everything is OK. Better to set up a server on your Mac so you can preview all the files there before uploading.

CodeKit

CodeKit can help with this, even though out of the box it works only with HTML files. However, if you have another local server set up, you can tell CodeKit to use it instead of CodeKit’s built-in server, so you can previow PHP, SSI/SHTML, CGI, etc., as long as your local server is set up. Very slick.

Anvil for Mac

Anvil for Mac is another alternative for serving HTML files, although it does not offer any of CodeKit’s other features.

To preview your PHP files you will need to set up some kind of local server.

Built-in Apache server

Your first option is to enable the free built-in Apache web server. This used to be available at the click of a check box in System Preferences, but Apple in its infinite wisdom has retained the Apache server software while removing the ease of use. While simply enabling the built-in Apache server is fairly simple, the set-up is not. You will need to edit your /private/etc/apache2/httpd.config file, your /etc/hosts file, and possibly your httpd-vhosts.config file. There are tutorials available everywhere covering these topics.

One downside to using the built-in Apache is that you have to keep all your web files in one of macOS’ secret locations, or you have to make even more changes to your configuration. Note that macOS updates can wipe out some or all of your custom configurations, so keep a copy in your Documents folder.

Once you get your built-in Apache configured and running, Tyler Hall offers HostBuddy to make adding new websites to your local server a bit easier. Even so, if you want to run software such as WordPress on your local computer, there are several more non-trivial steps.

MAMP / MAMP Pro

Perhaps the easiest way to install and set up a full server stack is to use MAMP or MAMP Pro.

MAMP stands for Macintosh, Apache, MySQL, and PHP/perl/Python.

Either one of these requires that you download a bunch of files to your Applications folder. Your web files then reside in a folder inside a folder inside of the MAMP folder. With MAMP, you still have to edit your Apache configuration files to run more than one website. With MAMP Pro, support for multiple sites is built in, as is support for the MySQL database, which allows you to run WordPress and other server software packages locally.

Built-in PHP server

If your needs are not that extensive, you may be able to make use of the built-in PHP server, which will serve both HTML and PHP pages.

To open a local PHP web server, open Terminal and type in these commands:

$ cd /Users/yourname/path/to/your/web/files
$ php -S localhost:8000

The first command changes the directory (hence, cd) to the folder that contains your web files.

If you don’t want to (or don’t know) the path to the folder with your web files, you can open Terminal, type in cd   (there has to be a space at the end), and then click and drag the folder from the Finder to the Terminal window. macOS will automagically fill in the correct path to your web folder.

The second line launches PHP, and the built-in web server.

To reach your website on your local machine, you just visit localhost:8000 in your browser of choice. View

Built-in Python server

For what it’s worth, you can also create a simple HTTP request server using macOS’ built-in Python language.

$ cd /Users/yourname/path/to/your/web/files
$ python -m SimpleHTTPServer 8000

The built-in Python server works only with plain HTML pages, though.

VirtualHostX 7

A potentially exciting approach to setting up a local server is via VirtualHostX 7, by Tyler Hall. In addition to allowing you to preview your HTML web pages, VirtualHostX creates a full server instance (in combination with VirtualBox from Oracle) so you can preview just about anything, similar to MAMP. Version 6 of VirtualHostX used to work with macOS’ built-in Apache, and it was heavenly. It seems not to be available any longer. Version 7 of VirtualHostX — the current version — sets up a more robust local server, making it possible to create servers for WordPress and other similar packages, quickly and easily. I own a copy, but I have only gotten it to run once, so I cannot recommend it at this time.

Scrutiny

Scrutiny from Peacock Media allows you to check website links (internal and external), as well as do some other nifty tasks. You might wonder why you would need to check internal links when BBEdit already does that, and the answer is that BBEdit (as of this writing) doesn’t check for case errors in links. Unfortunately, this means that a site that seems to have no link errors in BBEdit can still have broken links.

Here’s an example:

Let’s say you have created a web page about the U.S. Treasury’s new $13 dollar bill, and in that page you have a link to an image of the bill itself — <img src="farrah-fawcett-100.jpg"> — using all lowercase.

Let’s say that other than having created the basis for a possible counterfeiting charge for yourself, you have inadvertently made another error, because the actual name of the file in your /_assets/img/ folder is Farrah-Fawcett-100.jpg. BBEdit won’t catch this error, but Scrutiny will.

Scrutiny will also generate sitemap.xml and sitemap.html files for you. Run the program, save the file to your project folder, and upload them to your server.

If you include a sitemap.xml file, be certain to call this out in your robots.txt file.

GitHub Desktop

BBEdit has Git connection built in, but I don’t really understand Git, I don’t remember the commands and command sequence, and I’m too lazy to look up the steps each time. So I use GitHub Desktop. Publish to Forge or Netlify (or GitHub, for that matter). GitHub is free, and allows you to work on sites even when you are on your MacBook away from home. As long as you have BBEdit and your files on GitHub, you’re ready to go.

Sitemap_gen.py

For sites that don’t change much, it’s not a big deal to regenerate the sitemap.xml file as needed. If you have a more active site (or are as lazy as I am), then you may want to have the sitemap.xml file generated periodically on the server without your having to do anything beyond the initial setup. Part of that initial setup involves deleting the sitemap.xml file out of your local project. If you do leave it in place, it shouldn’t overwrite the one on the server because it will be much older, but why take the chance?

The .py extension means that this is a Python program, but just about every server I’ve used with the exception of Earthlink (of course) supports Python scripts.

(include sample config file)

http://sitemap-generators.googlecode.com/svn/trunk/docs/en/sitemap-generator.html

Then call the script from a cron job (give example).

Don’t forget to refer to your sitemap.xml file in your robots.txt file.

Then submit your sitemap.xml file to search engines. If you already have Bing or Google webmaster accounts (or both), log into your account and add your project (after uploading to your server, of course), and specify the URL of your sitemap.xml file, which will typically be something like http://www.bbedit.com/sitemap.xml. Otherwise, you can submit the URL of your sitemap.xml file on an ad hoc basis by using URLs using this pattern, but with your own domain name after the ?sitemap=:

Google: http://www.google.com/webmasters/sitemap/ping?sitemap=http://www.bbedit.com/sitemap.xml

Bing: http://www.bing.com/ping?sitemap=http://www.bbedit.com/sitemap.xml

As big a push as there was a few years ago to get everyone on board with sitemap.xml files, you’d think it would be easier, and you’d be wrong. There must still be something to it, though, because there are two dynamite plug-ins for WordPress that generate sitemap.xml files, so someone still cares.

LineBreak

When you are creating a site, each new file should have your default character encoding and line ends. When are revamping a legacy site, you might have just about any character encoding or line ends, or combination of same. LineBreak allows you to convert files en masse. Note that you can change either parameter from within BBEdit, but when you are dealing with more than a couple of files, it’s easier to change everything all at once and be done with it.

https://code.google.com/archive/p/linebreak/

NameChanger

If for any reason you want or need to change a bunch of filenames, NameChanger is a great tool. The only downside is that if there are links to the files whose names you are changing, you’ll break each link, which could be a big problem. Still, for whipping a bunch of filenames into shape before adding them to your project, NameChanger is fantastic.

(image file example?)

https://mrrsoftware.com/namechanger/

Dreamweaver

There are a couple of things that Dreamweaver does really nicely that no other program (or group of programs) I’ve found duplicates. If you want/need any of these features, you may need to have a copy of Dreamweaver on your hard drive:

  • Encode all straight quotes in your text as &quot;.
  • Change links when you change a file name
  • Change links when you move a file
  • Search either the source code of the page or just the text of the page
  • Quickly and easily convert paragraphs to lists and vice versa
  • Templates. Dreamweaver Library items are kind of like BBEdit include files, but not as useful. Templates, on the other hand, are wonderful because you can define one or more pages, and if later you want to change the structure of the page, you change the template and Dreamweaver changes all pages based on that template. Note that you can call BBEdit include files in your Dreamweaver Templates and have the best of both worlds.
  • Sort data in tables, as well as insert and delete table rows. Dreamweaver also has the ability to delete all the height and width attributes from legacy table code.
  • Clean up Microsoft Word HTML with one command

Dreamweaver also has some nice-ish preview and GUI goodies, but in general it is pretty infuriating to use, at least it is on anything less than a 55-inch monitor.

Adobe offers a free trial of Dreamweaver, which otherwise will run you around $20 per month.

Text Expanders

There is a whole sub-set of utilities to help you create more text with fewer keystrokes. Some of them — the so-called macro programs — allow you to initiate entire sequences of actions with a few keystrokes. I don’t have the patience or imagination to get the full use out of them, but Typinator is a great labor-saving program that allows you to type a couple characters and have them expand into a full string of text. I use Typinator every day to help make short work of HTML entities, but there are plenty of others including the highly regarded Keyboard Maestro and the old favorite QuicKeys.

Clipboard managers

BBEdit has rudimentary clipboard management that I have never figured out how to utilize. I use CopyLess, although CopyClip 2 and Flycut are strong contenders.

Dropbox

By default, BBEdit saves your preferences, scripts, backups, and other files of note on your local computer. If you work on more than one computer (a desktop computer at home, and sometimes a laptop computer on the road, for example), you can get a free account with Dropbox

AppleScript

BBEdit allows you to invoke all kinds of scripts, both to process text (and files) and for whatever other needs you may have. Scripts live in the Scripts folder inside your BBEdit [descriptive name?] folder.

AppleScript is one of the languages you can use to control BBEdit. I am not a programmer, so I can’t be much help on all the ins and outs, but I can provide an example.

BBEdit lets you select text and hit Command E to use your selection for Find-and-Replace operations. So, after hitting Command E you would hit either Command F (find in the current file) or Shift Command F (find in the current project), and your selected text would already be entered in the Find pane of the Find dialog box.

But let’s say you would prefer that when you hit Command E the Find dialog box opens automatically, saving you a keystroke when you are search your current document? Simple: Create an AppleScript script that does these steps, and then assign it to Command E by saving it to the BBEdit-Menu Scripts folder, using the name Search•Use Selection for Find.scpt. (The • character is Option 8.) For further information on naming AppleScripts to run instead of menu items, see the User Manual.

tell application "BBEdit"
  set _text to contents of text of selection
  set findWindow to open find window
  tell findWindow to set text 1 to _text
end tell
tell application "System Events" to keystroke tab