既存のTextモジュールやCTAモジュールと同じような形で、新たにHubDBをモジュールとしてテンプレートに追加し、指定したテーブルの情報を呼び出せるようになります。
デモは後ほど動画にてご紹介しますが、新しい管理画面も含めて先にチラッとお見せしてしまうと、こちらです!
HubDBモジュールを展開すると①のようになっており、選択したテーブルに従い②でループを回しているのがわかります。
HubDBページについては触れられなかったため、どのようになるのかは残念ながら未だ謎のままです。
現状でもHubDBからページを直接作成できますので、その機能がパワーアップする、もしくはDesign Managerからまたは一覧確認できるようになるということでしょうか。
こちらは続報に期待です。
カナダのEコマースASPであるShopifyとの標準統合が発表されました。
これにより
が可能になるとのことです。
現段階ではCOS構築においては直接関係がなさそうでもありますが、HubSpotがECにも本格着手し始めたという意味ではとても重要な発表です。
これを皮切りに、今後他のECシステムとも柔軟に連携できるようなプラットフォームやAPIが提供されるかもしれません。
今までもGoogle searchモジュールによるサイト内検索は可能でした。
しかしGoogle Site Searchの提供終了発表があったことに加え、このモジュールは
などの改善すべき点がありました。
これらも加味した上で、新たな検索システムとして「Content Search」が発表されました。
この新しい検索システムは下記の特徴を持っています。
さらに詳細な技術的な詳細情報を、掻い摘んでご紹介します。
{{ content_search() }} GET /contentsearch/v1/search
素晴らしいの一言に尽きますね!
特に最後のリアルタイム検索は、有効活用できればユーザーにとても優しいウェブサイトを構築することができそうです。
お待たせしました、大本命です!
「これはIDEである」という言葉とともに、Design Managerの大幅改善が発表されました。
はっきり言って、今までのものとはほぼ別物です。完全に生まれ変わっています。
分かりやすいものから、1つずつ見ていきましょう。
これまでは多くの手順を踏まなければならなかったファイル・フォルダの作成が、とても柔軟かつ直感的になりました。
左側に表示されているサイトツリーを右クリックすることで、必要な動作を全て行うことができます。
それだけでなく、一度作成したファイルやフォルダをドラッグ&ドロップで他の場所へ移動できるなど、この辺りの管理に関しては文句の付けようがないくらい進化したといってもいいでしょう。
HubSpotエンジニア自身も、今まで不便をかけていたことに謝罪を表明していました(笑)
テンプレート編集画面のUI、およびその操作性も大幅に改善しています。
まずは今まで
が廃止され、右側に新たに設置されたツールバー(半田による仮称)に統合されました。
何回もクリックして、ようやく目的のダイアログを表示させる必要はもうありません。 ツールバーは「Add」と「Edit」の2つに分かれており、「Add」の方はモジュールの追加を、「Edit」の方はテンプレート・モジュールを問わず編集作業を行うためのエリアになっています。
選択しているものによって、Edit内のコンテンツが変わるという形ですね。
例えばアクションメニュー内にあったHeadやFooter情報についても、Editタブ内に移動しすぐアクセス・編集可能になっていることがわかります。
タブメニューを右クリックすることで、ファイルの開閉処理も簡単に行えるようになっています。
上記ツールバーと関連して、テンプレートビルダー内のモジュールの編集操作も大幅に改善されました。
百聞は一見にしかずですが、例としてデモでは
などが行われていました。
これだけでも、かなり操作性が改善されることが期待できますね!
ライブプレビューも進化しています。これについては多く語る必要もなく、端的に言ってリアルタイムプレビュー、つまりモジュールを編集した後、プレビューページをリロードせずとも編集内容が反映されるようになりました。
これにより一方のブラウザでモジュールを編集しつつ、もう一方のブラウザで編集内容をリアルタイムで確認する、といったワークフローが可能になりますね。便利!
こちら、半田的に1番熱いアップデートです!
HubSpotをユーザーフレンドリーなCMSたらしめるための重要な要素がこのカスタムモジュールであり、この設計が上手くできるかによってCOS構築の腕前が図られるといっても過言ではありません。
が、カスタムモジュールはいろいろと制限があり、それを何とか知恵で解決しようともがいていたのが今までのCOS構築でした。
そんな涙ぐましい努力は、もう必要ありません!
今までのカスタムモジュールは5つのモジュールしか使用することができませんでした(Text, Rich Text, Image, Choice, Boolean)。
これが次回のアップデートから、合計21のモジュールが使用可能になります!うぉぉぉぉぉ! またそれに伴い、モジュールにグループの概念が追加されました。
恐らくこれはカスタムモジュールだけではなく、COS全体に及ぶものと予想されます(編集画面におけるユーザビリティの改善であり、サイト構築に対する影響は恐らくありません)。
以下が、新しいモジュールグループと計21のモジュールです!
ときに1つのカスタムモジュール内で、論理的にグループを持ったり繰り返しが発生することはよくありました。
そういった際に弊社では
というように命名規則によって疑似的にグループを作成していました。
ときにはこれが20近くに及ぶこともありました。
全てはユーザビリティ向上のため。涙ぐましい…… これが解決するのです。素晴らしい以外に何が言えるでしょうか。
端的にまとめると、以下2点が大きな改善点です。
少し長いですがこれについてはデモを2つ用意しましたので、実際の挙動をじっくりとご確認ください!
フィールドグループの作成、forループのデモ前述のグループ化の動画で気づかれた方もいらっしゃるかと思いますが、カスタムモジュールはそれ1つがCSS・JSを含む完全に独立したコンポーネントとなることを目指しているようです。
これについては、完全に追従しようとすると開発のワークフローも少なからず変えなければなりません。
またJSについては既存の1ファイル内で行われる即時実行無名関数の定義から外れることにより、グローバル変数が増えるのではないかという気もしています。
これについては実際に触っていろいろと検証してみないと分かりませんが、少なくともHubSpotとしての方向性はコンポーネント化のようです。
現在これについて分かっていることを改めてまとめると、以下の通りです。
アセットファイルをきちんとリンク管理できる(つまりハードコードする必要がなくなるため、アセットファイルを移動してもリンクが切れることはない)という点は、素直に喜んで良さそうですね!
これとても重要です。この改善によってテンプレートに合わせてカスタムモジュールのデフォルト値を設定できるので、よりユーザーフレンドリーなページ編集画面を提供できるようになります。
エンジニア向けの機能だけでなく、マーケター向けのここにきちんと着目しているHubSpotには感服ですね。「使いやすいCMS」がどれだけ顧客にとって重要か、本当によくわかっていらっしゃる……。
スライドでは「デフォルトモジュールの拡張」とされていましたが、恐らく拡張というよりは「デフォルトモジュールを基に、カスタムモジュールとしてインスタンス化(といっても実質はクローンと思われる)する」というイメージの方がしっくりくるかな思います。
これによって、デフォルトモジュールのコードを引き継いだ状態でHTMLとHubLの編集が可能になります。
例えば「Image sliderモジュールの一部だけ修正したい」といった際にカスタムモジュールとしてインスタンスを作成することによって、Image Sliderモジュールのデフォルトコードが入った状態でカスタムモジュールが作成されるということです(下記のデモがまさにその例です)。
実際に触ってみないと分かりませんが、全体としてマーケター(ブログ執筆者の意)・エンジニア双方にとってプラスになる変更が多いですね!
純粋なシステムベンダーではなく、MAやCRMを主軸としているHubSpotらしいなと思います。
ただできることが増えたということは当然、今までとは開発手法を少なからず変えなければならないでしょう。
特にカスタムモジュールのコンポーネント化については、CSSやJSファイル構成の変更やそれに伴うワークフローの変更を余儀なくされる可能性もあります。
これについては、しばらく試行錯誤してベストプラクティスを見出す必要がありそうですね。
2018年1Q(第一四半期)から使えるようになるとのことです!
具体的に何月とは明言されていませんので、続報を楽しみに待ちましょう!
株式会社パンセにはCOS構築の高度なナレッジを持ったエンジニアが複数在籍しております。
COS構築のご相談や、ベストプラクティスを見出すために議論したいなどございましたら、お気軽にお問い合わせください!