【本日】誠に勝手ながら、全社員研修のため、2017年4月20日(木)の13:00以降はお電話によるサポート受付を休止させていただきます。

ECサイト構築クラウド型プラットフォーム

【本日】誠に勝手ながら、全社員研修のため、2017年4月20日(木)の13:00以降はお電話によるサポート受付を休止させていただきます。

モバイルファーストマーケティングラボ

えっ、たったこれだけ?concrete5をXAMPPの仮想環境で動かしてみる

  • 2015.10.19
  • 2016.05.13
  • 技術
えっ、たったこれだけ?concrete5をXAMPPの仮想環境で動かしてみる

秋も本格的に深まってきて、寒い日が増えてまいりました。皆様いかがお過ごしでしょうか。開発部の森川です。

今回はHTML,CSS等のマークアップ言語に詳しくなくても誰でもホームページが簡単に作れるCMS(コンテンツマネジメントシステム)の一つ、concrete5を開発環境の一つ、XAMPP(WebサーバーやFTPサーバーなどをパッケージ化したプロジェクト)で動かしてみる方法をご紹介したいと思います。

concrete5とは?

誰でも簡単に、直感的な操作で高機能なホームページが作れるCMSです。

例えば、簡単なスライドショーであれば、使いたい画像をセットするだけで作ることができます。また、テキストやナビゲーション等の各コンテンツは「ブロック」と呼ばれており、この「ブロック」を組み合わせてホームページを構築していきます。

用意するもの

1.XAMPP or MAMP(今回はXAMPPでインストールする手順を紹介します。)
2.concrete5最新版(10/15日現在 5.7.5.2)

まずはXAMPPをダウンロード

XAMPP

XAMPPにconcrete5をインストールする下準備

XAMPPをインストールしたら、次はconcrete5をインストールする準備をします。

まず\xampp\phpのディレクトリの中にあるphp.iniファイル(PHPの設定をまとめたもの。編集できる。画像参照。)をテキストエディタで開き、PHPの設定を変えます。

画像1. php.iniのある場所

151015_labo_xampp_php

画像2.php.iniの設定(一部抜粋)

151015_labo_php_ini

PHPの設定

Ctrlキー+Fキーで以下の設定の矢印左側の文字を検索して、矢印右側のものに変更しましょう。

POSTできる最大のデータ量を「8」から「20」に変更
大きなファイルをアップロードするために必要な設定です。
post_max_size=8M ⇒ post_max_size=20M

標準の文字コード設定をUTF-8に設定します。
「;」を消すことで、設定が有効になります。
;default_charset="UTF-8"⇒default_charset="UTF-8"

標準の言語設定を『Japanese』から『neutral』に変更します。
;mbstring.language = Japanese ⇒ mbstring.language = neutral

FileInfoの拡張を有効にします。
;extension=php_fileinfo.dll ⇒ extension=php_fileinfo.dll

MySQLの設定

Ctrlキー+Fキーで[mysqld]の文字を検索しましょう。
見つかったら、その次の行に以下の2行を追加します。

lower_case_table_names = 0
(テーブル名の大文字小文字を区別する)

explicit_defaults_for_timestamp=true
(TIMESTAMP型のデフォルト値を設定)

Ctrlキー+Fキーで「innodb_buffer_pool_size」を検索し、innodb_buffer_pool_size の値を『16M』から『32M』に変更します。

innodb_buffer_pool_size = 16M ⇒ innodb_buffer_pool_size = 32M

