2.2 Copying and Pasting Text

   

If you're building Web sites as part of a team or for clients , your writers are likely to send you their copy in the form of word-processing documents. If the text comes in a Microsoft Word document or Excel spreadsheet, you're lucky. Dreamweaver MX 2004 includes new commands for pasting text from these two types of files. If you're using Windows, you can even import those kinds of files directly into a Web page using File Import Word/Excel Document (see Section 2.4).

2.2.1 Simple Copy and Paste

For non-Microsoft-spawned text, you can, of course, still simply copy and paste like generations of Web designers before you.

Open the document in whatever program created itWordPerfect, AppleWorks, your email program, or whatever. Select the text you want (by dragging through it, for example), or choose Edit Select All (Ctrl+A [ -A]) to highlight all text in the document. Then choose Edit Copy, or press Ctrl+C ( -C), to copy it. Switch to Dreamweaver, click in the document window where you wish the text to go, and choose Edit Paste (Ctrl+V [ -V]).

When you copy from any program other than Microsoft Word or Excel, as shown at top, and paste into Dreamweaver, as shown at bottom, all formatting is lost, and paragraph breaks are replaced by line breaks. The little icon that appears at the end of the first line at right represents the invisible line break.

This routine pastes the text into place. Unfortunately, you lose all text formatting (font type, size , color , bold, italic, and so on) in the process, as shown in Figure 2-3.

Furthermore, you may find that pasted paragraphs are separated by line break characters , not standard carriage returns. Strangely enough, this means that when you paste in a series of paragraphs, Dreamweaver treats them as though they were one gargantuan paragraph. These line break characters can pose problems when trying to format what you think is a single paragraph. To identify these line breaks, see the note in Section 2.1.1.1.

2.2.2 Pasting Text from Word: The Basic Method

One of the most frustrating things about earlier versions of Dreamweaver was their inability to maintain basic formatting, like bold and italics, when copying and pasting from Microsoft Word. Worse , even simple paragraphs would sometimes be merged into a single glob.

But no more! Dreamweaver MX 2004 now includes both basic and advanced methods of copying and pasting Word text. You can even paste spreadsheet information from Excel, complete with rows, columns , and cells .

Frequently, you'll just want to preserve basic formatting like bold or italic text, headlines, and bulleted lists. You won't need (and in most cases, won't want) more extravagant formatting like different fonts, colors, or margin settings. After all, you're the Web designer, and you'll use your own design senseand Dreamweaver's CSSbased formatting toolsto add beauty to basic text.

Pasting Word text works like any copy/paste action described in the previous section. Just select the text in Word, copy it, switch to Dreamweaver, and then choose Edit Paste to drop it into a Web page. You don't have to spend a lot of time reformatting the pasted text (see Figure 2-4), since many basic formatting options are preserved:

WORKAROUND WORKSHOP
Pasting HTML

Suppose you've copied some HTML code, maybe out of the Source view of an actual Web page in a Web browser, or from a "How to Write HTML" Web site. You'll notice that when you paste it into Dreamweaver, all the HTML tags appear in the document window, complete with brackets (< >) and other assorted messiness.

To avoid this mess, choose Edit Paste HTML. This command adds the code to the HTML of your page, making visible only the text you'll want the public to see, just the way things should be. Similarly, if you want to copy the HTML code and the visible text from your document window, use the Edit Copy HTML commanda handy technique when you want to paste your work into another Web authoring program.

By the way, you don't have to use these commands when copying and pasting within Dreamweaver. The regular Copy and Paste commands are smart enough to keep all of the formattingand HTML tagswhen copying and pasting within a Dreamweaver document. (If you do want to just paste the text and ignore the Dreamweaver formatting choose Edit Paste Text.)

• Any paragraphs formatted with Word's built-in Heading styles (Heading 1, Heading 2, and so on) get the HTML heading tags<h1> (or heading 1 ), <h2>, <h3>, and so on.

• Paragraphs remain paragraphs. This may seem like a simple thing, but previous versions of Dreamweaver usually turned multiple paragraphs into one large paragraph containing multiple line break characters.

• Bold and italic text maintains its look in Dreamweaver. (The actual HTML tags, however, can vary, as described in Section 3.3.2.)

• Basic alignment options (left, right, and center) remain intact. Justified text, on the other hand, gets pasted as left-aligned text. (You can compensate for this small oversight by using the justified alignment option on the Property inspector, described in Section 3.1.4.)

• Numbered lists come through as numbered lists in Dreamweaver (see Section 3.2) if you used Word's automatic numbered-list feature to create them.

• If you use Word's built-in list-bulleting feature, you end up with a proper, HTML bulleted list (see Section 3.2). However, if the bulleted list includes custom bullets like check marks or clown faces, Dreamweaverfor whatever bizarre reasoninterprets the list as basic paragraphs preceded by bullet characters. That is, you don't wind up with the proper HTML for a bulleted list (which involves the <ul> tag)you just get plain paragraphs preceded by a bullet text character. This bullet might get deleted, ruining the look of the list, but even worse, you can't then take advantage of CSS's list-formatting properties to change this bullet into a square, hollow circle, or even little graphics.

WORKAROUND WORKSHOP
When Pasting Comes Unglued

There are a few areas where Dreamweaver's copy/paste feature for Word text comes up short. For example, the program ignores certain complex formatting altogether, like fonts, colors, and sizes. You can overcome this deficit using the Paste Formatted command, but that method creates problems of its own (Section 2.4).

Furthermore, pasting in Dreamweaver sets off a number of bugs (or at least it does in the first release). Single quotes'like the kind that surround this phrase'paste incorrectly. The opening quote is fine, but the closing single quote gets pasted as a straight quote, like this: '. Apostrophes also morph into unattractiveand typographically incorrectstraight quotes.

Finally, Dreamweaver sometimes includes a space before punctuation marks like commas: this , I think , looks strange .

You can fix these problems using Dreamweaver's Search and Replace tool, discussed in Chapter 19.3. For example, you could search for straight quote marks (') and replace them with a closing single quote or apostrophe ('). And you can also check www.macromedia.com/support/dreamweaver/ downloads_updaters.html to see whether Macromedia's 2004 bug-fix release is available.

• Graphics from Word documents get pasted as graphics. In fact, even if the original graphics aren't in a Web-ready format (if they're BMP, TIFF, or PICT files, for example) Dreamweaver converts them to either the GIF or JPEG formats understood by Web browsers. Dreamweaver even copies the files to your local site root and links them correctly to the page. (Chapter 5 covers images in depth.)

