Find and Replace using Dreamweaver
After seeing Dreamweaver pulled through the mud by people who deem it a poor tool for development, I’ve decided to shed some light on features that I feel have saved me countless time and may help you in your quest to produce better web sites faster. One specific feature that stands out for me is the Find and Replace tool.
For all you PC users, a CTRL-F will bring the Find dialog right up.
Basic Find and Replace
The basic dialog that comes up looks like a normal find and replace dialog box; although somewhat larger than you might be used to in other programs. You can enter in multiple lines of text and replace it with multiple lines of text. This is quite handy if you’re just replacing large blocks of HTML. The ignore whitespace feature is helpful in that it ignores things like extra lines, spaces and tabs in between tags and attributes. Code has a habit of becoming inconsistent in its formatting from page to page.
You can also do regular expressions which is also helpful. I find that the regular expression support in Dreamweaver is decent but I prefer using other programs like UltraEdit if it’s strictly just a regular expression. Dreamweaver is certainly slower than UltraEdit and I imagine other programs for this kind of thing.
But hit the drop down beside Search and you’ll see some other options:
The difference between Source Code and Text is much like it describes: a find and replace in Source Code view will match HTML elements and attributes whereas a find and replace in Text mode will only find matches in anything you see in Design view.
Slightly more advanced Find and Replace
The Text (Advanced) option is where you truly begin to experience some of the power of Dreamweaver’s Find capabilities. You’ll be able to search for text inside or not inside specific tags. Hitting the plus sign will allow you more options to narrow down your search. You can continue hitting the plus sign to add more options to the search. On the second-plus options you can additional options such as specifying that elements have to have certain attributes to be matched.
For example, let’s say you want to replace a word in the
sidebar but never in the content area. For those of us who’ve wrapped the
sidebar in a
div with a
class or id attached to it, you could specify to look for your word Inside Tag
div, With Attribute id = sidebar. No
other occurrences of the word would be replaced.
The whole enchilada: Specific Tag searches
I’m sure accessibility gurus will balk at my example screen shot of attaching a target to all my links. In any case, this is the feature that seems so hidden that most who’ve used Dreamweaver never seem to know it is there and always seemed amazed when I show them. What a Specific Tag search can do is match specific elements.
You can strip out elements, set attributes, remove
attributes. Let’s say you’ve just moved your rollover scripts to use some fancy
onmouseout events that you have. Simply
look for all
a tags With
onmouseover and Remove
Attribute and then do the same for the
If you wanted to be more selective, you could use a regular expression to
ensure that the attributes contained specific code such as your rollover
Backup, Backup, Backup
Okay, before you go hog wild I must warn you that no matter what program you use, I highly recommend you make a backup before doing any site-wide find and replace. Oft times you replace things you really didn’t want replaced and when there’s no undo, you may find yourself spending hours redoing it. Not that I’ve done that or anything *cough*.