Ctrlキー+Fキーで「innodb_additional_mem_pool_size」を検索し、innodb_additional_mem_pool_sizeの行の先頭に[#]を追加してコメントアウトします。

innodb_additional_mem_pool_size = 2M → #innodb_additional_mem_pool_size = 2M

(innodb_additional_mem_pool_size = InnoDBの内部データなどを保持するための領域)

※下記も併せてご参照下さい。

XAMPPへのインストール方法 concrete5 japan 日本語公式サイト

PHPとMySQLの設定が完了したら、次はXAMPPのアプリケーション(xampp_control)を起動します。
起動後、ApacheとMySQLを起動させ、phpMyAdminにアクセスします(下記画像参照)

画像1. xampp_controll起動

151015_labo_phpMyAdmin1

画像2. phpMyAdminにアクセス

151015_labo_phpMyAdmin2

データベース作成

phpMyAdminにアクセスできたら、次はconcrete5用のデータベースを作成します。
今回はデータベースの名前を「concrete5」に設定します。データベースの中身は空でなくてはならないので、名前を付けるだけで作成は完了です。

画像3. データベース作成1

151015_labo_phpMyAdmin3

画像4. データベース作成2

151015_labo_phpMyAdmin4

concrete5最新版をダウンロード

データベースの作成が終了したら、concrete5の最新版をダウンロードします。concrete5 japan 日本語公式サイトからダウンロードすることが可能です。
※最新版は2015年10月15日現在5.7.5.2です。

concrete5 japan 日本語公式サイト ダウンロードページ

ダウンロード完了後、xamppのhtdocsディレクトリ配下にダウンロードしてきたconcrete5最新版のzipファイルを解凍して配置します。

動作条件のチェック

設定に問題が無ければシステムチェックが全て緑色で表示されます。その状態になったら「インストールを続ける」ボタンをクリックして次に進みます。

画像. システムチェックが全て緑色の状態

151015_labo_check

必要事項を入力

「サイト名」にお好みのサイト名を入力して下さい。ここで入力したものがサイトのタイトルなどに使われます。

「パスワード」にはconcrete5にログインする際のパスワードを入力します。

MySQLデータベース情報に必要項目を入力します。XAMPPでconcrete5を動かす際には、下記の画像のように入力します。

また、「サンプルデータ」の欄は、今回は「フルサイト」を選択します。

画像. 設定の内容

151015_labo_setting

上記の入力を完了後、「concrete5をインストール!」をクリックします。

インストール完了!

インストール完了後、「サイトを開く」をクリックするとconcrete5で作成したサイトを見ることができます。

デフォルトの「Elemental」のテーマは下記の画像のようになっています。

画像1. Elementalのテーマ

151015_labo_Elemental

画面上部のアイコンをクリックして、中身を編集します。
右から順に、「ブロック編集」「ページ設定」「ブロック追加」となっています。

画像2. 編集アイコン

151015_labo_edit

なお、この記事での紹介はインストールまでとさせていただきます。詳細な編集内容については、concrete5japanの公式サイトをご参照下さい。

concrete5 japan 日本語公式サイト 「操作・サイト編集方法」

”スマホで売れる”ためには必須の「レスポンシブECサイト」とは?

CTA-IMAGE 2019年、ECサイトの利用者は今やスマ―トフォンからが7割を超え、市場のニーズは完全にPCからスマホに転換しました。
また、検索エンジン大手のGoogleも「モバイルファーストインデックス」を打ち出し、スマホ対応の手段として正式に「レスポンシブWEBデザイン」を推奨しています。 そのような背景から、昨今のEC市場ではスマートフォンへの適切な対応が急務となっており「レスポンシブECサイト」のニーズが非常に高まってきています。本パンフレットではECサイト運営を取り巻く環境の変化を、レスポンシブECサイト構築導入実績No.1のプラットフォームである「aishipR」の機能や実績を踏まえながらまとめました。

・レスポンシブECサイトがなぜ今選ばれるのか
・これまでのECサイトの課題とは何なのか
・どのようにすれば解決できるのか

といったノウハウから、プラットフォーム変更で得られる効果の実例まで網羅して解説しています。
ECサイトの運営されておられる経営者様だけでなく、運営担当者様にも必ずお役に立つ内容となっておりますので、是非ご活用ください。
機能のご確認はお気軽にお問合せ、もしくは2週間無料お試し利用で。
aishipRの無料体験、お問合わせはお気軽に。説明会・資料請求も受付中。
0120-173-163
0120-173-163
無料体験
  • 無料体験
  • 問合せ
  • 説明会
  • 資料請求
  • 問合せ
  • 説明会
  • 資料請求
+