NOTE

There are a couple of caveats with this feature. First, you can't copy and paste more than 300 K worth of text, so you have to transfer really long documents in pieces (or better yet, spread them out among multiple Web pages). And second, this feature only works with versions of Word later than Office 97 (for Windows) or Office 98 (for Mac).

Dreamweaver MX 2004 now lets you paste Word text (and graphics)like the contents of the Word file at topinto a Web page while preserving basic formatting options like headlines, italics, paragraphs, and bold (bottom left). The Paste Formatted command lets you preserve more advanced formatting such as font faces, colors, sizes, and margins (bottom right). But this special treatment comes at a price: the file size of the page on the right is about 10 percent larger than the one on the left.

2.2.3 Pasting Text with Word Formatting

If you simply must keep that three-inch tall, orange text and crazy cartoon-like font, you can turn to another new Dreamweaver MX 2004 featurePaste Formatted.

After copying text from Word and returning to Dreamweaver, choose Edit Paste Formatted, or press Ctrl+Shift+V ( -Shift-V). Dreamweaver pastes the text with as much formatting as possible, including margins, fonts, and text colors and sizes (see Figure 2-4). Behind the scenes, Dreamweaver pastes the text and adds Cascading Style Sheet codes that attempt to approximate the look of the text in Word.

Unfortunately, all of this extra code increases the document's file size and download time and can interfere with future formatting changes. What's worse, most of your visitors won't even be able to see some of this formattingsuch as uncommon font faces. For these reasons, use this feature with caution.

2.2.4 Pasting Excel Spreadsheet Information

Dreamweaver MX 2004 offers two methods of pasting information from Microsoft Excel, too: a basic method, using the standard Ctrl+V ( -V) or Edit Paste; and a format-rich method, using Shift+Ctrl+V (Shift- -V) or Edit Paste Formatted. Both methods paste spreadsheet information as an HTML table composed of cells, rows, and columns (see Chapter 7 for more on tables).

But unlike pasting from Word, the basic Paste command from Excel preserves no formatting: it doesn't even hang on to bold and italics.

The Paste Formatted command, however, preserves advanced formatting like font, font size, text color, and cell background colors.

Strangely, though, this command only retains formatting applied to an entire cell in Excel. If you use Paste Formatted on an entire cell of bolded text" UFO Sightings Since 1996 "the text does remain bold. But if you've included a combination of plain and italicized text in one cell"Ad Sales Data for The National Exasperater ," for example none of the italicized text will appear italicized in Dreamweaver. Kind of confusing? It certainly is, so you'll need to closely check any Excel data you paste into a Dreamweaver document. It may require some fine-tuning to make it look just right.

NOTE

To make matters worse, even if you just use your basic Edit Paste to get Excel data into Dreamweaver, you frequently end up with useless CSS code ( class attributes, to be specific) applied to most cells in the table. For example, you can end up with HTML code like this: <td class="xl33">. (All this CSS is explained fully in Chapter 6.)

2.2.5 Importing Word and Excel Documents (Windows)

Windows fans can also import material directly from a Word or Excel file into any Dreamweaver document. Just place the cursor where you wish to insert the text or spreadsheet, and then choose File Import Word Document (or Excel Document). An Open file dialog box appears; find and double-click the Word or Excel document you wish to import.

Dreamweaver captures the information just as if you'd used the Edit Paste. That is, for Word documents, Dreamweaver carries over basic formatting like bold, italics, headlines, and paragraphs, and imports and converts images. The importing process doesn't create style sheets or apply advanced formatting. For Excel documents, you get just an organized table of datano formatting.