オープンソースのCMS「concrete5」5.7を使ってみよう

直感的にサイトの運営管理が行えるPHP製のCMS「concrete5」 第1回

concrete5の基本の操作方法

管理ページにログインする

　編集作業などを行うには、管理ページにログインする必要があります。デフォルトのテーマからは下方にログインページへのリンクが貼ってありますが、テーマによってはログインリンクが用意されていません。以下のURLからログインできます。

• ドメイン/ルート/index.php/login

　ログイン情報は以下に設定されています。

• デフォルトのID：admin
• パスワード：インストール時に任意で設定したもの

　ログインすると、通常のサイトの表示に加え、上部にツールバーが表示されます。concrete5ではここからさまざまな設定、編集を行っていきます。

ツールバー

IDを変更する

　ログインしたら早速IDを変更してみましょう。デフォルトでは管理者のIDはAdminです。

　ツールバー右端のボタンで管理画面-サイト全体の設定を変更できます。 クリック、メンバー、ユーザー検索から、IDを変更できます。変更したらツールバーの左上の矢印ボタンを押してページに戻れます。

ID変更

便利な機能

　concrete5はたくさんの設定・機能が用意されており、探すのが大変なことがあります。そんなときは「検索」を使うと簡単です。

 

機能の検索

ページを編集する

　左ツールバーの編集ボタンをクリックして編集モードに切り替えます。ぱっと見た目は変わりませんが、編集可能な箇所はマウスオーバーするとグリーンの枠に囲まれます。

ページの編集

ブロックの編集

　編集モードで編集したいブロックをクリックすると、以下のようなポップアップメニューが表示され編集可能になります。

ブロックの編集

　編集できる項目は以下のとおりです。（※）の項目は上級権限モードを有効にする必要があります。

• ブロックの編集
• クリップボードにコピー
• 削除
• デザイン＆カスタムテンプレート
• 詳細
• 権限（※）
• 期間指定ゲストアクセス（※）

権限

　上級権限モードを有効にすると、閲覧や編集などの細かい権限設定ができるようになります。権限設定を使えば、ブロックだけでなくページやエリアなどの単位でユーザーごとに設定できます。

　複数で管理するサイト運営に便利です。

 

上級権限モード

権限

期間表示できる

　期間指定ゲストアクセスを使用すれば、表示期間の設定もできるようになります。キャンペーンバナーなどの一定期間表示したいブロックの表示も簡単に設定できます。レイアウトをコロコロ変更するサイトにはオススメの機能です。

 

期間指定ゲストアクセス

デザイン＆カスタムテンプレート

　ブロックのデザインやテンプレートを変更できます。編集できる項目は以下のとおりです。

• 文字
• 背景
• 枠
• 余白など
• 影や回転
• カスタムテンプレート

　concrete5では、直接cssを書き換えることなく画面上でデザインを変更、追加できます。

デザインとカスタムテンプレート

ブロックの移動

　移動させたいブロックは、右上のマークをクリックした状態でドラッグします。エリアが配置されている箇所であれば、基本どこにでも移動できます。

ブロックの移動

ブロックの追加

　ページ内にブロックを追加してみましょう。ツールバーの左上の＋マークをクリックします。

利用できるブロックの数が充実

　5.7から、ソーシャル系のブロックも充実し、デフォルトでの利用可能なブロックの数が増えました。ブロックも種類ごとにカテゴライズ・整理され、見た目にも使いやすくなりました。

ブロックの種類

• 記事ブロック
• ページタイトル
• HTMLブロック
• お問い合わせフォーム
• オートナビ（パンくずリスト）
• ページリスト
• アンケート
• GoogleMap
• このページのシェア
• 画像
  など

ブロックの種類

　ページ内に配置できるブロックの数には制限はありません。その他ブロックを追加したい場合は、マーケットプレースからダウンロードできまます。

マーケットプレースについて

　マーケットプレースからはアドオンやテーマをお好みでダウンロードできます。管理画面からアドオンの入手で探すこともできますし、サイトから入手することも可能です（有料・無料、ライセンスは各ブロックによって異なります）。

　使いまわしたいブロックなどは、クリップボードにコピーでストックしておくと便利です。必要なくなったら削除しましょう。

クリップボードが便利

エリアの編集

　以下のアイコンをクリックするとエリアの編集できます。

エリアの編集

• エリアのデザインを変更
• レイアウトの変更
• 権限

エリアのデザインを変更

　以下の項目を編集できます。

• 文字
• 背景
• 枠
• 余白など
• 影や回転
• カスタムデザイン

レイアウトの追加

　エリアにはレイアウトを追加することができます。

　レイアウトを追加したいエリアをクリック、レイアウトを追加をクリックすると簡単にカラムを追加できます。追加したカラムごとにブロックを配置できるようになります。カラムの中にはさらにカラムを追加することもできます。HTMLやCSSを編集することなく、見たまま自由にレイアウトを変更することができます。

レイアウトの追加

　デフォルトのテーマElmentalは「Bootstrap」か「自由形式のレイアウト」か選べるようになっています。

　幅はもともと均等割りになっていますが、簡単にスライダーで幅を調整できます。なお、「自由形式のレイアウト」を選んだ場合は、設定したレイアウトによってはレスポンシブデザインに対応しきれずレイアウトが崩れてしまうことがありますので注意が必要です。

レイアウトの変更

　追加したレイアウトは、コンテナーのレイアウト編集から再編集が可能できます。

コンテナーのレイアウト変更

ページの設定

　左上、ページの設定からページの設定ができます。以下の設定が可能です。

• デザイン
• SEO
• 属性
• キャッシュ
• 権限
• バージョン
• ページ削除

デザイン

　テーマやページテンプレートなどを編集できます。

デザイン

権限

　ページの閲覧権限や編集権限の設定を行うことができます。

ページの権限の設定

バージョン管理

　編集したページを以前のバージョンと比べたり、戻したりすることができます。

バージョン管理