HubSpot CMSでのページの作成から公開まで

「ウェブサイトページ」からテンプレートを選択してページを新規作成する

まずは、ベースとなるページを新規で作成してみましょう。
右上の「ウェブサイトページを作成する」をクリックすると、テンプレートの選択する画面に移ります。その中から使用するテンプレートを一覧から選択します。今回は、弊社内で作成したオリジナルのテンプレートを使っていきます。

テンプレート選択後にページ名を入力するテキストボックスが表示されるので、適切な名前を入力します（ページ名は後から自由に変更可能です）。

これでベースとなるページを作成できました。非常に簡単ですね！

モジュールを編集してコンテンツを追加する

ページを作成できましたので、次にコンテンツを追加するためにモジュールを編集していきます。ちなみにモジュールは、Webページを形成する一つ一つの部品を指します。
左サイドナビに「プレビュー」、「最適化」、「モジュールを編集」、「モジュールを追加」とありますが、今回は下から二番目の「モジュールを編集」を使って進めます。

テンプレート内で作成したモジュールは、テキストや画像、表示/非表示などを自由に変更できます（ただしテンプレートの構築が必要です）。試しにテキストを変更してみます。
モジュールからテキストを変更し、「保存してモジュールリストに移動」ボタンをクリックします。
モジュールから編集したテキストは、画面右のプレビューにすぐさま反映されます。

目に見えて反映が確認でき、視認性の高さもHubSpotの良いところですね。

「設定」からメタ情報や読み込むCSSを設定する

ページの編集ができましたので、次にページメタ情報（タイトルやディスクリプション）やURLの設定を行います。
画面上段タブの真ん中に「設定」があるので、そこをクリックします。

設定画面からは、ページタイトルやURL、メタディスクリプションなどを決めることができます。また、このページだけに読み込みたいCSS・JavaScrptの追加や、テンプレートの変更など細かな指定も可能です。一画面でまとめて設定できるので、ブラウザが散らかる心配もありません。

公開する

いよいよ最後に公開作業を行っていきます。といっても公開は画面右上の「公開」ボタンをクリックするだけで公開が完了します（これはWordPressでも同じですね）。

公開ボタンを押すと、「ウェブサイトページの公開の準備はできていますか？」とポップアップが現れるので、「今すぐページを公開」をクリックします。

ページの作成から公開までシンプルな作りになっている、かつコーディングの知識も基本的に不要なので、エンジニア以外の方が操作しても比較的安心です。所感としてはWordPressよりも操作が分かりやすい印象です。
もし公開されているページを更新する場合は、右上のボタンが公開から更新に変わっているので、同様に更新をクリックすると該当ページに反映されます。

誤った公開を防ぐための機能も完備（コンテンツステージング機能）

ボタン1つでWebページが公開されるため、「誤って公開してしまったらどうしよ・・」と心配するユーザも多いと思います。
これはHubSpotのコンテンツステージング機能を使って、誤公開を防ぐことができます。これはHubSpotで使えるテスト用のドメインを使って本番と全く同じような画面で操作できます。
もちろんテスト環境にもパスワードを掛けることができるので、URLにアクセスされてもパスワードを知られない限り閲覧される心配はありません。

これについては、次のページで解説しています。

公開後のパフォーマンスチェック（効果測定）機能も充実

Webページは公開して終わりではありません。その後にユーザがどれくらい閲覧していたか調査・分析の必要があります（サイトを運用する上で今後の成長を左右する重要なプロセスです）。
HubSpotは、公開後の解析に関した機能も充実しています。都度GoogleAnalyticsを開いて、という手間はなく、ページ編集と同じ管理画面から解析情報を確認できます。（数値はモザイクをかけています）

その他にもお問い合わせに対するチャット機能や、レポートの作成などもHubSpot管理画面から行えるので、多様な使い方ができますね。

まとめ

いかがだったでしょうか？このようにHubSpotは簡単にかつ速やかにページ作成を実現できます。ページの作成においてはコーディングの知識も不要なので、エンジニアでない方にとっても扱いやすく効率的なツールとなっています。また、公開後の効果測定もHubSpot内で完結できるのは、他のCMSにはない大きな強みですね！