HTML パブリッシュ用テンプレート

検索

最終更新日 : 2023年5月24日

Animate

アプリを開く

Adobe Animate ユーザーガイド

Animate の概要

アニメーション

インタラクティブ機能

ワークスペースとワークフロー

マルチメディアとビデオ

プラットフォーム

書き出しとパブリッシュ

トラブルシューティング

HTML パブリッシュ用テンプレートについて

Animate HTML テンプレートとは、静的 HTML コードと、特殊タイプの変数で構成させる柔軟性のあるテンプレートコード (ActionScript 変数とは異なる) を含むファイルです。Animate で SWF ファイルをパブリッシュすると、パブリッシュ設定ダイアログボックスの「HTML」タブで選択した値でこれらの変数が置き換えられ、SWF ファイルが埋め込まれた HTML ページが作成されます。

Animate には、多くのユーザーのニーズに合わせた様々なテンプレートが収録されているので、SWF ファイルを表示する HTML ページを手動で作成する必要はありません。例えば、「Animate のみ」テンプレートは、ブラウザーでファイルをテストする場合に便利です。このテンプレートは、Flash Player をインストールした Web ブラウザー上で表示できるように、SWF ファイルを HTML ページ上に配置します。

新しい HTML ページをパブリッシュするには、このテンプレートを使用して設定を変更します。カスタムテンプレートの作成には、任意の HTML エディターを使用できます。テンプレートの作成は通常の HTML ページの作成とほぼ同じですが、SWF ファイルに関する特定の値は、ドル記号（$）で始まる変数に置き換えます。

Animate HTML テンプレートには、次の特徴があります。

パブリッシュ設定ダイアログボックスの「HTML」タブのテンプレートポップアップメニューに 1 行のタイトルが表示されます。
パブリッシュ設定ダイアログボックスの「HTML」タブの「情報」をクリックすると、詳しい説明が表示されます。
テンプレート変数はドル記号（$）で始まり、Animate から出力ファイルが生成される際にパラメーター値が置換される場所が指定されます。

注意：ドキュメント内でドル記号を別の目的に使用する場合は、円記号とドル記号（¥$）を使用してください。
HTML の object および embed タグは、Microsoft Internet Explorer および Netscape® Communicator® または Netscape Navigator® のタグの規定にそれぞれ従っています。HTML ページに SWF ファイルを正しく表示するには、次のタグの規定に従う必要があります。SWF ファイルを開く際、Internet Explorer では object HTML タグが使用され、Netscape では embed タグが使用されます。

HTML パブリッシュ用テンプレートのカスタマイズ

イメージマップ、テキストレポート、URL レポートを作成する場合や、一般的な Animate HTML object タグパラメーター（ActiveX コントロールを使用するブラウザーの場合）や embed タグパラメーター（プラグインを使用するブラウザーの場合）などにカスタム値を挿入する場合は、HTML のテンプレート変数を修正します。

Animate テンプレートにはアプリケーションの HTML コンテンツを記述できます。また、ColdFusion や ASP など特別なインタプリタのコードも記述できます。

Animate HTML エディターを使用して、変更する HTML テンプレートを開きます。これらのテンプレートは次の場所にあります。
- Windows XP または Vista：boot drive¥Documents and Settings¥user¥Local Settings¥Application Data¥Adobe¥Flash CS5¥language¥Configuration¥HTML¥通常、Application Data フォルダーは非表示になっています。このフォルダーを表示するには、Windows エクスプローラーの設定変更が必要な場合があります。
- Mac OS X 10.3 以降：Macintosh HD/アプリケーション/Adobe Flash CS5/language/First Run/HTML
  「boot drive」は、Windows オペレーティングシステムがブートを開始するドライブ（通常 C:）を表します。「user」は、Windows オペレーティングシステムにログインしているユーザーの名前を表します。「language」は、言語の省略名に設定されています。例えばアメリカの場合、「language」の設定は、英語を表す「en」になります。
