Expression Web 4 Beginner's Guide

Expression Web初心者向けガイド。ステップバイステップで解説していきます。

共有枠からダイナミックWebテンプレートへ移行するには

FrontPageからExpression Webへの移行
  • このエントリーをはてなブックマークに追加

FrontPage固有の機能のうちの一つ、共有枠機能はExpression Webでは削除されました。
そこで、ダイナミックWebテンプレートに移行する手順について説明します。

1. ブラウザでトップページを開き、HTMLを新規Webページに貼り付け

Expression Webから共有枠を利用したWebページをブラウザでプレビューすると、共有枠部分が欠落されてしまう場合があるため、Windowsのシステムフォルダ内のトップページを開いて作業します。

  1. Expression Webを起動する前に、Windowsフォルダ内のWebサイトフォルダを開き、共有枠を使ったWebページのトップページをInternet Explorerで開きます。
  2. 右クリックして[ソースを表示]をクリックします。
  3. そのソース全てを選択してコピーします。
  4. Expression Webを起動し、Webサイトを開きます。
  5. 新規HTMLファイルを作成します。
  6. コードビューに切り替え、先ほどコピーしたHTMLを貼り付けます。

2. 共有枠のコメント及び共有枠のmetaタグの削除

これをダイナミックWebテンプレートに移行する前に、共有枠のコメント等を削除しなければいけないので、コメントと共有枠のmetaタグを削除します。

  1. コードビューに切り替えて、"Microsoft Border" が付けられている名前のmetaタグ行を削除します。
    例:<meta name="Microsoft Border" content="tlb">
  2. 共有枠のコメントを[検索と置換]ツールを使って削除します。
    Ctrlキーを押しながらHキーを押すと、簡単に検索と置換ダイアログボックスが表示されます。
    検索と置換
    検索する文字列:<!--msnavigation-->
    検索後の文字列:(何も入力しない!)
  3. [すべて置換]をクリックします。

3. 処理したWebページを元に、ダイナミックWebテンプレートファイルとして保存

  1. [ファイル]→[名前を付けて保存]をクリックします。
  2. [ファイルの種類]を「ダイナミックWebテンプレート」に指定します。
    名前を付けて保存
  3. ファイル名を適当に付けて保存します。
  4. 一旦Expression Webを終了します。(念のため)

4. ダイナミックWebテンプレートの編集可能な領域を指定する

  1. Expression Webを起動し、先ほど作成したダイナミックWebテンプレートを開きます。
  2. コンテンツブロック全体をクイックタグセレクタを利用して選択します。
  3. そのクイックタグセレクタの右側▼をクリックしたあと、[タグ内容の選択]をクリック します。
    タグ内容を選択
  4. [書式]→[ダイナミックWebテンプレート]→[編集可能な領域の管理]をクリックします。
  5. 領域名を入力して[追加]ボタンをクリックします。
    編集可能な領域
  6. [編集可能な領域]ダイアログボックスの[閉じる]ボタンをクリックします。
  7. 上書き保存して、ダイナミックWebテンプレートファイルを完成させます。

5. それぞれのWebページにダイナックWebテンプレートを適用する

ダイナミックWebテンプレートを作成したら、個々のWebページにそのダイナミックWebテンプレートを適用したWebページに変換していきます。

  1. 個々のWebページのコンテンツセクションだけを残し、あとは削除しておきます。
  2. Webサイト内のダイナミックWebテンプレートファイルを右クリックして、[ダイナミックWebテンプレートから新規作成]をクリックします。
  3. 編集可能領域内にカーソルを移動し、[挿入]→[ファイル]をクリックします。
  4. コンテンツだけを残したWebページを選択し、[開く]ボタンをクリックします。
  5. Webページを保存します。
  6. 以後、手順2~5を繰り返します。
  • このエントリーをはてなブックマークに追加

コメント

▲このページのトップへ