• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL

Lesson 2. Authoring Web Pages > Creating a Page Using the Template And a Script

Creating a Page Using the Template And a Script

You now have a template, and you are ready to start building pages. In this lesson, you will build the welcome page. Starting from the template you created in the previous lesson, you will insert and format both text and graphics.

Using any word processor, open the welcome_text.txt file, found in the Text Files folder in the Lesson02/Start folder, as well as in the root folder of the Dante site.

This is a plain text file, with no formatting, such as bold, italics, or special font colors, applied. When you copy and paste into Dreamweaver, all word-processor formatting is lost anyway. The screenshot shows the text as it appears in WordPad, the minimalist word processor that ships with Windows.

Select all of the text, and choose Edit > Copy.

This copies the text to the clipboard, which makes it available to paste into Dreamweaver.

Open template.html in Dreamweaver, and click in the blank line below the page title.

You'll paste the text below the page title.

Choose Edit > Paste.

The text appears in Dreamweaver. It is unformatted, but it is all there. If you click inside each line and look in the tag selector, you will see that each paragraph has been separated with a <br> tag. Each of those paragraphs needs to be within a set of <p> tags, though. You can't attach CSS styles to a <br> tag.

Click to place the cursor at the end of each line. Press the Delete key to remove the line break (<br> tag) and then press Return or Enter to create a new paragraph.

This process replaces each <br> tag with a pair of <p></p> tags. By doing so, you both add some space in between each paragraph and make it possible to mark up each paragraph with its own CSS style. In fact, each successive <p> tag automatically receives the bodytext style attribute.



Not a subscriber?

Start A Free Trial

  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint