Pageの作成 1

解説記事が長くなるので、Pageを作成する為に使用するAdmin Menu内の機能の説明をこの記事で行い、次の記事で機能の抜粋と実際に使用したページが表示される形での記事構成にします。

Pageを実際に作成します。Pageの作成は

/admin/content
|
|- [1]コンテンツ
|
|---- [1.1]コンテンツ追加 ※ここをクリックします。
// 新規のコンテンツを追加

Drupalの表記にてPageは”コンテンツ”という名称となっていますので、以降Pageではなくコンテンツと表記して行きます。

上記の[1.1]コンテンツ追加をクリックすると

/node/add
|
|- > [1] Page
// CivicTheme. Use pages for your static content such as an 'About us' page or other informational pages that will always be accessible on the site. These can be simple content pages or pages with a complex layout.
|
|- > [2] イベント
// CivicTheme. Use Event pages to describe event information.
|
|- > [3] 基本ページ
// 「About us」のような、あまり更新されない内容の場合は 基本ページ を使ってください。
|
|- > [4] 記事
// ニュースやプレスリリース、ブログのような時系列が重要なコンテンツには記事を使ってください。
|
|- > [5] 警告
// CivicTheme. Use alerts to provide information for site users using a status bar.

5種類のコンテンツを選択する画面が開きます。

|- > [1] Page = CivicTheme.
|- > [2] イベント = CivicTheme.
|- > [3] 基本ページ = Drupal
|- > [4] 記事 = Drupal
|- > [5] 警告 = CivicTheme.

となっていますのでCivicThemeが用意するPageコンテンツ、[1] Page = CivicTheme.を選択します。

[3] 基本ページ、[4] 記事はDrupalがデフォルトで用意するPageコンテンツとなっています。

[1] Pageとの違いは、[1] Pageは後述する、ページを作成するコンポーネントにCivicThemeが用意するパラグラフを使用することが出来ます。このパラグラフがCivicThemeのデザインとなっており、このパラグラフで用意されたコンポーネントをコンテンツに配置することで、CivicThemeが用意したデザインに沿うページデザインとしてコンテンツを作成する事が出来ます。

コンテンツを作成

[1] Page = CivicTheme.を作成すると、コンテンツの編集画面が開きます。この編集画面でページを作成して行きます。

