【Micro CMS】静的サイトを高く売る方法 2/５【完全無料】

さて今回からは、実際にMicro CMSの使い方を解説していきます。

まずはMicro CMSのサイトにアクセスし、新規登録をおこないます。

第一回はこちら↓

【Micro CMS】静的サイトを高く売る方法１/５【完全無料】

コンテンツの追加

左側のメニューからまずはコンテンツを追加します。

＋ボタンを押すことで追加できます。

ここでいうコンテンツとは、サイト内のどんな内容を表示させるか？ といったものです。例えば「お知らせ」とか「メニュー」とかそんな感じでOKです。

今回はお知らせを作っていこうかと思います。

次に「APIの型を選択」という画面が現れます。通常は左側の「リスト形式」でOKです。

すると「APIスキーマ（インターフェース）を定義」という画面に移動します。

今回作りたいお知らせのイメージは、TOPページに一覧で

・◯月◯日　お知らせを投稿しました

・◯月◯日　お知らせを投稿しました

のようにテキストだけを投稿するものにしたいです。

必要な項目はまずは日付とタイトルですね。

それと各お知らせをクリックしたら、リンク先に飛べるようにしたいです。ですので「リンク先」の項目を作りましょう。

こんな感じ。

この時にそれぞれの項目でフィールドID、表示名、種類というものを決める必要があります。

・フィールドIDはデータを呼び出すときに必要なものです。半角英数字でつけます。

・表示名は、管理画面で表示される名称です。わかりやすいものならなんでもOK

・種類はテキストや画像など、その項目においてどんな種類のものを投稿できるようにするか、というものです。テキストにはテキストフィールド、テキストエリア、リッチエディタの３種類があります。

各項目の種類について

まず最初の項目にdateがあります。

投稿した日付ですね。こちらの種類は「日時」にします。

実はわざわざ項目として設定しなくても、自動で記事の作成日時や更新日時が記録されているのでそのデーターを呼び出すことも可能です。

ですがその場合、自分が選びたい日付ではなく、その記事が投稿された日時のデータを呼び出すことになりますので、「お知らせを投稿したのは今日だけど、日付はあさっての日付にしたいなぁ...」ということをするために上記のように入力項目として日付の欄を作っておくことにします。

次にお知らせの本文の項目です。

今回の場合はシンプルに１行だけ投稿できる感じにしたいのでテキストフィールドにしておきます。

複数行にしたいならばテキストエリアを、また太字にしたり文字の色を変えたり...見た目に装飾などをつけたいならばリッチエディタを選びます。

次はリンク先の項目です。これもテキストフィールドでOKです。例えばnewsと入力することで、

www.mysite.com/news/ ←こちらのリンク先に遷移するようなイメージです。

最後に「表示」という項目も作りました。

種類は真偽値を選びます。

真偽値を設定するとON/OFFスイッチのようなものが現れ、ONにしたときだけ記事が表示されるようなイメージです。

これはぜひ、基本的にいつも作成するようにしておくことをおすすめします。記事自体を「下書きに戻す」という機能もあるのですが、後半で紹介する「カスタムフィールド」を使用する場合などには「下書きに戻す」機能ではあまり役に立ちません。

わかりやすいよう、「詳細設定」から説明文を入力しておきましょう。

完了を押せば、入力項目の設定は終わりです。

記事の投稿

では実際に記事を投稿していきましょう。

右上の「＋追加」ボタンを押します。

各項目の入力欄が表示されますので、入力します。

表示スイッチはONにしておきます。

「公開」を押すと記事が投稿されます

めちゃくちゃ簡単ですね...！

同様に「追加」をしていくと、記事をどんどん増やしていくことができます。

※実際に記事をサイトに表示させる手順は、次回第３回にて説明します。

メニューの投稿

今度は同じ手順で、メニューを投稿していきましょう。

次に作りたいイメージは下記のようなものです。

パスタ

・パスタ１

・画像

・金額

・パスタ２

・画像

・金額

ピザ

・ピザ１

・画像

・金額

・ピザ２

・画像

・金額

さて、先ほどのお知らせと同様にすれば

・メニュー名

・画像

・金額

↑この３つの項目を記事としてどんどん投稿していくやり方はすでにできるかと思います。「追加」ボタンを押すことで、いわばメニュー名、画像、金額繰り返し増えていく感じですね。

