人気ワード

Copy Title & URL

Bookmark

Feed

Share

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

目次

  1. HTMLテンプレートとは
    1. コンテンツタイプ:HTMLテンプレート
  2. HTMLテンプレートコンテンツの作成
  3. HTMLテンプレートコンテンツの設定
    1. コンテンツ情報
    2. コンテンツ設定
    3. テンプレートHTML
      1. HTMLテンプレートでヘッダーを作成する【基本HTML】

HTMLテンプレートとは

コンテンツタイプ:HTMLテンプレート

【ペイカートプラス】フロント側HTMLテンプレート

【HTMLテンプレート】コンテンツを作成すると、各コンテンツから呼び出すことのできるテンプレートを作成することができます。 ヘッダーやフッターなどの共通部分の表示に使用します。

ヘッダーやフッターなど共通項目の変数を用意しています。

HTMLテンプレートコンテンツの作成

管理者画面:コンテンツ管理 > コンテンツを作成する

【ペイカートプラス】コンテンツ新規作成
図2-1:コンテンツ新規作成

コンテンツ作成画面のコンテンツタイプから「HTMLテンプレート」を選択すると、HTMLテンプレートのコンテンツを作成することができます。

【ペイカートプラス】HTMLテンプレート新規作成
図2-2:HTMLテンプレートの新規作成

コンテンツタイプ
「HTMLテンプレート」を選択し、HTMLテンプレートを作成します。

「HTMLテンプレート」の具体的な設定方法は、以降の「HTMLテンプレートコンテンツの設定」から詳しく解説しています。

【サンプルデザイン】
ペイカートプラスは、あらかじめサンプルデザイン(コンテンツID:header)を用意しています。

【ペイカートプラス】HTMLテンプレートのサンプルデザイン
図2-3:HTMLテンプレート コンテンツの検索結果画面

サンプルデザインを複製・編集して、コンテンツを作成することも可能です。 コンテンツを新規作成する前にサンプルを一通り確認することで、スムーズにコンテンツの作成が行えます。

HTMLテンプレートコンテンツの設定

コンテンツの作成が完了したら、次にコンテンツの設定を行います。

【ペイカートプラス】HTMLテンプレートのコンテンツ管理画面

1. コンテンツ情報

【ペイカートプラス】コンテンツ情報

コンテンツタイプ
HTMLテンプレートを作成します。「HTMLテンプレート」と表示されていることを確認してください。

2.コンテンツ設定

【ペイカートプラス】コンテンツ設定1

コンテンツID
設定したコンテンツID名が他のコンテンツで「変数名」として使用できるようになります。

カテゴリー名
カテゴリー名を設定することで、コンテンツをカテゴリ単位で管理します。

コンテンツ名
コンテンツを管理する名称です。わかりやすい名称にしてください。

3.テンプレートHTML

「HTMLテンプレート」コンテンツでは以下の編集エリアを用意しています。

  • 基本HTML
【ペイカートプラス】基本HTML概要

HTMLテンプレートでヘッダーを作成する【基本HTML】

HTMLテンプレートでヘッダーのコンテンツを作成します。ここで入力するコードが、コンテンツのベースとなります。

【ペイカートプラス】HTMLテンプレートで作成したマイページ
図4-1:HTMLテンプレートで作成したマイページ

共通部分として作成するので、個別にコンテンツを編集することなく一括更新が行えます。

【ペイカートプラス】HTMLテンプレートのヘッダーサンプル
図4-1:HTMLテンプレート(ヘッダー)のフロント側の表示例

【基本HTML】

【ペイカートプラス】HTMLテンプレートのヘッダーの記述例
図4-2:HTMLテンプレートのヘッダーの記述例

関連記事