[a]メイン画面
---------------------------------------
// HTMLで言うところのheader部分に該当します。
---------------------------------------
|
[0]コンテンツ/バナーの選択 ※コンテンツを選択します。
// バナーはページトップのエリアに画像を挟み込みサイドメニューを配置しないフルスクリーンのコンテンツタイプを作成する場合に選択します。
|
|- [1]タイトル
// Pageタイトルをここに入力します。
|
|- [2]概要
// リストページなど一覧ページに記載タイトルと共に説明文として記載
|
|- [3]メタデータ
// 別項で説明しますが、カテゴリなどページを仕分けする情報を入れます。
|
|---- [3.1]トピック
// トピックは、複数選択可能です。
|
|---- [3.2]Site Section
// Site Sectionは1つのみ選択可能です。
---------------------------------------
// ここまでがHTMLで言うところのheader部分に該当します。
---------------------------------------
[1]コンポーネント
---------------------------------------
// ここからがHTMLで言うところのbody部分に該当します。
// 公開する記事はここで作ります。
---------------------------------------
|
// コンテンツの追加でコンテンツ内に記事や画像を追加して行きます。
追加するブロックは下記の[1]コンテンツか[2]パラグラフの一覧から選択します。
|
|- [1]コンテンツ
// ページに記載する内容をここで作成します。ごくオーソドックスなテキストや画像を挿入する事が出来ます。
|
|- [2]パラグラフ
// [1]コンテンツが、テキストや画像を挿入するセクションとなっていますが、パラグラフにはコンテナ化されたブロックや、View機能を持たせ、後述するリスト化されたページ一覧を作成するブロック、問い合わせフォームや地図など、[1]コンテンツにはない機能が用意されています。
|
---------------------------------------
// [1]コンテンツと[2]パラグラフを組み合わせてページを作って行きます。
// 複数選択可能で記事の用途に応じて積み上げていけます。追加や削除、順序の変更も出来ます。
// [1]コンテンツと[2]パラグラフも、テキストからRichテキスト、HTMLと作成したいPage用途に合わせて、入力方法を変更出来ます。
---------------------------------------
以下で選択します。
|
|- コンテンツを追加
// コンテンツを追加を選択
|
// パラグラフの追加はプルダウンメニューから選択
|---- Accordion
|---- 添付を追加
|---- Automated listを追加
|---- Calloutを追加
|---- Campaignを追加
|---- iFrameを追加
|---- Manual listを追加
|---- 地図を追加
|---- 次の段階を追加
|---- Promoを追加
|---- Sliderを追加
|---- ウェブフォームを追加
|
// 各項の説明は別途別記事にて解説します。
|
|- テキストフォーマット
|---- RichText/ベーシックHTML/制限付きHTML/フルHTML/プレーンテキスト
// 入力するテキストフォーマットを選択します。
|- テーマ
|---- Light/Darkの選択
|
|- Vertical spacing
|---- なし/トップ/ボトム/両方
// 選択したブロックの余白を設定します。
|
|
|- コンテンツを追加
// 異なるコンテンツやパラグラフを追加出来ます。
|
|- 背景
// 選択したブロックの背景に画像を選択出来ます。
---------------------------------------
// ここまでがHTMLで言うところのbody部分に該当します。
---------------------------------------
[2]テーマ
// ページ全体の余白設定と、テーマ画像の設定
// サイドバーの表示可否や、タグの表示可否もここで設定
// 私は現在ここでの設定は使っていません。
// 後述する、一覧ページに該当ページを表示させる際の表示をここで設定します。
// DrupalはView機能と言う、ページ内に所定条件のページを呼び出し表示させる機能を持っています。そこに表示させる内容の設定となります。
|
|
|- 現在の状態
|---- 下書き/Needs Review/Published
// 公開状況の選択をします。
|- 保存/プレビュー
// ここで保存するか、プレビューでページの内容を確認します。
---------------------------------------
// ここまでがメイン画面の編集にて行える項目となります。
---------------------------------------
[b]サイドメニュー
---------------------------------------
// サイドメニューはコンテンツの状況を把握する機能とURLエイリアスやリヴィジョン、投稿状況や私は使用していませんが、メニューやTOPページへの表示可否などを設定できます。
// オプションで設定しているメタディスクリプションの設定もサイドメニューにあります。
---------------------------------------
|
|- 下書き
|- 最終更新日
|- 投稿者
|- リヴィジョンログメッセージ
// 表題のような形で上記の情報が表記されています。
|
|- メニューの設定 >
// メニューにこのページを入れるかの設定
|
|- メタタグの設定 >
// メタタグ設定をここで行います。
// 私はディスクリプションに該当する説明のみ使用しています。
|
|- Last Up Date >
// 通常は記事を作成したり変更したりした日時となっていますが、予約投稿などをしたい場合先の日時を設定する事や、記事の一覧の順番が基本日時順となっているので、順序を変えたいなどで使用します。ここは更新なので、記事作成日時は投稿の情報で変更します。
|
|- URL リダイレクト >
// 該当ページをリダイレクトしたい場合ここで設定します。
|
|- URL エイリアス >
// DrupalのデフォルトのコンテンツのURLはnode番号となっています。標準でエイリアスをタイトルから拾い、その名前がURLとなります。URLが意図したものと異なる場合ここで変更します。
|
|- 投稿の情報 >
// 投稿者を設定します。標準は記事を書いた人ですが、複数の方が記事を作成した場合など、投稿者を変更することができます。私は個人で運営しているので、私が作成して投稿するので特に変更はしていません。
// 投稿日時は、標準で、公開日時が設定されます。予約投稿にしたい場合など先の日時を設定したり、後述する、記事一覧に並べて表示する場合、基本が日時を基準に順序が決まります。この順序を入れ替えたい場合に日時を変更して順序を入れ替えるなどに使用します。
// 現在使用していませんが、アーカイブ情報は月単位でまとめられますので、そこにまとめるなど日時が条件のコンテンツに該当させて使用するなど使用方法はいくつか考えられます。
|
|- プロモーションオプション
// 作成したコンテンツをTopページに表示させるか否かの設定になります。
// 私は使用していません。
|
---------------------------------------
// サイドメニューはここまでになります。
---------------------------------------
|
|
|
---------------------------------------
// 以上が コンテンツ作成の各機能になります。
---------------------------------------

以上がページを作成する際、Admin Menuで使用するコンテンツ作成の機能となります。

画像を使わず、テキストデータのみで構造や機能をまとめてみましたが、記事が長くなり読みにくいかもしれません。ただ、画像を使うと、機能毎に画像を用意する必要があり、それはそれで読みにくい記事となってしまいます。この辺りは、記事を書きながら良い形を見つけていければと考えています。

次項で、実際に機能を使用したページ作成の例をまとめて行きます。