ブログのワークフローと権限設定 – concrete5 Ver.8.1.0

子ページの権限設定
Share on Facebook
LINEで送る
Pocket

友人に、concrete5 Ver.8.1.0でのブログのワークフローがうまく動かない!と言われたので、「んなバグ知らんなー」と思い、設定してみたら見事にハマったので、備忘録代わりに書いときます。

権限設定まわりはいつまで経ってもハマるなぁ…

concrete5でのブログの権限設定

ブログでワークフローを使いたい、となると、通常下記の様な運用を実現したいという事になると思います。

  1. 編集者グループのユーザが記事を作成・編集
  2. 管理者グループの人間が記事を確認後、承認・却下のアクションを実行
  3. 記事が公開・差し戻される

この場合、記事一覧ページが親ページとなり、各記事のページがその下にぶら下がっていく構造になると思います。

各記事は編集者が編集できないといけませんが、ブログトップは管理者しか編集できない権限を設定しないといけません。

しかし、concrete5のデフォルトでは、子ページは親ページの権限を継承する事になるので、そのままだと親ページであるblogページに対して編集者による編集権限を与えないといけません。

こんな時は、子ページの権限設定を親ページからの継承ではなく、ページタイプのデフォルト権限を使用します。

そうすると、「親ページのblogページは管理者しか編集できないが、その子ページである各記事は編集者権限のユーザも編集できる」という権限設定が可能になります。

さあ、そんなconcrete5の最も素晴らしく便利で難解なページの権限設定についておさらいしましょう。
“ブログのワークフローと権限設定 – concrete5 Ver.8.1.0” の続きを読む

Share on Facebook
LINEで送る
Pocket

concrete5 Ver.5.6系向けのAMP Add-onを作ってみた。

concrete5 Ver.5.6 Accelerated Mobile Pages
Share on Facebook
LINEで送る
Pocket

最近、AMP ( Accelerated Mobile Pages ) 対応ページって増えてきましたよね。
ますますPCからモバイルへとインターネット端末になっていくなか、軽快に閲覧できるこの機能はとても良いなぁと思っています。

WordPressはいち早く対応プラグインが公開されていましたが、concrete5用のAMP対応アドオンはVer.7系や8系のはhissyが作ったのが既にあるんですが、5.6系のは無かったので、作ってみました。

結構まだまだVer.5.6系使っている人多いんですよね。

AMP ( Accelerated Mobile Pages )とは?

そもそも、AMPってなんでしょう?

AMPとは、Accelerated Mobile Pagesの略で、Googleが提唱しているHTMLの仕様です。
インターネットへの接続端末のメインがスマホなどの携帯端末に変わってきたことにより、不安定な回線速度やPCに比べ非力なCPU等でも快適にWebサイトを閲覧できる様にするものです。

具体的な仕組みとしては、通常各ホームページのサーバでホストされているWebサイトの情報を、Googleが代わりに保存(キャッシュ)しておいてそれをユーザに見せます。
ここで、Googleが保存しやすく、かつモバイル端末でも快適に見れる様に専用のHTMLの仕様がAMP HTMLです。

その他にも、Googleのサイト高速表示のノウハウが詰まったAMP JSというJavascriptのライブラリも使います。

AMP HTMLとHTML5

AMP用のHTML、 AMP HTMLと通常のHTML5とはどこが違うのでしょう?
利用できるタグに制限があったりと色々違うのですが、大きいところだと外部のリソースを参照する系のタグ(imgタグやiframeタグ)が使えなかったり、style属性が使えなかったりとかでしょうか?

詳しくはこことかここに書いてありますので興味があったら参照してください。僕はちょっと見ただけで自力での変換を諦めましたw

AMPってSEOに効くの?

今のところSEO的には直接的に表示順位に影響があるかというと微妙なところです。複合的、間接的に影響があるといったところでしょうか?
ただ、Googleはモバイル向けに高速なWebブラウジングを提供することがユーザの大きな価値になると考えており、やっておいた方がSEO的にプラスな事にかわりは無いと思います。

また、schema.orgタグを使った構造化マークアップをする事により、検索結果のカルーセルに表示されたりと、通常の検索結果よりも目立つ事になるので、そういった事からトラフィックは増えそうです。

concrete5をカスタマイズ?いいえadd-onです。

さあ、ではconcrete5のページをAMP対応してみましょう。テーマやコアファイルをカスタマイズすると、バージョンアップの時に面倒なので、イベントを使ったAdd-on(Package)として作ります。

“concrete5 Ver.5.6系向けのAMP Add-onを作ってみた。” の続きを読む

