更新日: 2020年07月10日
公開日: 2020年07月05日

【PHP】ECサイト専用CMS『EC-CUBE』の始め方

PHP学習中の方、PHPに興味がある方、ECサイト専用CMSの『EC-CUBE』をご存知でしょうか？

イーシーキューブ社が主体となって開発を進めるEC-CUBEは、誰でも無料で利用可能なオープンソース型のCMSです。(国産のネットショップ専用)

PHPのCMSと言えば『WordPress』が有名ですが、『EC-CUBE』もこれからどんどんシェアが拡大していくはず。今のうちに学習しておきましょう！

CMS ・・・プログラミング知識不要でも、Webサイトを作れるプログラム群。代表的なものにWordPressがある。

ECサイト専用CMS『EC-CUBE』の始め方
EC-CUBEとは
EC-CUBEを始める前に
サクラ・レンタルサーバーにEC-CUBEをインストールする方法
EC-CUBEの編集方法
EC-CUBEのSEO
まとめ

ECサイト専用CMS『EC-CUBE』の始め方

EC-CUBEとは

サンプルページ

2006年にオープンソースで公開されたネットショップ構築用CMSで、現在はレンタルサーバーのサクラやX-Serverなどで簡単インストール可能。

プログラミング言語はPHPを使い、ベースに Symfony というフレームワークを使用し、各種バージョン対応を行い運営中。利用者は、複雑なプログラムを構築しなくても、商品登録から在庫管理、税率設定などを管理画面で操作可能。また追加の機能はプラグインで制御でき、テンプレートや決済プロバイダーも豊富。

このように一見すると凄そうな EC-CUBE、しかしあまり聞かない、という方も多い事でしょう。EC-CUBEがWordPressのように表立って登場しない理由はいくつか考えられます。

WordPressに比べて難しい
競争相手が多い
主に国内の開発者が多い

最初のWordPressに比べて難しい、これはWordPressを経験しているが為に感じる事で仕方ありません。またWordPressのような”ブログ型”に比べると、ECサイトは商品管理からカート機能、お知らせ機能、ユーザー機能と処理内容が圧倒的に多いです。その分プログラムが複雑になって、データベースの構造も複雑になるのは仕方ありませんね。

”競争相手が多い”、実はこれEC-CUBE 以外にオープンソース型のECプラットフォームが存在するため。

X-cart
WooCommerce（WordPress）
Magento Commerce
PrestaShop
OpenCart etc

「えっ、こんなに？」と思われるかもしれませんが、結構凄いものばかりです。特に MagentaShop はページデザインをドラッグ＆ドロップで作成できますので、HTML や CSS を知らない、詳しくない、という方でもOKなプラットフォーム。

”EC-CUBEは主に国内の開発者が多い”、これはメリットにもデメリットにもなる話ですが、WordPress などに比べると圧倒的に情報量が少ない状況。エラー発生時は、管理者の技術レベルが問われてしまいます。

さあ、このようにEC-CUBEを取り巻く環境はいろいろですが、「国産」「豊富な決済手段」という点から一度は使ってみたいですよね。

EC-CUBEを始める前に

EC-CUBEを始める方法は主に下記の通り。

ローカル環境（自分のパソコン）
レンタルサーバー
AWS

実際に私は、ローカル環境、サクラサーバー、バリューサーバー、ロリポップ、AWS、 GitPod で EC-CUBE を使ってみようと試みてみました。その結果は下記の通り。

	結果
ローカル環境	❌、PHPの実行環境が難しい？ Node.js も必要だ。
サクラサーバー	最初は❌、２回目はある設定を変えてOK。
バリューサーバー	❌、2020.05は使えた Composer が使えなくなった
ロリポップ	△、EC-CUBEのバージョンが古い
AWS	❌、EC-CUBEの開発環境を構築できなかった
GitPod	△、デモページはOKだが、データベース使えないため管理画面は❌。

うまくいったものといかなかったもの、約丸２日間奮闘しましたが、 AWS などでは EC-CUBE の開発環境を構築する事ができませんでした。 EC-CUBEのインストール方法は公開されているものの、うまくいかない、これは歯痒いですが、ある意味 EC-CUBE の複雑さを物語っているのではないでしょうか？

結果的にはサクラサーバーでEC-CUBEをインストールする方法が簡単で、安心。今回はサクラサーバーで EC-CUBE を使う様子をご紹介していきます。

過去に Docker や Grant など数々の難題をクリアしてきたつもりの大島ですが、EC-CUBEをローカルとAWSにインストールできませんでした。時間的な問題もありますが、エラーハンドリングをしていて思ったことは、「情報量が少ない」ということ。
再インストールやシステムをチェックできる時間があればいいのですが、今回は❌という結果に終わりました。

サクラ・レンタルサーバーにEC-CUBEをインストールする方法

「そんなのサクラのページにマニュアルあるじゃん」と突っ込まれる方もいらっしゃるでしょう。確かにマニュアル（LINK）は公開されていますが、私はそれでも一発でインストールできませんでした。

サクラのレンタルサーバーに EC-CUBE をインストールしようとして、失敗した画像

準備

サクラ・レンタルサーバーのスタンダードコース以上に登録
EC-CUBEの関連ファイルをダウンロードするフォルダの作成（実行するディレクトリの指定）
データベースの作成

Step 1: PHP のバージョン確認

