Video Training – Tutorials

Dreamweaver CS3 Tutorial – Find and Replace

November 13, 2008

Dreamweaver Tutorial videos for users who prefer to learn visual at their own pace. Using practical working examples and clearly presented lessons you will find that learning even the most complex aspects of Dreamweaver is as simple as following step-by-step stages Dreamweaver CS3 Training Videos .

This Tutorial can be downloaded along with all the associated files from here

Dreamweaver CS3 Tutorial Find and Replace

Dreamweaver’s ‘Find and Replace’ functions will help you locate files and content, even replace bits and pieces should you wish. Perhaps you’ve spotted a spelling error within a large amount of text on a web page and you need to correct it. Perhaps you need to change every instance of the color #E600FF within a CSS document to #89FF00. Perhaps you need to change every occurrence of ‘>’ within a document to ‘>’, except ones which are parts of XHTML tags. In all these cases ‘Find and Replace’ is a huge time-saver and this break-down will help you get to grips with using it.

Opening the ‘Find and Replace’ dialogue

Press Command + F or go to Edit > Find and Replace.. to open the dialogue.

Find in: Select Menu

The first thing you’ll see is the ‘Find in:’ select menu. This determines where you’ll be searching and the options are outlined below:

• Selected Text Searches within whatever text you have selected in the current document
• Current Document (default) Searches the entire current open document
• Open Documents Searches within all documents which are currently open in Dreamweaver
• Folder..When selected brings up a file field allowing you to select a folder on your system in which to perform the search
• Selected Files in Site If your ‘Files’ panel isn’t visible press F8 to reveal it. Select any number of files and folders within your current local site in which to perform a search
• Entire Current Local Site Searches within every single file currently available in your selected local site (visible within Files panel)

Search: Select Menu

Secondly you’ll see the ‘Search:’ select menu. This determines in which elements of your specified file/files you’ll be searching:

• Source Code (default) Searches within the whole source code of the specified file/files
• Text Searches only within the text output of the specified file/files. XHTML markup/tags etc will not be included in the search
• Text (advanced) Again, searches only within the text output of your specified file/files, this time allowing further specifics. With the options which will appear you’ll be able to include or exclude content from within certain tags (for example any text within a <p> tag)
• Specific Tag Searches tags as specified in the option fields which appear. Search for tags with certain attributes and values and use ‘Action:’ to alter these tags in the way you specify. This is useful for XHTML tags which have javascript scripts within them, for example.

Search Strings

Working our way down the dialogue, we come to the ‘Find:’ window. This is where you’ll enter the string you wish to search for.

Underneath the ‘Find:’ window is the ‘Replace:’ window. If you intend to perform a replace action (which we’ll cover in a minute) this is where you’ll enter the string you wish to replace what’s in the ‘Find:’ window.

Lastly on this side of the ‘Find and Replace’ dialogue are the ‘Options:’. These dictate specifics regarding the string you’ve entered to search for.

• Match case When checked, this option returns results which match the search string exactly, including the case of each letter. The search string ‘SENTENCE’ would not include instances of ‘Sentence’ in the results
• Match whole word When checked, this option ensures that your search returns only results where the string forms whole words and not parts of words. The search string ‘Mine’ would not include the ‘Mine’ contained within ‘Miner’ in the results
• Ignore whitespace When checked, this option ignores any whitespace (more than one space within text) in the search results. The search string ‘These words’ would then include instances of ‘These words’ , but also ‘These      words’ in the results.
• Use regular expression When checked, this option allows the use of regular expressions within the search string. This means that regular expressions can be entered into the ‘Find:’ window and won’t be treated literally as strings. For example, by entering <[a-z]+> and searching within the whole source code the results will return instances of ‘<’ followed by any number of lower case characters, followed by ‘>’. ‘<span>’ would therefore be returned, ‘<h2>’ wouldn’t, using regular expressions even at a basic level can be a real time saver, I have lost count of the amount time this has saved me.

( Side note on Regular Expressions: Learning how to leverage the power of Regular Expressions will help you with a whole lot more than just doing advanced search and replace within Dreamweaver, it’s used in JavaScript, Perl, PHP and for performing Mod _Rewrite on a web server. 30 minutes is all it takes to learn the basics. A cool tools is avaiable called regex-coach that does an amazing job of helping you write Regular Expressions)

Submit buttons

Having specified all the parameters for your search, turn next to the right of the dialogue where the submit buttons can be found.

The first is ‘Find Next’ and when clicked will highlight the next instance of your search string in the location you’ve specified. Click again to move onto the next, again for the next etc. If you are searching within files which are currently closed (search entire local site, for example) they’ll be opened. When all instances have been found, a small information label will appear at the bottom of the dialogue stating that the search is ‘done’ and informing you of how many instances were found.

The next, ‘Find All’ will open the Results pane, listing all the search results and their location.

Clicking ‘Replace’ will replace the currently highlighted text with whatever you’ve stated within the ‘Replace:’ window. If the ‘Replace:’ window is empty, the highlighted text will be removed.

‘Replace All’ will replace every instance matching the search string with whatever is stated in the ‘Replace:’ window. This can have some fairly serious consequences if you’re not careful. In the case of searching and replacing within unopened documents you’ll even be warned:

Entry Filed under: dreamweaver. Tags: dreamweaver cs3 tutoral, Dreamweaver CS3 Tutorial, Find and Replace, Regular Expressions, training videos.