ですが今回の場合「パスタ」「ピザ」といったカテゴリ名があります。これは記事ごとに繰り返すのではなく、カテゴリごとに一度表示されればいいはずです。

パスタ　　　　　← 一回だけ表示

・パスタ１　　　

・画像　　　　　← 繰り返し表示

・金額

・パスタ２

・画像

・金額

こういう場合、「カスタムフィールド」という機能を使用します。

お知らせの場合と同じようにまずはコンテンツを追加します。

その際、ひとまず繰り返しの無い「カテゴリ」だけを最初に作成してしまいます（コンテンツを一度作成した後でしか、カスタムフィールドの作成ができないためです）。

種類は「セレクトフィールド」にしました。

テキストフィールドでもいいのですが、例えば「パスタ」という文字が半角全角と異なっていたり、スペースが混じっていたりすると別のカテゴリと認識されてしまうため、ドロップダウンリスト形式で選択できた方が安心です。

セレクトフィールドには「パスタ」「ピザ」と登録して「OK」を押し、「完了」ボタンを押してコンテンツを作成してしますいます。

カスタムフィールドの追加

作成したメニューコンテンツの右上の「カスタムフィールド」をクリックします。

「カスタムフィールドがありません」と表示されるので、「追加する」を押します。

フィールド名とフィールドIDを記載します。

なんでもいいですが、なんとなくいつも「コンテンツ」「contents」とつけてます。

次へを押すと、お知らせの時と同様に入力項目の設定画面にいきます。

以下のものを設定しましょう。

・メニュー名

・画像

・金額

・タグ

・表示

メニュー名は必須項目にしておきました。

priceはなんとなく「数字」にしたくなってしまいそうですが、記号をつけたり ¥600/g みたいにすることがよくありますので、テキストフィールドにするのが一般的と思います。

タグはなくてもいいですが、「おすすめ」とか「人気」みたいにちょっとした装飾をつけるために便利です。

「次へ」を押すと「レイアウトする」という画面に移りますが、これは特に気にせず「完了」でOKです。

以上でカテゴリフィールドが完成です。

それでは先ほど作ったメニューコンテンツに、カテゴリフィールドを登録しましょう。

メニューコンテンツにカテゴリフィールドを追加

メニューコンテンツを選択した状態で、右上の「API設定」をクリックします。

「APIスキーマ」を選択すると、先ほど作成したcategoryが見えるかと思います。

その下の「追加」を押します。

フィールドID、表示名をやはり「contents」「コンテンツ」にします。

種類には「繰り返し」を選択します。

「利用するカスタムフィールドを選択してください」という画面で、先ほど作成したカスタムフィールドの「コンテンツ（contents）」が表示されますので、選択して「決定」を押します。

必須項目にしておき、「変更」を押します。

「不具合が発生する可能性があります〜」と言ったメッセージが出ますが、まだAPIを使用していないので問題ありません。OKを押します。

これでメニューコンテンツの完成です！

メニュー記事の投稿

ではメニュー記事を投稿してみましょう。

作成したメニューコンテンツから、「追加」を押します。

カテゴリで「パスタ」を選択し、「フィールドを追加」を押します。

メニュー名や画像、金額等を一通り入力します。

タグは「シェフおすすめ」とでも入力しておきましょうか。

表示の設定をONにするのをお忘れなく。

いい感じですね。

末尾に「＋」ボタンがあるので押すと、また同じようにメニュー名、画像や金額等の入力欄が現れます。

「カテゴリ」は出ないですね。

これでひとつの「カテゴリ」内に、複数のメニューを投稿するということができるようになりました。

一度公開を押し、再度メニューコンテンツへ戻り「追加」を押すことで、今度は別カテゴリを追加できます。同じように「ピザ」カテゴリのメニューを登録しましょう。

まとめ

いかがでしたでしょうか。

一度項目を作ってしまえば、お知らせやメニューの投稿はとても簡単にできるのではないでしょうか。

専門の知識がなくても、感覚的に使えるわかりやすさがありますよね。

次回は、投稿した記事を実際にサイトに表示させてみましょう！

今後の連載

第三回　↓

【Micro CMS】静的サイトを高く売る方法 ３/５【完全無料】

第四回　APIキーの隠し方

第五回　より高いパフォーマンスで使用するための学習方法

鐘倉の出品しているサービス↓