EC-CUBEの公式ドキュメントには PHP 7.2.19 で動作確認済み、サクラのマニュアルには 7.4 では動かない、と書かれています。今回はサポート期限が短いですが、 7,2 系を選択。

GitPod は PHP 7.4系ですが、 EC-CUBE インストールでき、動きました。恐らく PHP や Node.js などのシステム的な問題と考えられます。

Step 2: php.ini の編集

date.timezone = Asia/Tokyo

サクラのマニュアルを確認すると、EC-CUBEをインストールする前に PHP のタイムゾーンを設定してくださいとのこと。マニュアル通りに上図のように php.ini を編集し、保存。

Step 3: EC-CUBEをクイックインストール

サクラサーバー管理画面・左サイドバーの「Webサイト／データ」を選択し、クイックインストールで EC-CUBE を選択。

今回は独自ドメインを使用せず、サクラのサブドメインを使って EC-CUBE を使用。インストールURLでサブディレクトリを選択し、事前に作成しておいたディレクトリ名を設定。

データベース名もあらかじめ用意していたものが自動で表示されますので、適当なモノを選択し、パスワードと同意ボタンを押して「作成する」を実行。

この後、１分程度画面が変わらず、「あれ？エラー？」と焦りますが、そのままお待ちください。無事 EC-CUBE がインストールできると下図のようにインストール済みパッケージとして表示されます。

そして画面に書かれている「設置先」のリンクをクリックすると以下のように。

Step 4: EC-CUBEの初期設定

ここからはデータベースに記録する内容を設定。

サイトの設定画面では、店名などを入力。こちらの情報はあとでも変更する事ができますが、ログインIDなどはサクラサーバーのログイン、データベースのログインとは違ってきますので、混同しないように注意しましょう。

また管理画面へのアクセスIPアドレスは、端末と通信環境が固定であれば自分のパソコンのIPアドレスを登録しておくと安心できますが、環境が変わる場合は「あれ、なんでログインできないの？」と焦りますので注意しましょう。メール設定については事前にサクラの管理画面で設定しておくとスムーズ。

EC-CUBEで使用するデータベースの設定画面。事前に作成しておいたデータベースの情報を入力。この時ホスト名の蘭は必須マークが付いていませんが、入力しないと先に進めませんでした。入力内容がわからない場合は、サクラの管理画面からデータベースの情報を確認しましょう。

データベースの初期化について尋ねられますので、これはこのままスルー。

上図のように表示されれば、サーバー側のセットは完了です。次は管理画面にログインして EC-CUBE を確認していきます。

EC-CUBE管理画面にログイン

先ほどブラウザ上で設定した EC-CUBE のユーザーID とパスワードを入力すると、管理画面にログインできます。

そして管理画面末尾のアドレスを消すと、EC-CUBE のトップ画面を開く事ができますね。これでEC-CUBE自体のインストールは完了。

EC-CUBEの編集方法

EC-CUBEはどこか WordPress と似ているようで違う。まず私が最初に「んっ？」と思った点は、トップ画面に表示されているカテゴリーリストの画像、実はこの画像を表示させようと思うと結構大変です。

プラグインを検索すると 3万円ぐらいで販売されていて、プログラムで画像を利用しようと思うと複雑な EC-CUBE のプログラムを理解する必要が。

また実際の決済方法については、決済プロバイダーの「SBペイメントサービス」や「ペイジェント決済プラグイン」などを利用及び申請する必要が。つまり EC-CUBE の管理画面では、売り上げを数字的に管理できるものの、入出金などは外部で処理、ということになります。セキュリティ的には安心できますね。

ちょっとした CSS や JavaScript については管理画面から編集可能で、この辺りは WordPress 同様便利。ちなみにデータベースの様子は以下の通り。

WordPressに比べると格段にテーブルの数が多い。

EC-CUBEのSEO

さて、一旦 EC-CUBE のページを公開できたら気になるのがSEO。 Google Speed Insights と構造化チェックを行った結果を下記の通りご紹介します。

モバイル：63点

主に画像系の部分で減点され、SEO的には厳しいか、という状況。WordPress並に srcset で画像を読み込むとなると、ちょっと難しそう。

構造化については設定無いので、別途ベータベースから情報を読み込んで、専用フォーマットに落とし込む必要があり。

サクッと ECサイトを立ち上げ・管理できる一方で、SEOの面は改良の余地あり、といった状況になっています。

＼Webサイト担当者としてのスキルが身に付く／

無料カウンセリングはこちら

まとめ

今回私は初めて EC-CUBE を利用しましたが、「こんなに便利なモノがあるんだな」と痛感しました。多くの方が「ネットショップ＝カラーミーやWix」、もしくは「ネットショップの立ち上げ費用は高い」と思われているかもしれませんが、今回ご紹介した EC-CUBE をはじめ、世の中にはたくさんのネットショップの CMS やプラットドームが公開されています。 WordPressがブログやコーポレート系のサイト制作を加速させるなら、 EC-CUBE はネットショップのビジネスを加速させてくれることでしょう。

目まぐるしく変化する Web をターゲットに挑戦するなら、スピードとモチベーションが大事です。ひとりでの学習では維持が難しいですが、講師と二人三脚で頑張れるマンツーマンオンラインレッスンのCodeCampなら心配無用！あなたの理解度や学習ペースに合わせて、効率よく着実に知識と技術が身につきます！

まずは無料体験で、雰囲気やレッスン内容を確かめてみてください！！