ホーム > マスターズ > HTMLテンプレートでコンテンツを作成する

HTMLテンプレートでコンテンツを作成する

コンテンツ作成方法

ページに表示するコンテンツの作成はWYSIWYGで作成する方法とHTMLテンプレート(ひな形)で作成する方法の二種類があります。ここではHTMLテンプレートの仕組みについて説明します。

HTMLテンプレートの役割

HTMLテンプレートを利用すると、ひとつのひな形となるHTMLでレイアウトを行い、それをひな形としてコンテンツを生成することができます。



例えばQ&Aのような、ほぼ同じレイアウトを持つコンテンツの連続である場合に利用します。ではHTMLテンプレートを使ってコンテンツを作成してみましょう。


 

ページ作成画面を開く

「コンテンツブログ」→「新規作成」→「ページ」にてページ作成画面を開きます。

 

ページ情報入力

ページ情報入力画面にてページ情報を入力します。

入力項目の詳細に関してはこちらをご覧ください。このとき、[HTMLで編集]ラジオボタンをチェックします。チェックすると、[ブロック追加]ボタンが表示されますので、クリックします。

 

HTMLを入力

HTMLを入力します。ここで入力するフォーマットはXHTMLとなりますので、<br>等は<br />と記述する必要があります。HTML作成時の制約事項についてはこちら
HTMLを入力したら[保存]ボタンをクリックします。

 

見たまま編集画面に移動

保存が済んだら[GUI編集へ進む]リンクをクリックし、みたまま編集画面に移動します。

 

HTMLテンプレートからコンテンツを生成

HTMLテンプレートを作成しただけではコンテンツは生成されません。先ほど作成したのはあくまでもひな形となるHTMLです。HTMLテンプレートからコンテンツを作成するには[ブロック一覧]の[新規ブロック]をクリックし、コントロールパネルの[追加]アイコンをクリックします。
 

クリックすると先ほど作成したHTMLテンプレートからコンテンツが生成されます。


 

同様の手順を繰り返すことで、同じ内容のコンテンツが生成されます。しかし同じコンテンツをたくさん作っても意味がありません。そこで登場するのがGCタグです。


 

editタグを使用する

editタグはHTMLテンプレート内に可変テキストを設置するタグです(タグの詳細はこちら)。先ほどのHTMLテンプレートのテキスト部分にeditタグを設置し、[保存]ボタンをクリックします。保存が済んだら[GUI編集に進む]リンクをクリックし、見たまま編集画面に移動してください。
 

可変テキストを編集する

先ほどと同様の手順でコンテンツを生成すると、editタグを記述した箇所は[データを入力してください]というテキストが表示されます。カーソルを合わせると色が変わりますのでクリックします。
 


クリックするとテキストを編集する画面が開きますので、テキストを編集します。編集が済んだら[保存]ボタンをクリックします。


 

編集したテキストが反映されます。同様の手順でコンテンツを複製していきます。


 

HTMLテンプレートとGCタグを使用することで同一レイアウトのコンテンツを効率的に作成することができます。


 

ブロック一覧ウィンドウについて


太文字の文字列はHTMLテンプレートのデータを保持します。これをブロックと呼びます。ブロックはHTMLテンプレートを管理しているだけです。
ブロックの下に表示される文字列はブロックが持っているHTMLテンプレートから生成されたコンテンツです。
 


 

ブロックやコンテンツの名称はコントロールパネルの[名称変更]で変更できます。名前を入れることで管理しやすくなります。