Share on Facebook
LINEで送る
Pocket

Ver.8 から使えるExpressオブジェクトとは?

Share on Facebook
LINEで送る
Pocket

この記事はconcrete5 Japan Advent Calendar 2016の4日の記事です。3日の記事はacliss19xxさんの「検索ブロックのカスタマイズ」、5日の記事はmizuno.fumitoさんの「concrete5をウェブサービスのベースとして活用する」です。
この記事と合わせて読んでみてください。

concrete5 Ver.8 が12月1日にやっとリリースされました!

新しいUI、機能が盛りだくさんのメジャーバージョンアップ、concrete5 Ver.8がやっと出ました!
たくさんの新機能の中でも僕が一番注目し、喜んでいるのが Express オブジェクト です。

Express オブジェクトをわかりやすく言うと、concrete5の中にMS AccessやKintoneの様なデータベースを作れる機能です。凄いんですコレ。

今日はそんな新機能のExpressオブジェクトの使い方をご紹介します。 “Ver.8 から使えるExpressオブジェクトとは?” の続きを読む

Share on Facebook
LINEで送る
Pocket

テーマ作成時に基盤に使える5.7用bootstrapテーマを作りました

Share on Facebook
LINEで送る
Pocket

concrete5のadvent calendar 10日目を担当します。

昨日は弊社の田原くんが「concrete5を導入するなら、発注側も制作に関わると良いかもしれない。という話。」という記事を書いてるのでクロスキューブ2日連続です。

テーマ作成時に使えるテーマを作りました。

テーマ作成を開始するとき、まず最初何をしていますか?
僕の場合ですが、elementalはすでに色々されているので、Bootstrapを落としてきて読み込ませて、まっさらなテーマを作るんですが、これが毎回面倒でした

なので、毎回作ってるものをテーマ化しました
自由にお使いください。 “テーマ作成時に基盤に使える5.7用bootstrapテーマを作りました” の続きを読む

Share on Facebook
LINEで送る
Pocket

concrete5 Ver.5.7でのコンポーザーの使い方

concrete5 5.7 コンポーザー画面
Share on Facebook
LINEで送る
Pocket

concrete5 バージョン5.7系では今までの5.6系と、コンポーザーの使い方が変わっています。

このコンポーザーの詳しい使い方がどこにも書いてなかったので、書いてみました。

concrete5のコンポーザーとは?

concrete5Webページを直接GUIでグリグリいじってページのコンテンツを制作していくタイプの直感的CMSです。
とてもわかりやすくて、専門的なWebの知識(HTMLCSS)がない人でも簡単にWebサイトを作る事ができます。

ただ、WordPressの様に投稿画面のフォームに上から順番にダーっと入力していけばページが作られるという、古来からのUIが好きな人もいますし、その方が効率が良いWebページもあります。

concrete5では、そういった投稿画面も自由に管理画面から作る事ができ、それをコンポーザーと言います。
コレ、使いこなすと非常に便利です。

Ver. 5.7で変わったコンポーザー

このコンポーザー機能ですが、5.6系でも使えるのですが、バージョン 5.7になって使い方が少し変わりました。

5.7のページタイプとページテンプレート

コンポーザーはページタイプ毎に設定するものなのですが、 Ver. 5.7では新たに「ページテンプレート」という概念が追加されました。

これは5.6までのページタイプの一部を切り離した物です。

今までページのテンプレートファイルとページタイプは1対1の関係でしたが、これによりひとつのページタイプが複数のテンプレートファイルを使える様になりました。

具体的な例で言うと、「新着情報」というページタイプが「右サイドバー」と「左サイドバー」二つのテンプレートファイルを使える、という様な事ができるようになりました。

これで5.6系でよく勘違いされていたページタイプの役割、「見た目のレイアウトを決めるもの」と、ページタイプ本来の役割である「どんな用途かを決めるもの」が分かれ、よりわかりやすくなりました。

これにより、コンポーザーの使い方、設定方法等も大きく変わっています。

まず、コンポーザーのフォームの設定から

concrete5 Ver. 5.7系でコンポーザーを設定する時は、まずページタイプの設定からフォームの設定をします。

ページタイプ管理画面

ページタイプの設定画面を開き、この「フォームを編集」ボタンをクリックします。
フォームを編集

フォームの設定画面が表示されますので、ここでコンポーザーに表示したい項目を決めていきます。
コンポーザーに表示する項目の設定

各セットのタイトルバーにカーソルをホバーすると、メニューアイコンが表示されます。(これ、ホバーしないと表示されないのってどうなん?とは思いますが)
」をクリックすると、入力項目の追加ができます。
フォームセットの編集アイコン

