メインコンテンツにスキップ
お客さまへの大切なお知らせ:膨大なサポート情報を少しでも早くお客さまにお届けするため、本コンテンツの日本語版は人間の翻訳者を介さない自動翻訳で提供されております。正確な最新情報については本コンテンツの英語版をご覧ください。

デザインマネージャー|よくある質問

更新日時 2026年4月15日

以下の 製品でご利用いただけます(別途記載されている場合を除きます)。

HubSpotのデザインマネージャーツールに関する回答と全般的な情報が素早く見つかります。このリソースには、CMS を使用しているデザイナー向けのその他のリソースへのリンクも含まれています。

HubSpot でのデザインについての詳細はどこで学習できますか?

HubSpotでのデザインの詳細については、HubSpotアカデミーのグロース ドリブン デザイン認定(英語)とHubSpotのCMSドキュメントをご覧ください。 

デザイン認定は無料の認定であり、動画トレーニングやデザイン実習が含まれています。 

HubSpot の CMS ドキュメントには次のものが含まれます。

カスタムコーディングされたデザインや HubL のトラブルシューティングに使用できる HubSpot リソースはありますか?

HubSpotデザイナーコミュニティーと交流するには、HubSpotデザインフォーラムが最適です。このフォーラムは、デザインに関する専門知識を持つ HubSpot デザイナーおよび HubSpot ユーザーによってモニタリングされています。

HubSpot API開発に関するご質問は、開発者フォーラム(英語)をご覧ください。 

HubSpot に FTP アクセスするにはどうすればよいですか?

2020年5月27日より、FTPの利用は停止し、CMS CLIに置き換えられました。この発表について詳細を確認してください

1 つのテンプレートのグローバルグループを編集することはできますか?

グローバルモジュールはローカルモジュールに戻すことができますが、グローバルグループは変換できません。1つのテンプレートのグローバルグループを編集するには、グローバルグループを複製し、テンプレートに複製を追加します。

HubSpot テンプレートビルダーで使用するブートストラップのバージョンは?

HubSpotのレイアウトエディターでは Bootstrap 2.xに基づく12列グリッドシステムを採用しているため、テンプレートデザイナーは「フルレスポンシブ」な状態を素早く作成できます  ウェブページ  HubSpotのコンテンツプラットフォーム内。

HubSpot テンプレートで独自のレスポンシブグリッドを使用することはできますか?

HubSpotの全てのドラッグ&ドロップレイアウトには、モジュールをレスポンシブにするためのlayout.cssが自動的に組み込まれます。Bootstrap 3 などの別のまたはカスタムのレスポンシブグリッドを使用する場合は、layout.css 内の CSS をオーバーライドするか、layout.css が付加されていないコード化されたテンプレートを使用する必要があります。

ブログ記事とリストのレイアウトを再構成するにはどうすればよいですか?

ブログ コンテンツ モジュールでは、記事のマークアップとリストレイアウトを編集して、記事のさまざまな要素のレンダリング位置を制御することができます。 

テンプレートを以前のバージョンに戻すことはできますか?

全てのテンプレートレイアウト、コードファイル、およびページには変更履歴があり、テンプレートやコンテンツの任意のバージョンにロールバックすることができます。テンプレートまたはコードファイルの場合、変更履歴にアクセスするには、[アクション] > [変更履歴を表示] をクリックします。 

デザインマネージャー v2

モジュールフィールドを参照するときの「ウィジェット」と「モジュール」の違いは?

v1 のモジュールフレームワークは {{ widget.field }} を使用してモジュールフィールドを参照していました。v2 のフレームワークは {{ module.field }} を使用してモジュールフィールドを参照します。

ただし、v2 のフレームワークで {{ widget.field }} を使用しても、引き続き正常に機能します。「モジュール」を参照するようにカスタムモジュールを更新する必要はありません。

「get_public_template_url」を使用せずに JS ファイルと CSS ファイルを添付するにはどうすればよいですか?

