• 90 likes • 107 Views
Dreamweaver MX. Lesson 12: Editing the Code. Tools for Code Editing (p. 366). An HTML editor like Dreamweaver writes most of the code you need, but at times you will need to perform ______ coding.
E N D
Dreamweaver MX Lesson 12: Editing the Code
Tools for Code Editing (p. 366) • An HTML editor like Dreamweaver writes most of the code you need, but at times you will need to perform ______ coding. • With Dreamweaver, you can switch from _______ View to either Code View or a combination (left end of document toolbar). • In Code and Design View, clicking an element in design view moves the cursor to the code. • The View _______ button gives several choices for enhancing the view of HTML code. • Invalid HTML code will appear in the Design View highlighted in _________.
The Reference Panel • If you click on a ____ in code view and click the Reference button in the document toolbar, reference info will appear in the Reference panel. • You can also obtain tag and __________ reference information using the drop-down lists in the Reference panel.
Meta Tags (p. 376) • Meta tags contain information ______ the HTML document. • Select View > Head Content to view icons for the title, meta tags, and __________ code. Clicking these icons sends you to the code. • In the split view, click the Head tab on the Insert bar. • Place the cursor at the end of the </title> tag in the <head> section and click the Keywords or Description icons to add meta tags.
Comments • HTML comments explain parts of the code or _______ part of the document. • To add a comment, place the cursor at the desired location on the design view of the page. • Click the Comment icon on the _________ tab of the Insert bar. • Add the comment text in the box, click OK. The Tag Selector • Click the desired location in the design view. • Right-click the desired tag in the TagSelector. • Select Edit Tag… and change the code.
Quick Tags (p. 382) • Quick tags allow you to quickly insert HTML code in your document. • In Design (or split) View, place the cursor in the window where you want to insert HTML code. • Click the Quick Tag Editor icon on the right side of the Property inspector. • Double-click the desired tag from the list, press Enter. • You can also make a selection on the page (such as an image), click Quick Tag Editor, and modify the HTML code. Pressing Ctrl-__ allows you to wrap the selection in a tag.
Code Hints (p. 385) • As you are typing HTML code in the _____ View, Dreamweaver will display a list of Code Hints. • Double-clicking from the list of hints inserts the desired code. • You can even select text in Code View, drag it to the desired location and drop it.
Using Snippets (p. 388) • A snippet is a portion of HTML code that can be reused. • In Design View or CodeView, select the desired segment of code. • Select the Snippets panel in the _____ panel group. • Click the NewSnippet icon at the bottom of the panel. • Give the snippet a name and a short description. • Insert a snippet by placing the cursor in a document, double-click the snippet icon.
Using Clean Up HTML (p. 391) • Many HTML coding errors can be corrected using Clean Up HTML. • When finished with a document, select Command > Clean Up HTML… • Using the default settings is recommended. You can also enter certain kinds of tags to be removed. Be careful since you might delete essential HTML code! Click OK. • An HTML document created from Word can be imported (File > _______ > Import Word HTML). • A Clean Up Word HTML box appears, click OK.