公式Wikiページの理解を目指した記事です
Connect-CMSには始めから有用なプラグインがいくつも備わっていますが、オリジナル・プラグインを開発し使用することもできます。
Connect-CMS公式のWiki『 OriginalPlugin 』で情報が提供されており、2022年3月16日(水)の勉強会でも取り上げられましたが、私には全く理解できませんでした。「たぶん、こういうことが言いたかったのだろう」と思う内容を 自分が分かるようにフィクションを用いながら 追試します。
筆者は本ページ作成時において1年ほどConnect-CMSを利用していますが、Laravelを用いた開発を行った経験はありません。そもそも筆者はシステム開発者でもプログラマーでもWebデザイナーでもありません。公式のWikiと勉強会で知ったオリジナル・プラグインの作成手順を「まだ知らぬ昨日の自分」に説明するつもりで書いています。つまり、オリジナル・プラグインを勉強して１日後の記事です。理解の至らなさは自明ですが、その程度の精度であることを認識したうえで本ページを閲覧・利用してください。また、読み進めると感じるであろう「冗長かつ恥ずかしい内容」については、「筆者のような凡人が理解するために、ここまでの解説と励ましが必要なのだ」とお察しください。
目次（章）
OFFにすると、その章の概要だけが表示されます。
|
|
A. 前提となる知識と技能 |
|
|
B. 本ページでの目標（ゴール） |
|
|
C. 操作 |
|
|
D. プラグイン管理での使用準備 |
|
|
E. 「サンプル」プラグインの使用 |
Ａ．前提となる知識と技能
［ 概要 ］
- サーバーにログインし、コマンドで操作できる [省略]
- Connect-CMSをインストールできる [省略]
- Connect-CMSでWebサイトを構築したことがある [省略]
- 各記事とデータベースの関係を知っている [省略]
サーバーにログインし、コマンドで操作できる [省略]
- Webサーバー・PHP・データベースサーバーを操作できる権限をもっている
（レンタルサーバーでも、VPSでも、自前のサーバーでも構いません）
Connect-CMSをインストールできたなら、十分に満たしています。
本ページでは、「PuTTY」「WinSCP」「Visual Studio Code」を使って説明しますが、同等の機能をもつ別のアプリケーションを使っても構いません。
Connect-CMSをインストールできる [省略]
このページの最後で、実際にConnect-CMS上で動作確認を行います。あらかじめConnect-CMSをインストールしておいてください。
また、途中にも、サーバー上のConnect-CMSのディレクトリにファイルをアップロードする作業があります。WinSCPのようなファイル転送機能をもつアプリケーションを接続しておいてください。
Connect-CMSでWebサイトを構築したことがある [省略]
- 「固定記事」プラグインを使ったことがある
- 「ブログ」「データベース」プラグインを使ったことがある
本ページで扱う「サンプル」プラグインを扱う上で似た操作、似た概念を含みます。具体的には「記事の登録・編集・削除」「バケツの選択」です。
各記事とデータベースの関係を知っている [省略]
- Connect-CMSの記事は、記事作成者の操作によりデータベースに登録されたものであることを知っている
- phpMyAdminなどで、プラグインごとに蓄積されたデータを見たことがある
上記を通じて
- 新しいプラグインでも、データベースに新しくテーブルを作り、そこにデータを登録していくことになるであろうと類推できる。
Ｂ．本ページのゴール
［ 概要 ］
GitHubにある公式Wikiで紹介されている手順を追試します。したがって、最終的には「サンプル」という名で、下図のような、「ログイン者だけが投稿でき、非ログイン者も読める、返信機能のない、簡易な掲示板」プラグインをConnect-CMSに追加します。
（１）
投稿記事の一覧画面（ログイン時）
（２）
投稿記事の詳細（非ログイン時）
（３）
投稿記事の詳細（ログイン時）
（４）
記事の編集画面（ログイン時）
（５）
追加されたテーブル（phpMyAdmin）
（６）
作成されたカラム（phpMyAdmin）
Ｃ．操作
［ 概要 ］
GitHub上の公式Wiki「OriginalPlugin」ページの内容を理解するため、フィクションを用いながら、初学者がついてこられるレベルで操作手順を記載します。
サービスを思いつく
唐突ですが、あなたは急に「オリジナルの掲示板プラグインを作りたい」という気持ちになりました。なんかよく分からないけど、オリジナルの掲示板を作らなければならない。作りたくてどうしようもない。本日の使命と言っても過言ではない。そのような気持ちが急激に沸きあがってきた、としましょう。
同時に、その掲示板のイメージ［Ｂ章の（１）～（４）］が稲妻のようにひらめきました。あなたはとても優秀な人です。
ログイン者だけが投稿でき、非ログイン者も読める、返信機能のない、簡易な掲示板。あなたはそれを「サンプル」と名づけ、「タイトル」と「本文」だけが表示されているConnect-CMSのWebページをありありと思い描きます。
あなたはいてもたってもいられなくなり、パソコンに向かいます。
そう、あなたは熱意の人でもあるのです。
開発では何を目指すのかを明確にすることが大事です。実際には図にかいたり、人に聞いてもらいながら具体化していくのですが、ここでは天啓により、あなたは完全に理解したということにしましょう。
ＤＢ定義ファイルを作る （ データベースにテーブルを追加するために ① ）
昨今の掲示板プログラムでは、データベースサーバーを使ってデータを管理するのが常識です。あなたは、あなたの「オリジナルの掲示板」も Connect-CMSのデータベースの中に新しくテーブルを作って使うように決めます。
他の標準プラグインにならってデータベースのテーブル構成を考えてみたところ、作るべきテーブルは次の２つのようです。
(1) バケツデータを格納するテーブル
(2) 投稿されたデータを格納するテーブル
ここであなたは「バケツって何よ？」と思いましたがが、すぐに「複数のデータベースを作ったときに、設定画面で選んでいるあれよ」と気づきました。
間違っているかもしれません。読者諸君は こちら で正しく勉強して下さい。
とにかく、あなたはConnect-CMSのデータベースにオリジナルの簡易掲示板用のテーブルを追加することにしました。
Connect-CMSの根幹はLaravelですので、Laravelの扱いに即したかたちでテーブルを追加していく必要があります。いわゆる マイグレーション（migration）です。
〈 以降、黒背景に白抜きの文字はPuTTYでのコマンド操作を意味します 〉
（１）
Connect-CMS本体の一番上のディレクトリに移動する
cd /USERNAME/zzz_MyApplications/connect-cms/test01上記のパスは、筆者のサーバーでConnect-CMSの本体を置いている場所であり、みなさんとは異なるかもしれません。適切なパスに書き換え、移動してください。
（２）いまいる場所に
「artisan」ファイルがあることを確認する
ls現在いるディレクトリにあるファイルとディレクトリを表示するLinuxコマンドです。
LICENSE
README.md
app
artisan
bootstrap
composer.json
composer.lock
composer.phar
config
database
dev_2_option_private.ps1.example
docker
docker-compose.yml
github_copy.bat.example
option_private_2_dev.ps1.example
package-lock.json.bk20211005
package.json
phpcs.xml
phpunit.dusk.xml
phpunit.xml
public
resources
routes
server.php
storage
sync_dev_2_option_private.sh.example
sync_option_private_2_dev.sh.example
tests
vendor
webpack.mix.js
見つからない場合は、Connect-CMSをインストールした時に「php artisan」コマンドを打った場所を思い出して下さい。
（３）
データベースのテーブル定義ファイル（バケツデータ管理の方）を作成する
php artisan make:migration create_samples_table --path=database/migrations_optionphp artisan make:migration ○○ --path=△△ は「△△という場所に○○という名前で、マイグレーションのテンプレートファイルを作って下さい」という意味のコマンドです。
これにより、現在いるディレクトリにある database/migrations_option というディレクトリの中に「 年_月_日_時分秒_create_samples_table 」という名前のファイルが作られます。
Created Migration: 2022_03_21_00012345_create_samples_table
create_XXXs_table は定型文のようなもので、間にはさまっているXXXs（s：複数形）がテーブル名に使われます。
（４）
データベースのテーブル定義ファイル（投稿データ管理の方）を作る
php artisan make:migration create_sample_posts_table --path=database/migrations_optionphp artisan make:migration ○○ --path=△△ は「△△という場所に○○という名前で、マイグレーションのテンプレートファイルを作って下さい」という意味のコマンドです。
これにより、現在いるディレクトリにある database/migrations_option というディレクトリ（先と同じ場所）の中に「 年_月_日_時分秒_create_sample_posts_table 」という名前のファイルが作られます。
Created Migration: 2022_03_21_013456_create_sample_posts_table
create_XXXs_table は定型文のようなもので、間にはさまっているXXXs（s：複数形）がテーブル名に使われます。
ＤＢ定義ファイルを編集する１ （ データベースにテーブルを追加するために ② ）
上で作ったデータベースのテーブル定義ファイルは単なるテンプレートですから、必要な設定に合わせて自分で書き換えなければいけません。
ここでの必要な設定項目とは、「そのテーブルにどんな列（カラム）を作るか？」です。
あなたはとても優秀です。最初に作った「create_samples_table」はバケツのデータを管理するものですから、「バケツの通し番号」と「バケツの名前」が必要になるであろうとすぐに思いつきます。
（１）
テキストエディタでテーブル定義ファイル（バケツデータ管理の方）を開く
テーブル定義ファイルを書き換えるため、コマンド操作の延長としてviやvimを使ってもよいのですが、あなたは何となく慣れたテキストエディタを使いたいと思いました。
そこでWinSCPを使い、Connect-CMSの「artisan」ファイルがあったところから見て「 database → migrations_option 」ディレクトリに移動し、右クリックから「create_samples_table」のマイグレーション・ファイルを開きました。（みなさんも好きなテキストエディタを使ってください）
ファイルの文字コードは UTF-8N 、改行コードは LF であることを確認してください。
（２）
テーブル定義ファイル（バケツデータ管理の方）を編集する
テーブル定義ファイルを書き換える際、あなたは「通し番号は数字型」「名前は文字列型」と決め、データベースに格納する際の「型」にも気を遣いました。また、「名前は255文字あれば十分だろう」と思ったので、結果、オレンジの下線を引いた２行を追記しました。
（略）
public function up()
{
Schema::create('samples', function (Blueprint $table) {
$table->bigIncrements('id');
下の2行を追記する。行頭は上の$tableに合わせる。
$table->integer('bucket_id');$table->string('bucket_name', 255)->comment('バケツ名');
$table->timestamps();
});
}
（略）
あなたは、データベース内でのメモ書きを添えるため、バケツ名の箇所に ->comment('バケツ名') を足しています。後のことも考えているなんて、あなたはとても優秀です。
また、あなたは何となく、「そのバケツを作った人」「そのバケツを作った日時」「そのバケツを更新した人」「そのバケツを更新した日時」「そのバケツを削除した人」「そのバケツを削除した日時」のデータを取っておいた方がいいような気がしました。確かに変化を追跡できるようにしておくと、何かあった時に便利です。
「なら、自分で用意するから、元からあるタイムスタンプはいらないや」
あなたはそう考え、いま追記した次の行で
（コメントアウトをつける）
$table->timestamps();
↓
//$table->timestamps();
とした後
（コメントアウトしたタイムスタンプの行の次に、以下を追記する）
$table->integer('created_id')->nullable();
$table->string('created_name', 255)->nullable();
$table->timestamp('created_at')->nullable();
$table->integer('updated_id')->nullable();
$table->string('updated_name', 255)->nullable();
$table->timestamp('updated_at')->nullable();
$table->integer('deleted_id')->nullable();
$table->string('deleted_name', 255)->nullable();
$table->timestamp('deleted_at')->nullable();
を追記しました。
あなたは満足そうにファイルを上書き保存します。
$table->integer('created_id')->nullable(); の意味は「データベースのテーブルに created_id という名前でカラムを作ってください。データ型の値は数値型（intger）で、値がない（NULL）場合も許容します」という命令です。あなたはcreated_idを「バケツを作成したユーザーID」に対応させるつもりです。ユーザーの名前は分かりやすいですが、同姓同名がいたら区別できないため、IDも取得しておいた方が有用だと、あなたは思ったわけです。
また、$table->string('created_name', 255)->nullable(); の意味は「データベースのテーブルに created_name という名前でカラムを作ってください。データ型の値は文字列型（string）で、255文字までを想定します。値がない（NULL）場合も許容します」という命令です。あなたはcreated_nameは、バケツを「作成したユーザー名」に対応させるつもりです。
ＤＢ定義ファイルを編集する２ （ データベースにテーブルを追加するために ③ ）
同じように、もうひとつのテーブル定義ファイルも編集します。
あなたはとても優秀です。「create_sample_posts_table」は投稿記事データを管理するテーブルを作るものですから、「投稿記事の通し番号」と「投稿記事のタイトル」「投稿記事の本文」の３つの列（カラム）が必要になることもすぐに思いついてしまうのでした。
（１）
テキストエディタでテーブル定義ファイル（投稿データ管理の方）を開く
あなたは先ほどと同じように、慣れたテキストエディタで操作するつもりです。
WinSCP上で「年_月_日_時分秒_created_sample_posts_table」を右クリックし、Visual Studio Codeでファイルで開きました。（たまたまVSCodeを使いましたが、他のテキストエディタもかまいません）
ファイルの文字コードは UTF-8N 、改行コードは LF であることを確認してください。
（２）
テーブル定義ファイル（投稿データ管理の方）を編集する
先ほどと同じように、あなたは「投稿記事の通し番号は数字型」「投稿記事のタイトルは文字列型」と決め、データベースに格納する際の「型」にも気を遣い、さらに「名前は255文字あれば十分だろう」と考えました。
その後、「長く書けるため、投稿記事の本文はテキスト型がいい」と思ったので、オレンジの下線部分をファイルに追記しました。
（略）
public function up()
{
Schema::create('samples', function (Blueprint $table) {
$table->bigIncrements('id');
この３行を追記する。行頭は上の$tableに合わせる。
$table->integer('sample_id');$table->string('title', 255)->comment('タイトル');
$table->text('content')->nullable()->comment('内容');
$table->timestamps();
});
}
（略）
あなたはデータベース内でのメモ書きを表示させるため、「タイトル」と「本文」にそれぞれ ->comment('タイトル') と ->comment('内容') も足しました。将来、あなたの仕事は丁寧だと賞賛されるでしょう。
そして、あなたはまた何となく「その投稿記事を作った人」「その投稿記事を作った日時」「その投稿記事を更新した人」「その投稿記事を更新した日時」「その投稿記事を削除した人」「その投稿記事を削除した日時」のデータを取っておいた方がいいような気がしました。そうですね、確かにあった方が便利だと思います。
「じゃあ、ここも自分で用意するから、元からあるタイムスタンプはいらない」。あなたはそう考えたので、先ほどと同じように
（コメントアウトをつける）
$table->timestamps();
↓
//$table->timestamps();
とした後、
（コメントアウトしたタイムスタンプの行の次に、以下を追記する）
$table->integer('created_id')->nullable();
$table->string('created_name', 255)->nullable();
$table->timestamp('created_at')->nullable();
$table->integer('updated_id')->nullable();
$table->string('updated_name', 255)->nullable();
$table->timestamp('updated_at')->nullable();
$table->integer('deleted_id')->nullable();
$table->string('deleted_name', 255)->nullable();
$table->timestamp('deleted_at')->nullable();
を追記しました。
あなたは満足し、ファイルを上書き保存しました。
$table->integer('created_id')->nullable(); の意味は「データベースのテーブルに created_id という名前でカラムを作ってください。データ型の値は数値型（intger）で、値がない（NULL）場合も許容します」という命令です。あなたはcreated_idを「投稿データを作成したユーザーID」として扱うつもりです。名前だけでなく、確実に個人の区別のつくIDをセットで使うと利便性が高いとあなたは思ったからです。
$table->string('created_name', 255)->nullable(); の意味は「データベースのテーブルに created_name という名前でカラムを作ってください。データ型の値は文字列型（string）で、255文字までを想定します。値がない（NULL）場合でも許容します」という命令です。created_nameは、バケツを作成したユーザー名を扱うため、あなたが分かりやすいだろうと思って単語を組み合わせて命名したカラム名です。
ＤＢ定義ファイルを反映させる（ データベースにテーブルを追加するために ④ ）
上でデータベースのテーブル定義ファイル２つを完成させました。しかし、これは単なる設計書のようなものに過ぎません。この定義ファイルをデータベースに反映させることで、テーブルが追加されます。この作業をマイグレーションと言います。
では、Connect-CMSのデータベースの中に、上で定義した「samples」テーブル（bucket_id, bucket_name, created_id, created_name, created_at, update_id, update_name, update_at, deleted_id, deleted_name, deleted_at のカラムを含む）と「sample_posts」テーブル（sample_id, title, content, created_id, created_name, created_at, 以下略、のカラムを含む）を追加していきましょう。
（１）
ＤＢ定義ファイルを反映させる
php artisan migrate --path=database/migrations_option「いまいるディレクトリ位置にある『database > migrations_option』のディレクトリに置いてあるマイグレーションファイルを使い、データベースの構造を更新して下さい」という意味のコマンドです。
Migrating: 2022_03_10_221356_create_samples_table
Migrated: 2022_03_10_221356_create_samples_table (0.03 seconds)
Migrating: 2022_03_11_091238_create_sample_posts_table
Migrated: 2022_03_11_091238_create_sample_posts_table (0.03 seconds)
Connect-CMSのデータベース構造が更新され、あなたの簡易掲示板プラグインで使用するデータを格納する場所が作られました。
せっかくですから、phpMyAdminでデータベースに追加されたテーブルを見にいきましょう。
テーブル一覧で「samples」と「sample_posts」のテーブルが生成されていることを見て取れます。
また、テーブルの詳細を見ると、指定した列（カラム）も生成されていることが分かります。
モデル・クラスの作成
データベース構造を更新し、テーブルとカラムを追加しました。しかし、データの格納場所を作ったに過ぎず、それだけでオリジナル掲示板は使えるようになりません。掲示板に文字を入力するためのインターフェースや、入力された文字をデータベースに登録したり、呼び出したり、更新したり、削除したりする仕組みが必要です。
ですから、「さぁ、ここから本格的なプログラミングです」。
と言うと、身構えるかもしれませんが、実はもう出来上がっています。
「はぁ？」
おぉ、残念です。あなたはとても優秀な人ですが、すでに必要なプログラミングを終え、ファイルを保存していることを忘れてしまったようです。
催眠術をかけます。朦朧（もうろう）としながらでかまいませんので、次の操作をしてきてください。
（X-2）
オプションプラグインのセットをzipでダウンロードする
GitHubの機能でリポジトリのファイルをzipにまとめてダウンロードします。
［Code］ボタンから「ZIP Download」を押します。
（X-3）
ダウンロードしたzipファイルを展開する
ダウンロードしたzipファイルを展開します。
ここでは使用しないファイル/フォルダも入っていますが、そのままで構いません。
私はこれらのファイルを株式会社オープンソースワークショップの永原篤さんが作ったものだと思っていますが、あなたが似たようなファイルを自分で書いたとしても指したる違いはありません。偶然にもあなたはConnect-CMSで求められるコードの書き方を知っていて、「自分でも気づかないうちに『ログイン者だけが投稿でき、非ログイン者も読める、返信機能のない、簡易な掲示板』のインターフェースと機構に関するプログラムを書いていた」、ということにしましょう。
（１）
モデル・クラス・ファイルをアップロードするディレクトリを作成する
手元の「connect-cms_option-master」というフォルダにオリジナルの掲示板プログラムに関係するファイルが入っています。これからそれらのファイルをサーバーにアップロードしていきます。
あなたもご存じのように、ファイル間のやり取りはサーバー上でのパスが合わないと失敗します。ですから、該当の位置に適切なファイルをアップロードする必要があります。
新しいプラグインを実装しようとしていますから、対応するディレクトリを新しく作る必要がある場合もあります。ディレクトリ作成やファイルのアップロードには、WinSCPのようなアプリケーションを使うと簡単です。
WinSCPでサーバー上の「 app\ModelsOption\User 」ディレクトリに移動し、「 Samples 」（最初が大文字）というディレクトリを作ります。
アプリケーションのコアコードを配置するディレクトリ（app）の中にある、追加的なモデルを置く（ModelsOption）ディレクトリの中にある、ユーザーが使うものを配置するディレクトリ（User）の中に、オリジナル・プラグイン「サンプル」のモデル用ファイルを置くディレクトリ（Samples）という関係です。
（２）
モデル・クラス・ファイルをアップロードする
ダウンロードしたzipファイルを展開して出てきた「connect-cms_option-master\app\ModelsOption\User\Samples」の中にある「Sample.php」（プラグイン・バケツモデル）と「SamplePost.php」（投稿記事モデル）の２つを、WinSCPを使って（１）で作成したサーバー上の「Samples」ディレクトリ内に放り込みます。
ちなみに２つのファイルの中を見ると、そう多くないコードが書いてあります。「別のオリジナル・プラグインを作る際は、この中身を書き換えればよいのだろう」とあなたは思うはずです。
プラグイン・クラスの作成
モデル・クラスのアップロードの次はプラグイン・クラスのファイルをアップロードします。よく分かりませんが、きちんと準備しているあなたはとても優秀です。
（１）
プラグイン・クラス・ファイルをアップロードするディレクトリを作成する
WinSCPでサーバー上の「 app\PluginsOption\User 」に移動し、新しいディレクトリ「 Samples 」（最初が大文字）を作ります。
アプリケーションのコアコードを配置するディレクトリ（app）の中にある、追加的なプラグインを置く（PluginsOption）ディレクトリの中にある、ユーザーが使うものを配置するディレクトリ（User）の中に、オリジナル・プラグイン「サンプル」のモデル用ファイルを置くディレクトリ（Samples）という関係です。
（２）
プラグイン・クラス・ファイルをアップロードする
ダウンロードしたzipファイルを展開して出てきた「connect-cms_option-master\app\PluginOption\User\Samples」の中にある「Plugin.ini」（プラグイン定義ファイル）と「SamplesPlugin.php」（プラグイン・プログラム）の２つを、WinSCPを使って（１）で作成したサーバー上の「Samples」ディレクトリに放り込みます。
ちなみに、「Plugin.ini」ファイルの２行目に「 plugin_name_full = "サンプル" 」とあります。プラグイン名を指定する行です。Connect-CMSのWebサイトの「プラグイン管理」などに表示されるプラグイン名を変えたい場合、ここを書き換えます。
画面の準備
続いて、画面表示に関するファイルをアップロードしましょう。
（１）
画面表示系ファイルをアップロードするディレクトリを作成する
WinSCPで「 resources\views\plugins_option\user 」というディレクトリに行き、「 samples 」（すべて小文字）というディレクトリを作ります。
表示系に関わるファイルやコードを配置するディレクトリ（resource/view）の中にある、追加的なプラグインを置く（plugins_option）ディレクトリの中にある、ユーザーが使うものを配置するディレクトリ（user）の中に、オリジナル・プラグイン「サンプル」のモデル用ファイルを置くディレクトリ（samples）という関係です。
（２）
設定時のタブ表示関連のファイルをアップロードする
あなたは何度も目にしていることでしょうが、Connect-CMSに管理者ログインした後、プラグインの右上にある歯車アイコンを押すと、どのプラグインでも共通の設定タブが表示されます（下図）。
協調性のあるあなたは、「サンプル」プラグインでも同じように表示させたいと思っています。
その設定タブを表示させるためのコードはすでにphpファイルに書いて用意していますね。あなたはとても優秀なのです。
ダウンロードしたzipファイルの中（ 「 connect-cms_option-master\resources\views\plugins_option\user\samples\ 」 ）にある「 samples_frame_edit_tab.blade.php 」（編集画面のタブ・テンプレート）を（１）で作成した「samples」ディレクトリにアップロードします。
（３）
他の画面表示系ファイル群をアップロードするディレクトリを作成する
WinSCPでサーバー上の現在位置（samplesの中）に「 default 」というディレクトリを作ります。
（４）
画面表示系のファイル群をアップロードする
他の表示系のファイルはたくさん必要ですが、優秀なあなたはすでにそれらを準備しています。
「default」ディレクトリに、ダウンロードしたzipファイルの中にある「 connect-cms_option-master\resources\views\plugins_option\user\samples\default 」ファルダにある７つのファイルを（３）で作成した「default」ディレクトリにアップロードしましょう。
- bucket.blade.php （バケツ編集画面のテンプレート）
- edit.blade.php （投稿記事登録画面のテンプレート）
- empty_bucket.blade.php （バケツなし画面のテンプレート）
- index.blade.php （デフォルトのテンプレート）
- list_buckets.blade.php （データ選択テンプレート）
- show.blade.php （投稿記事詳細のテンプレート）
- template.ini （テンプレートの定義ファイル）
オリジナルのデザイン・テンプレートのアップロード
なんと、あなたは「default」というデザイン・テンプレートのほかに、「カード」というデザイン・テンプレートを用意していたようです。素晴らしい。これもアップロードして利用者の選択肢を増やしてあげましょう。
ちなみに、この「カード」テンプレートを適用すると、投稿をカード型に並べてくれるようです（図の下側）。
（１）
追加のデザイン・テンプレートをディレクトリごとアップロードする
WinSCPでサーバー上の「\resources\views\plugins_option\user\samples」ディレクトリに、ダウンロードしたzipファイルの中（ 「 connect-cms_option-master\resources\views\plugins_option\user\samples\ 」 ）にある「 card 」ファルダをそのままアップロードします。
先の「default」もデザイン・テンプレートですので、並列的な扱いというわけです。
ちなみに「card」ディレクトリの中をみると、ファイルは「index.blade.php」と「templete.ini」の２つしかありません。共用できるところは「デフォルト」のファイルを使用し、「カード」特有のコードだけを「card」ディレクトリの中から呼び出して使っています。
Ｄ．プラグイン管理での使用準備
［ 概要 ］
Connect-CMSの「プラグイン管理」にて、アップロードしたオリジナル・プラグインを使用可能にします。
プラグインを使用可能にする
プラグインのプログラムファイルと表示用ファイルをアップロードしても、すぐに使えるわけではありません。Connect-CMSは管理者メニューの中で使用するプラグインのON/OFFを制御しており、オリジナル・プラグインは初期状態でOFFになっています。そのため、これをONに変える必要があります。
（１）
管理者メニューから「プラグイン管理」を開く
（２）
「サンプル」プラグインにチェックを入れ、［更新］ボタンを押す
（３）
コンテンツ画面に戻り、オリジナル・プラグインを設置するページに移動する
以上でオリジナルのプラグインを使用する準備が整いました。
実際にコンテンツページでプラグインを設置し、動作確認を行いましょう。
Ｅ．「サンプル」プラグインの使用
［ 概要 ］
「サンプル」プラグインを設置し、挙動を確認します。
（１）
「サンプル」プラグインの設置
標準のプラグインと同じように設置します。
（写真用にプラグインの数を減らしています）
（２）
歯車マークから「新規作成」をクリックする
この簡易掲示板で最初にやることは、オリジナル・プラグインとしての「 バケツ 」の新規作成です。そうなるようにあなたが作ったからです。
例として「自前の掲示板」と命名します。
（３）
「バケツ選択」をクリックする
このフレームに表示させる簡易掲示板のデータセット（バケツ）を選択します。バケツが１つだけだと、選択肢がありませんが、操作として確認しておきます。
（４）
「設定変更」をクリックする
ここで先ほど命名した掲示板の名前を変更できます（バケツ名の変更）。
（［削除］ボタンもあります ）
（５）
通常ページに戻り、［新規登録］ボタンを押す
投稿テストをしてみましょう。設定画面から通常画面に戻ると、［新規登録］ボタンが見つかります（要ログイン）。これをクリックします。
（６）
「タイトル」と「説明」を入力し、［登録確定］ボタンを押す
あなたはなんとなく、タイトルに「一番目の投稿」、説明に「最初の投稿テストです。」と書きたくなりました。
（７）
登録を確認する
公開ページに戻り、投稿を確認します。
同様の操作を繰り返すと、新しいものが上に登録されていきます。
（あなたがそのようにプログラムを作ったからです）
（８）
phpMyAdminでデータベースの登録を確認する
せっかくですから、データベースにデータが登録されていることも確認してみましょう。
サンプルプラグインのテーブル「samples」に『自前の掲示板』というバケツが登録されています。
サンプルプラグインのテーブル「sample_posts」も開いてみましょう
投稿した３件のデータが格納されています。
優秀なあなたは、特に迷うことなく「サンプル」プラグインを実装できたことでしょう。
それを確認したところで「フィクション」という魔法は解けていきます。
公式のオリジナル・プラグイン「サンプル」を用いた実装の練習は以上です。
ここで学んだことは、
- 最初にサービスの全体像を思い描く
- 登録するデータを考え、定義ファイルを用いてデータベース構造を更新する
- データのやりとり、画面表示に関わるプログラミングを行い、ファイルを作る
- サーバーにある指定のディレクトリに関連ファイルをアップロードする
- Connect-CMSにログインし、「プラグイン管理」でONにする
- 動作確認をする
といったところでしょうか。
公式Wikiと勉強会の内容はおそらくこのようなことを述べていたのだと思います。
２と３を頑張れば、あなたもオリジナル・プラグインを作れるようになるはずです。