JavaScriptファイルやCSSファイルにアクセスするために「get_public_template_url」を使用するのではなく、これらのファイルをモジュールのサイドバーエディターの[リンク済みファイル]セクションに直接添付できるようになりました。ここに含まれる CSS ファイルと JS ファイルは、モジュールを使用するページに自動的に読み込まれます。

カスタム HTML モジュールまたはカスタム HubL モジュールをテンプレートに追加するにはどうすればよいですか?

HTML モジュールと HubL モジュールは除去されました。これらのモジュールは、開発者にとってHTMLおよびHubLのスニペットをテンプレートに簡単に追加する手段となっていました。ただし、テンプレートの理解や編集が難しくなる場合があります。テンプレートをより予測しやすくメンテナンスしやすくするために、全てのコードをカスタムモジュールのコンテキスト内に収めることを優先して、これらのモジュールは除去されました。

ウェブサイトのページレベルでHTMLを追加する必要がある場合は、HTMLモジュールをHubSpotマーケットプレイスでダウンロードできます

JS プラグインをカスタムモジュールで使用するにはどうすればよいですか?

サードパーティーのスクリプトを使用している場合は、モジュールエディターの[リンク済みファイル]セクションにスクリプトファイルをリンクします。その後、コードエディターのJSセクションでプラグインをトリガーできます。プラグインにパラメーターを渡す必要がある場合は、エディターの[HTML+HubL]セクションでデータ属性を使用してこれらの値を保存することができます。

アップグレードするときに、このモジュールをどこで使用するのか質問されました。これらのオプションの違いは何ですか?

E メールでカスタムモジュールを使用している場合、スタイルシートおよび JavaScript はほとんどの E メールクライアントでサポートされていないため、[CSS] セクションと [JS] セクションはエディターに表示されません。E メールモジュールの場合、依然として<style>タグに必要なスタイルを含めることができます。

ページまたはブログ記事でモジュールを使用している場合、[JS] セクションと [CSS] セクションは正常に表示されます。

デザインマネージャーの v2 でモジュールをコード化する方法は変更されていますか?

デザインマネージャーの v2 のモジュールは<div>タグで囲まれていますが、古いデザインマネージャーのモジュールは<span>タグで囲まれています。この変更は、スタイルシートでモジュールのスパンを参照している場合のみモジュールに影響を及ぼします。例えば、次の宣言は、新しいデザインマネージャーには適用されません。

{% raw %}
span #hs_cos_wrapper_widget_5038393204 { Color: blue; }
{% endraw %}

<span>タグを<div>タグに置換することができます。ただし、CSSの記述にHubSpotの既定のラッパーを使用することは推奨されません。代わりに、「my-custom-module」などのカスタム CSS クラスを使用しするとよいでしょう

モジュールをアップグレードするときに「ネストしたモジュール」のエラーが発生します。このエラーを解決してモジュールを公開するにはどうすればよいですか?

ネストされたモジュールのエラーを識別して解決する方法についてもっと詳しく多数のテンプレートで使用されているネストされたモジュールについては、ページレベルのコンテンツが失われないように、最初にモジュールを複製することをお勧めします。次に、複製したモジュールでエラーを解決し、それ以降はその複製をテンプレートで使用します。

モジュールにグローバルグループを追加するにはどうすればよいですか?

カスタムモジュールで {% include %} を使用してグローバルグループを追加する代わりに、モジュールにメニューフィールドを追加したり、モジュールのグローバルコンテンツを編集したりできます。

新しいデザインマネージャーでv1カスタムモジュールを使用できますか?

はいモジュールエディターですべての旧モジュールを編集できます。v2モジュールフレームワークでサポートされていないコードについては検証の警告や修正が表示されますが、引き続きHubSpotでこれらのモジュールを編集して使用することはできます。

既存のカスタムモジュールを保持することはできますが、古いフレームワークを使用して新しいモジュールを作成することはできません。旧モジュールを複製した場合、複製したモジュールは 新しいモジュールフレームワークで作成されます。

 
 
この記事はお役に立ちましたか?
こちらのフォームではドキュメントに関するご意見をご提供ください。HubSpotがご提供しているヘルプはこちらでご確認ください。