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

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

更新日時 2023年 6月 28日

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

Marketing Hub   Professional , Enterprise
Content Hub   Professional , Enterprise
Marketing Hub Basic(旧製品)

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 のモジュールフレームワークは を使用してモジュールフィールドを参照していました。v2 のフレームワークは を使用してモジュールフィールドを参照します。

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

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

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

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

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

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

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

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

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

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

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

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

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

span #hs_cos_wrapper_widget_5038393204 { Color: blue; }

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

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

ネストしたモジュールのエラーを識別して解決する方法について詳細を学習します多数のテンプレートでネストしたモジュールを使用している場合、最初にモジュールを複製し、ページレベルのコンテンツが失われないようにするのが最善です。次に、複製したモジュールでエラーを解決し、それ以降はその複製をテンプレートで使用します。

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

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

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

はい、モジュールエディターですべてのレガシーモジュールを編集できます。v2 のモジュールフレームワークではサポートされていないコードがある場合は認証に関する警告と提案が表示されますが、引き続き HubSpot でこれらのモジュールを編集して使用することはできます。

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

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