ブロック内蔵プロパティカスタム属性の中から好きな要素を追加できます。
試しに、ブロックImage(画像)を追加します。(ここ翻訳漏れしてるな…)
フォームアイテムの設定画面

フォームセットに追加されます。
ここもカーソルをホバーすると編集アイコンが表示されるので、エンピツのアイコンをクリックすると編集できます。
スクリーンショット 2015-04-30 6.45.44

この様に要素の設定画面が表示されるので、適当に埋めます。
カスタムラベルは表示する要素の名前、説明は簡単な要素の説明文を入れます。
とりあえず今回は「サンプル画像」としておきます。
画像ブロックの設定画面

次に、ページタイプの一覧画面に戻り、今フォーム要素の編集をしたページタイプの「出力」ボタンをクリックします。
ページタイプ設定画面:出力ボタン

このページタイプで利用できるページテンプレートの一覧が表示されるので、編集したいページテンプレートの「デフォルトを編集」ボタンをクリックします。
ページテンプレート設定画面

5.6系と同様のデフォルトブロックの編集画面が表示されるので、普通のページにブロックを足すのと同じ様に、メニューバーの「+」をクリックして、ブロックタイプ一覧の一番下の方にある「コンポーザーコントロール」というブロックを表示させたいエリアにドラッグ&ドロップして配置します。
コンポーザーブロック

 

そうすると、さっき設定したコンポーザーのコントロール要素を選択できる画面が表示されるので、ここに表示したいアイテムを選びます。
フォームアイテム設定画面

これでコンポーザーに自分が追加した要素が表示される様になります。

コンポーザーで開けないときは

コンポーザーの設定をしたのに、ページの設定メニューに「コンポーザー」が無くてコンポーザーでページを開けない時は、そのページタイプの「基本情報」で設定します。

ページタイプ基本情報

基本情報設定画面を開くと、「コンポーザーで開きますか?」という設定項目があります。ここを「はい」に設定すると、コンポーザーで開く事が出来る様になります。
コンポーザーに表示する設定

ページを追加メニューに表示させたい時は

コンポーザーで開く設定の下に、「このページタイプはよく追加されますか?」という設定項目があります。ここを「はい」に設定すると、
ページを追加メニューに表示させる設定
メニューバーの、ページ追加ボタンをクリックすると表示される画面の、「新しいページ」という項目に表示される様になります。

もっと詳しく知りたい方は