テンプレートを編集します。
テンプレートを元と同じフォルダーに保存します。
SWF ファイルにテンプレートの設定を適用するには、ファイル／パブリッシュ設定を選択し、「HTML」をクリックして、修正したテンプレートを選択します。Animate では、選択したテンプレート内のテンプレート変数のみが変更されます。
残りのパブリッシュ設定を選択し、「OK」をクリックします。

HTML テンプレート変数

Animate で認識されるテンプレート変数を次の表に示します。

属性 / パラメーター	テンプレート変数
テンプレートのタイトル	$TT
テンプレートの説明開始	$DS
テンプレートの説明終了	$DF
Animate（SWF ファイル）タイトル	$T1
検索エンジンメタデータ用の Animate（SWF ファイル）タイトル	$TL
検索エンジンメタベースの説明	$DC
検索エンジンで使用するメタデータ XML ストリング	$MD
幅	$WT
高さ	$HT
ムービー	$MO
HTML の位置	$HA
ループ	$LO
object 用パラメーター	$PO
embed 用パラメーター	$PE
再生	$PL
画質	$QU
伸縮	$SC
SALIGN	$SA
WMODE	$WM
デバイスフォント	$DE
BGCOLOR	$BG
ムービーテキスト（ムービーテキストを書く領域）	$MT
ムービー URL（SWF ファイルの URL の位置）	$MU
イメージの幅（イメージ形式の指定なし）	$IW
イメージの高さ（イメージ形式の指定なし）	$IH
イメージのファイル名（イメージ形式の指定なし）	$IS
イメージマップ名	$IU
イメージマップタグ位置	$IM
QuickTime の幅	$QW
QuickTime の高さ	$QH
QuickTime のファイル名	$QN
GIF の幅	$GW
GIF の高さ	$GH
GIF のファイル名	$GN
JPEG の幅	$JW
JPEG の高さ	$JH
JPEG のファイル名	$JN
PNG の幅	$PW
PNG の高さ	$PH
PNG のファイル名	$PN

簡易テンプレート変数の使用

$PO（object タグ）および $PE（embed タグ）テンプレート変数は、便利な簡易エレメントです。Animate では、どちらの変数を使用した場合も、一般的な object パラメーターや embed パラメーターなどのデフォルト以外の値をテンプレートに挿入できます（例：PLAY（$PL）、QUALITY（$QU）、SCALE（$SC）、SALIGN（$SA）、WMODE（$WM）、DEVICEFONT（$DE）、BGCOLOR（$BG））。

サンプル HTML テンプレート

次に示す Animate の Default.HTML テンプレートファイルには、頻繁に使用される多数のテンプレート変数が組み込まれています。

$TTFlash Only

$DS

Display Adobe SWF file in HTML.

$DF

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

$CS

</head>

<! -- ムービーで使用されている URL -->

$MU

<! -- ムービーで使用されているテキスト -->

$MT

$PO

</object>

</body>

</html>

$TTFlash Only $DS Display Adobe SWF file in HTML. $DF <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> $CS <title>$TI</title> </head> <body bgcolor="$BG"> <! -- ムービーで使用されている URL --> $MU <! -- ムービーで使用されているテキスト --> $MT <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.adobe.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="$WI" height="$HE" id="$TI" align="$HA"> <param name="allowScriptAccess" value="sameDomain" /> $PO <embed $PEwidth="$WI" height="$HE" name="$TI" align="$HA" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" /> </object> </body> </html>

$TTFlash Only 
$DS 
Display Adobe SWF file in HTML. 
$DF 
<!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quot;> 
<html xmlns=&quot;http://www.w3.org/1999/xhtml&quot; xml:lang=&quot;en&quot; lang=&quot;en&quot;> 
<head> 
$CS 
<title>$TI</title> 
</head> 
<body bgcolor=&quot;$BG&quot;> 
<! -- ムービーで使用されている URL --> 
$MU 
<! -- ムービーで使用されているテキスト --> 
$MT 
<object classid=&quot;clsid:d27cdb6e-ae6d-11cf-96b8-444553540000&quot; codebase=&quot;http://fpdownload.adobe.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0&quot; width=&quot;$WI&quot; height=&quot;$HE&quot; id=&quot;$TI&quot; align=&quot;$HA&quot;> 
<param name=&quot;allowScriptAccess&quot; value=&quot;sameDomain&quot; /> 
$PO 
<embed $PEwidth=&quot;$WI&quot; height=&quot;$HE&quot; name=&quot;$TI&quot; align=&quot;$HA&quot; allowScriptAccess=&quot;sameDomain&quot; type=&quot;application/x-shockwave-flash&quot; pluginspage=&quot;http://www.adobe.com/go/getflashplayer&quot; /> 
</object> 
</body> 
</html>

