HubSpotのContentHub無料版の設定方法と使い心地

HubSpot Content Hubの無料版を活用して、ウェブサイトの構築から公開までの流れを解説します。Content Hubは非常に気軽に使えます。ある程度のルールを決めてしまえば、初心者の方でも整ったページを作成できると思います。

Content Hubでのサイト構築の流れ

HubSpotアカウントの作成と初期設定

HubSpotのアカウントを作成する前に、ドメインを取得しておきます。

HubSpot社のサイトの右上の［無料で試してみる］ボタンを押下し、画面に従ってアカウントを作成します。

ドメインの設定

ログイン後の右上の［設定］をクリック。

左に表示される設定メニューをスクロースして下のほうにある「コンテンツ」→「ドメインとURL」から、［］を押下し、画面に従ってドメインの設定を行います。

基本設定

ドメイン設定が完了したら、サイト全体に関わる基本的な設定を確認し、適切にカスタマイズしていきます。ここでの設定をしっかり行うことで、サイト運営がスムーズになり、後から発生する問題も防げます。

アカウントの規定値

設定＞アカウント管理＞アカウントの規定値に移動し、基本情報を設定します。

全般

タイムゾーンの設定と、必要に応じて会社情報を記入します。

ブランディング

ロゴ・ファビコン、色（基本色、第2色、アクセントカラー3種、追加の色（たくさん設定できそう）、テーマ（WEBサイトのデザインテンプレート）を設定できます。

ユーザーの規定

言語、日付形式を設定します。ターゲットユーザーに馴染みのある表示形式（例：YYYY/MM/DD）を選ぶと、視覚的にわかりやすくなります。

通貨の設定

サイトで商用の活動がある場合、利用する通貨も設定します（例：円）。特にEコマース機能や、HubSpotのコンバージョントラッキングで収益を計測する場合に役立ちます。

トラッキングの設定

自分のアクセスを除外する

トラッキングコード＞レポートアナリティクストラッキングの高度なトラッキングで、自分のIPアドレスを除外します。

IPアドレスが表示されるので、それをコピーしてテキストエリアに入力し、保存します。

コンテンツの設定

設定＞ツール＞コンテンツ　で設定します。

テーマの設定

• カラー（Primary、Secondary、Body background color、Accent1、Accent2）
• Fonts（Primary、Secondary）
• Spacing（Maxmum content width、Vertical spacing）

More settingで、HxやButtonなど、詳細の設定できます。

ブログの設定

「全般」タブで、ブログ名、ブログヘッダー、ページタイトル、メタディスクリプション、ブログスラッグを設定します。

「日付形式」タブで日付の形式を設定します。カスタマイズも可能です。

「Google AMP」タブで、ロゴ画像やaltテキストなどを設定します。

ページの設定

「連携」タブに移動し、Google Analytics4の測定ID、GoogleタグマネージャーIDを設定します。

Content Hub無料版の機能

HubSpot Content Hubの無料版では、簡単にウェブページやブログの作成が可能で、SEO推奨機能や基本的な分析ツールが搭載されています。また、WordPressからのコンテンツ移行もサポートしており、初心者でもスムーズに利用できます。CRMとの連携による顧客データの管理や、基本的なカスタマイズ機能も充実していますが、ランディングページや多言語対応などには制限があります。

【関連記事】HubSpotのContentHub（無料版）の特徴
少しの専門知識でサイトが構築できます。CRMとも連携しているのでパーソナライズの精度もUP。

Content Hub無料版でWEBサイトを公開する手順

1. ウェブサイトページを作成する

まずは、トップページやサービス紹介ページ、会社概要ページなど、サイトのメインページを作成します。

コンテンツ＞ウェブサイトページで、［作成］ボタンを押下し、画面に従って作成します。編集画面では、テキストや画像、ボタンなど、モジュールが豊富に準備されており、ドラッグ＆ドロップでモジュールを配置し、内容を入力することでページを完成できます。

無料版でも基本的なSEO設定が可能なので、各ページにメタディスクリプションやキーワードを設定して検索エンジン対策も行います。

2. ブログを作成する

ブログ機能もあります。ブログは、ブログの一覧ページ（ブログ リスト ページ）のテンプレートやタグ、執筆者などの設定が可能です。

コンテンツ＞ブログで、［作成］ボタンを押下し、画面に従って作成します。

記事ごとにタグを設定して、訪問者がコンテンツを見つけやすく整理します。最近のSEO対策として、執筆者情報を明示することはとても有効です。

3. ランディングページを作成する

広告を展開する際には、広告からのリンク先となるランディングページも作成します。

コンテンツ＞ランディングページで、［作成］ボタンを押下し、画面に従って作成します。特定のサービスやプロモーションに集中したページをデザインとなるため、ランディングページ専用のヘッダーとフッターを設定することができます。

【関連記事】ContentHubで簡単にサイト構築！ページ作成の基本ガイド
HubSpotアカウントの作成からテンプレートの設定までを解説しています。

Content Hubの使い心地

Content Hubを5年間使ってきて、慣れもあってか非常に使いやすいと感じています。特にドラッグ＆ドロップで簡単にページが作成できる点は便利です。ただし、PaddingやMargineなど、整列の設定には注意が必要で、ルールを決めてよく使うレイアウトをセクションとして保存しておかないと、見栄えが悪くなりがちです。

また、設定項目の確認で複数ページを開くのは少し面倒に感じています。それでも、HTMLやCSSの基礎知識があれば、既存モジュールやテーマのカスタマイズが可能なので、自分好みのデザインに手を加えられる点は魅力的です。初心者から上級者まで柔軟に対応できるプラットフォームとしておすすめです。

最近感じている修正希望点としては、「詳細設定」の位置が、非常に邪魔なので、改修してほしいと切に願っています。