僕は月一回、下北沢のオープンソースカフェというコワーキングスペースでconcrete5の勉強会を開催しています。(詳しくはコチラ concrete5東京ユーザーグループ

ぜひこの勉強会に参加して質問して頂ければと思います。

それ以外にも僕がCTOをやっている、コンクリートファイブ ジャパン株式会社でも有償のトレーニングサービスも行っていますので、こちらをご利用ください。

もちろん、弊社株式会社クロスキューブでもconcrete5を使ったWebサイトの開発、カスタマイズなど行っていますので、そういったご相談も大歓迎ですw
ぜひお問合せください。

5.6のコンポーザーの事や、concrete5の基本が知りたい方には、既に発売されている書籍もオススメです。

Share on Facebook
LINEで送る
Pocket

オープンソースCMS「concrete5」の4つのエンタープライズ向けの有償機能

Share on Facebook
LINEで送る
Pocket

クロスキューブの山崎です。

8月11日、オープンソース汎用CMS「concrete5」がエンタープライズ向けの有償機能を新たに2つ提供開始することを発表しました。

これにより「concrete5」は以前より提供されている2つの有償機能と併せて、4つの有償機能が提供されていることになりましたが、このタイミングで改めてどんな機能でどういった時に活用できるのかを改めて振り返って見たいと思います。

静的HTML出力(HTML Exporter)

「Wordpress」や「concrete5」などの動的なCMSでは、アクセス毎に処理が行われページが生成される仕組みとなっています。そのため、更新内容の即時反映や、リアルタイムな情報の入出力が可能となっています。

しかしながら、当然毎回処理が行われるため、アクセスが増加すればその分だけPHPがDBにアクセスし、サーバへの負荷も増加するため、それに耐えうるサーバ環境の検討や構築が必要になってきます。

しかし、この機能を使うことで「concrete5」の通常通りの直感的なUIを使って作成したページを、静的なHTMLのWebサイトとして出力することが可能となります。

ページのHTMLだけではなく、サイトのディレクトリ構造も生成され出力されます。

スクリーンショット 2014-08-11 19.37.03

静的なHTMLは、言葉通りすでに生成されたHTMLファイルにアクセスをするため、PHPが処理する様な動的な処理が発生せず、サーバなどへの負荷を最小限に抑えることが可能です。また、データの入出力が基本的には行われないため、セキュリティ的にも動的なページより強固なものとなります。

もちろん動的なページには、プログラムを使うことで様々な機能が実装できますが、更新頻度の低いページやそういった機能が必要ないページで静的HTMLを使うことで負荷軽減セキュリティ強化などが行えます。

スクリーンショット 2014-08-11 19.37.07
静的HTML出力の設定画面一部

統合デジタルアセット管理(Centralized Digital Asset Management/CDAM)

画像や動画、モバイルを含むアプリケーション、ニュース記事などのデジタルコンテンツをメタデータ、カテゴリなどを使い、一元管理することが可能となります。

スクリーンショット 2014-08-11 19.38.40
メタデータ、カテゴリの設定画面

これにより、外部へ提供する画像やニュース記事などのデジタルコンテンツを一元管理や、社内のデジタル資産や製品カタログなどの一元管理などに利用することも可能となります。

iPhoneやAndroidなどのモバイルアプリや、Adobe InDesighn向けのデータの出力など、様々な形式に対応する事ができます。

昨今、バイラルメディアや、コンテンツマーケティングなどの重要性が増してきています。
また、今までの単純なSEOから、よりコンテンツ重視のSEOが必要となってきました。

そういった状況で、企業のマーケティングにこのアセット管理機能は大いに役立つと思います。

多段階ワークフロー(Multi-Step Content Workflow)

concrete5では通常でもコンテンツの編集に対する承認、または却下のステップを挟む1段階のワークフロー機能が標準搭載されているのですが、大規模な組織ではより複雑な承認フローが必要な場合があります。

この機能により、多段階の承認フローを実現することが可能となるため、社内のワークフローを他ツールを使わず、concrete5内のみで完結することができます。もちろん直感的な操作で。

スクリーンショット 2014-08-11 19.41.23
ワークフローの設定画面

今までは既存業務フローに合わせたワークフローのしくみを構築しようとすると、とても高額な開発費用がかかりましたが、この機能が提供された事により、安価に業務内容に合わせた最適なワークフローのシステムを構築する事ができる様になりました。

1ツールによる完結により、ランニングコストの削減できますし、公開までの期間を短縮することで、よりアウトプットの結果を最大化することが可能です。

多言語サイト運用支援(Internationalization)

concrete5は元々、多言語対応のニーズに対応するため、無償の他言語化アドオンが提供されていますが、この機能では更に踏み込んだ対応が可能です。

具体的に言うと、単語の翻訳内容を言語ごとに設定し、その内容をサイト全体に適用することができます。これを使うことでユーザーインターフェイスからコンテンツまで細かな部分の翻訳が可能、かつ非常にわかりやすい操作で行えます。

スクリーンショット 2014-08-11 19.42.15
各言語の編集画面

多言語対応は言語によっては翻訳が非常に専門的なものとなりやすいものですが、その専門性と作業内容をできる限り、効率的かつ簡単に行えます。

社外の翻訳業者と共同で作業する際等は、前述の多段階ワークフローと合わせると、必要な部分だけを翻訳業者に公開して作業ができます。

エンタープライズ機能全体を通した感想としては…

元々過去のバージョンではエンタープライズ向けのCMSであるため、無償の機能の中にも通常エンタープライズ向けCMSでしか、提供されていない機能もふんだんに実装されているのですが、さらにその「concrete5」をエンタープライズ向けに強化できる機能だということは間違いありません。

無償の機能とアドオン、有償の機能とカスタマイズ、こういったものを組み合わせ、なおかつコストも見据えながら、理想のサイトやシステムの制作を可能とするのが汎用CMSである「concrete5」の強みです。

そして、その選択肢のベストを選択できるのが「concrete5」によるWEBサイト制作を数多く経験してきた我々だと考えていますので、まずはぜひとも弊社まで一度ご相談ください。

Share on Facebook
LINEで送る
Pocket

concrete5の5.7βがリリース!

concrete5 Ver.5.7β
Share on Facebook
LINEで送る
Pocket

クロスキューブの山崎です。

日々のタスクに忙殺されていたこともあり前回の記事からだいぶ間が空いてしまいましたが、本日concrete5のメジャーアップデートである5.7のベータ版がリリースされたので、これはご紹介すべきと思い、書いております。

私も早速インストールを行ったのですが、まったく新しいconcrete5という感じでして、ひと通りの操作を試しているだけでも、驚くことが非常に多いアップデートだと思いました。

とりあえず動画で見てください

“concrete5の5.7βがリリース!” の続きを読む

Share on Facebook
LINEで送る
Pocket

concrete5の強みと弱みを振り返る

Wordpressロゴ
Share on Facebook
LINEで送る
Pocket

クロスキューブの山崎です。

最近、お客さんのところでconcrete5のことを話していると、前よりもconcrete5を既に知っているケース(名前だけ知ってるも含め)が増えてきて、いいことだなーと思っていたりしています。

ただ、ここ1、2年ほどで成熟してきて、これから日本国内に大きく広がってくるフェイズだと思うので、まだ知らないケースが多くて、あまり知らないお客さんにconcrete5がいったいどういうものか説明することが多いです。

コーポレートサイトなど発信ベースのサイト制作の場合には、「高機能な汎用的なCMS」という伝え方で問題ないのですが、通常スクラッチで開発するような独自性の高いサービスの制作というケースだと、大きな勘違いをされるケースが多くあります。

なので改めて強みと弱みを理解しておこうと思い、ここに残しておきます。

WordPressと比較されるケースが多い

どうしてもCMSという単語が出るとWordpressと比較したくなる気持ちになりますよね、僕もでした。まずここで明示しておくとWordpressとは全くもって別物です。触ればすぐに分かります。

“concrete5の強みと弱みを振り返る” の続きを読む

Share on Facebook
LINEで送る
Pocket

クロスキューブのコーポレートサイトをconcrete5でリニューアルしました。

クロスキューブのコーポレートサイト
Share on Facebook
LINEで送る
Pocket

先日クロスキューブのコーポレートサイトを暫定ではありますが、リニューアルしました。もちろんconcrete5使ってますw

今年に入って私含めクロスキューブに役員が2人加わったので、クロスキューブで提供できるサービスも増えました。なので以前のコーポレートサイトもconcrete5を使っていたんですが、コンテンツを早急に整理する必要があったため、ついでにデザインも一新してしまおうということでリニューアルに至りました。

配布、販売されてるThemeがやっぱり優秀

上記でも書いたとおりですが、出来る限り早くリリースする必要がありました。ということで、今回はconcrete5公式で販売しているテーマ『Super Mint』を購入して使いました。

concrete5テーマ

このテーマ、Bootstrapベースにカスタマイズして作られたものなんですが、色々とすごいです。

“クロスキューブのコーポレートサイトをconcrete5でリニューアルしました。” の続きを読む

Share on Facebook
LINEで送る
Pocket

執筆したconcrete5公式ガイドブックが地元の本屋に並んでいましたw

concrete5公式ガイドブック
Share on Facebook
LINEで送る
Pocket

concrete5日本語コミュニティの仲間と執筆した、はじめての日本語でのconcrete5の解説本、concrete5公式ガイドブックがマイナビさんより2月14日に発売になりました。

concrete5公式ガイドブック

kindle版も同時出版されており、電子書籍としても購入できます。(紙の本は重いです…)

実は出版の話はずいぶん前から出ておりましたが、それ以前にconcrete5公式サイトの整備など他にやる事が多かったために、後回し後回しになっていました。

いざ執筆!となってからもメンバーが多忙で1年以上かかってしまいました…

そういった中で無事発売日を迎え、店頭に並ぶ日が来たので、実際に並んでいるかどうか?平積みテロでもしに地元、国分寺の書店に見に行ってきました。

紀伊国屋書店国分寺店様、コンクリ本 平積みありがとうございます!!

concrete5公式ガイドブックいやー、ちゃんとありました。
それどころか平積みされてましたよ!

Amazonに並んだ時も感じるところがありましたが、郊外の地元の書店の店頭に実際に並んでいると感慨深いものがありますね。

執筆陣の皆さん、お疲れ様でした!

これからconcrete5を勉強する方へ

僕はコンクリートファイブジャパン株式会社のCTOという肩書きもあるので、主にアーキテクチャー部分など、技術的な部分を担当していますが、この本はインストールから操作方法など、初心者向けの内容からカスタマイズまで広範囲にわたって解説されております。

誌面の都合から完全網羅とまではいきませんが、かなり詳しく書かれており、入門書としては最適なものになったと思っています。

この本が無くてもconcrete5の勉強はできますが、この本があればググる手間をだいぶ省くことができるので、効率良く勉強する事ができると思います。

東京でもconcrete5勉強会やってます。

“執筆したconcrete5公式ガイドブックが地元の本屋に並んでいましたw” の続きを読む

Share on Facebook
LINEで送る
Pocket