HubSpot に JavaScript ファイルを追加する方法

デザインマネージャーでJavaScriptファイルをホスティングし、編集することができます。JavaScriptファイルを作成し、テンプレートやドメインにリンクする方法を学びます。

JavaScriptファイルの作成

• HubSpotアカウントにて、［コンテンツ］＞［デザインマネージャー］の順に進みます。
• 左サイドバーのメニューで、ファイル > 新規ファイルをクリックします。folderフォルダーアイコンをクリックしてメニューを展開する必要があるかもしれません。
• ダイアログボックスで、［今日は何を作りたいですか？］ドロップダウンメニューをクリックし、［JavaScript］を選択します。

• ［次へ］をクリックします。
• ファイル名の欄には、JavaScriptのファイル名を入力します。
• ファイルの場所を更新するには、ファイルの場所セクションで、変更をクリックし、ファイルを追加するフォルダーを選択します。

• ［作成］をクリックします。 
• JavaScriptをコードエディターに入力するか、ペーストしてください。
• ESLintを有効化している場合、出力を表示スイッチを切り替えることで、JavaScriptの警告やエラーを確認することができます。
  
  
• 右上の [変更を公開] をクリックして変更内容を公開します。

JavaScriptファイルをテンプレートに添付する

• 左側のファインダーで、更新したいテンプレートをクリックします。
• 右側のインスペクタで、編集タブをクリックします。
• [リンクされているJavaScriptファイル] セクションで、[追加] ドロップダウンメニューをクリックし、JavaScript ファイルを選択します。
• 右上の [変更を公開] をクリックして変更内容を公開します。

HubSpotのページでJavaScriptファイルをインクルードする

JavaScriptファイルは、HubSpotがホスティングするドメインの全ページに含めることも、公開URLを使用して個別のページに含めることもできます。

ファイルの公開URLにアクセスする：

• 左サイドバーのメニューで、JavaScriptファイルを選択します。
• 「アクション」 > 「公開URLをコピー」をクリックする。

• HubSpotアカウントにて、上部のナビゲーションバーに表示される設定アイコンsettingsをクリックします。
• 左サイドバーのメニューで、コンテンツ > ページに移動します。
• 「設定を編集するドメインを選択：」ドロップダウンメニューをクリックし、JavaScript ファイルを追加するドメインを選択します。接続されている全てのドメインにJavaScriptファイルを適用する場合は、「全てのドメインの既定の設定」を選択します。
  
• 「サイトフッターHTML」セクションに、公開URLを script タグの source の値として貼り付けます： 

<!-- start Main.js Do Not Remove -->
<script src='insert your file's public URL here'></script>
<!---End Main.js-->

• ［保存］をクリックします。 

または、個別のページにファイルを追加するには、次の手順を実行します。

• コンテンツを開きます。

  • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
  • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
• 編集したいページにマウスポインターを合わせ、「編集」をクリックします。
• ページエディターで、「設定」メニューをクリックし、［詳細］を選択します。
• ダイアログボックスの「「フッターHTML」」セクションで、スクリプトタグのソースの値として公開URLを貼り付けます：

<!-- start Main.js Do Not Remove -->
<script src='insert your file's public URL here'></script>
<!---End Main.js-->

• 右上で、「公開」またはUpdateをクリックする。