SWF ファイルの代わりになるイメージマップの作成

Animate では、任意のイメージを表示するイメージマップを作成でき、URL にリンクしているボタンの機能を維持できます。HTML テンプレートに $IM テンプレート変数が含まれていると、Animate によりイメージマップコードが挿入されます。$IU 変数は、GIF、JPEG または PNG ファイルの名前を表します。

ドキュメント内で、イメージマップに使用するキーフレームを選択し、そのフレームのプロパティインスペクター（ウィンドウ／プロパティ）で #Map というラベルを付けます。ActionScript 1.0 または 2.0 の getURL アクションを割り当てたボタンのあるキーフレームはすべて使用できます。

Animate では、フレームラベルを作成しない場合は、SWF ファイルの最終フレーム内のボタンを使用してイメージマップが作成されます。このオプションで生成されるのは埋め込みイメージマップであり、埋め込み SWF ファイルではありません。
イメージマップを表示するフレームを選択するには、次のいずれかの操作をします。
- PNG や GIF ファイルの場合は、表示するフレームに #Static というラベルを付けます。
- JPEG の場合は、パブリッシュ操作の際、表示に使用するフレームに再生ヘッドを配置します。
HTML エディターで、修正する HTML テンプレートを開きます。
テンプレートを保存します。
ファイル／パブリッシュ設定を選択し、「形式」をクリックしてイメージマップの形式を選択して「OK」をクリックします。

例えば、テンプレートに次のコードを挿入します。
$IM
<img src=$IS usemap=$IU width=$IW height=$IH BORDER=0>
$IM <img src=$IS usemap=$IU width=$IW height=$IH BORDER=0>
```
$IM 
<img src=$IS usemap=$IU width=$IW height=$IH BORDER=0>
```
この場合、「パブリッシュ」コマンドで作成される HTML ドキュメントには次のコードが生成されます。
<map name="mymovie">
<area coords="130,116,214,182" href="http://www.adobe.com">
</map>
<img src="mymovie.gif" usemap="#mymovie" width=550 height=400 border=0>
<map name="mymovie"> <area coords="130,116,214,182" href="http://www.adobe.com"> </map> <img src="mymovie.gif" usemap="#mymovie" width=550 height=400 border=0>
```
<map name=&quot;mymovie&quot;> 
<area coords=&quot;130,116,214,182&quot; href=&quot;http://www.adobe.com&quot;> 
</map> 
<img src=&quot;mymovie.gif&quot; usemap=&quot;#mymovie&quot; width=550 height=400 border=0>
```

テキストレポートおよび URL レポートの作成

$MT テンプレート変数を指定すると、Animate により、現在の SWF ファイルのすべてのテキストが HTML コードにコメントとして挿入されます。これは、SWF ファイルのコンテンツをインデックス化して検索エンジンに認識させるときなどに使用します。

$MU テンプレート変数を指定すると、Animate により、現在の SWF ファイル内のアクションが参照する URL のリストが生成され、そのリストが現在の位置にコメントとして挿入されます。このアクションにより、リンク確認ツールが SWF ファイル内のリンクを検出および確認できるようになります。

検索メタデータの埋め込み

$TL（SWF ファイルタイトル）および $DC（説明メタデータ）テンプレート変数を使用すると、HTML に検索メタデータを組み込むことができます。この機能により、検索エンジンは SWF ファイルを見つけやすくなり、有意義な検索結果が得られるようになります。$MD テンプレート変数を使用すると、検索メタデータを XML ストリングとして組み込むことができます。

その他の関連ヘルプ

パブリッシュの概要

ヘルプをすばやく簡単に入手

新規ユーザーの場合