【EC-CUBE】新しいフロントページを追加する方法

2022 5/28

2016年12月7日 2022年5月28日

EC-CUBE２で新規にフロントページを追加する方法の解説です。

dtb_pagelayoutにレコードを追加する

dtb_pagelayoutに新しいレコードを追加します。

各カラムの値は下記のように設定します。

page_idは既存のレコードと重複しない値にします。
device_type_idはPCやスマホ別のIDです（下記参照）。
page_nameはページの名前です。管理画面や、フロントに表示されます。
urlは追加するページのURLです。
filenameは、テンプレートファイルのファイル名。(.tplは不要)
edit_flgは、2を設定して管理画面からも編集出来るようにします。

device_type_idの種別

device_type_id	端末
1	モバイル
2	スマートフォン
10	PC

サンプルSQL

PC用のテストページ(test/index.php)ページを追加するなら下記のようなSQLになります。

INSERT INTO `dtb_pagelayout` (`device_type_id`, `page_id`, `page_name`, `url`, `filename`, `header_chk`, `footer_chk`, `edit_flg`, `author`, `description`, `keyword`, `update_url`, `create_date`, `update_date`, `meta_robots`) VALUES ('10', '38', 'テストページ', 'test/index.php', ‘test/test', '1', '1','2', NULL, NULL, NULL, NULL, CURRENT_TIME(), CURRENT_TIME(), NULL);

PHPファイルを作成

上記でdtb_pagelayoutに追加レコードにurlに対応したPHPファイルを作成します。

PHPファイルはページクラスの呼び出しくらいしかしないので、適当な既存のphpファイルをコピーして、ページクラスの部分のみ書き換えればOKです。
場所はデフォルトでは、ドキュメントルート直下の「html」ディレクトリです。

サンプルPHPファイル

test/index.phpのサンプルです。
ページクラスをpage_extends/test/LC_Page_Test_Ex.phpとしています。

<?php
require_once '../require.php';
// ページクラスを書き換え（１）
require_once CLASS_EX_REALDIR . 'page_extends/test/LC_Page_Test_Ex.php';

//  ページクラスを書き換え（２）
$objPage = new LC_Page_Test_Ex();
$objPage->init();
$objPage->process();

ページクラスを作成

PHPファイルで呼び出ししたページクラスを設置します。

このクラスのactionメソッドに、ビジネスロジックを実装していきます。

既存のページクラスと作りを合わせましょう。
LC_Page_Exを継承してクラスを作成します。

ディレクトリは、「data/class_extends」配下です。

ページクラスのサンプル

ビジネスロジックがなしの空のページクラスのサンプルです。

<?php
require_once CLASS_EX_REALDIR . 'page_extends/LC_Page_Ex.php';

class LC_Page_Test_Ex extends LC_Page_Ex
{
    /**
     * Page を初期化する.
     *
     * @return void
     */
    public function init()
    {
        parent::init();
    }

    /**
     * Page のプロセス.
     *
     * @return void
     */
    public function process()
    {
        parent::process();
        $this->action();
        $this->sendResponse();
    }

    /**
     * Page のアクション.
     *
     * @return void
     */
    public function action()
    {
		// ここに処理を実装
		echo "テストページです";

    }
}

テンプレートファイルを配置

最後にテンプレートファイルを配置します。
ディレクトリは、「data/Smarty/templates/｛端末別ディレクトリ｝/」配下です。
dtb_pagelayoutで登録したファイル名でテンプレートファイルを配置します。

テンプレートファイルのサンプル

サンプルと言っても、ファイルの中身が出力されるので、適当にテキストを入力すればOK。
ちゃんとしたページを作る時は、HTMLやSmartyで実装します。

PCページです

これで、新規ページの追加は完了です。
/testへアクセスして新しく追加されたページを確認してみましょう。

まとめ

ざっくり簡単にEC-CUBE２のフロントの新規ページの作成方法でした。

こういうのは、何すれば良かったんだっけ？
もれはないかな？
なんて毎回確認するの面倒なので、手順をメモしておくと後々楽になりますよね！

最後までお読み頂きありがとうございました！

よかったらシェアしてね！

URLをコピーしました！

URLをコピーしました！