コンテンツエディターでコンテンツを編集する

コンテンツエディターでは、ドラッグ＆ドロップツールを使って、ブログ記事やページのコンテンツを追加、編集、並べ替えすることができます。一部の投稿やページでは、ドラッグ＆ドロップツールが使用できません。 

モジュールを追加および編集する

モジュールは、ウェブサイトコンテンツの個々のブロックです。リッチ テキスト モジュールなど、モジュールによっては複数のタイプのコンテンツを含めることができます。

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

  • ウェブサイトページ：HubSpotアカウントにて、［マーケティング］＞［ウェブサイト］＞［ウェブサイトページ］の順に進みます。
  • ランディングページ：HubSpotアカウントにて、［マーケティング］＞［ランディングページ］の順に進みます。
• コンテンツの上にカーソルを重ねて［編集］をクリックします。
• 左サイドバーで、add Addのアイコンをクリックします。 
• 列目で、モジュールカテゴリをクリックする：
  • テーマ : テーマ . 
  • 共通：すべてのHubSpotアカウントで利用可能な一般的に使用されているモジュール。共通モジュールの詳細 . 
  • All : 利用可能なすべてのモジュール。 
• 3列目で、モジュールをクリックし、コンテンツの位置にドラッグします。. 

• モジュールの幅を調整するには、列の間にある垂直方向の区切りをクリックして任意の位置にドラッグします。
• モジュールを編集するには、コンテンツ内のモジュールをクリックします。 
• モジュールの複製をコンテンツに追加するには、モジュールにカーソルを合わせ、clonduplicate c cloneアイコンをクリックします。
• コンテンツからモジュールを削除するには、モジュールにカーソルを合わせ、delete d deleteアイコンをクリックします。 

使用セクション

セクションとは、異なるモジュールで構成される大きなグループである。空白のセクションレイアウトにモジュールをドラッグすることで、再利用可能なページセクションを作成できます。開発者は、開発者向けドキュメントを使用して、再利用可能なセクションを作成することもできます。一度作成されたセクションは、同じテーマを使用し、ドラッグ＆ドロップ編集をサポートするすべてのページで使用することができます。

注意：一度に保存できる再利用可能なセクションは50個までです。新しい再利用可能なセクションを保存するには、既存の再利用可能なセクションを削除します。 

セクションの作成

レイアウトを選択し、モジュールを追加することでセクションを作成できます。 

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

  • ウェブサイトページ：HubSpotアカウントにて、［マーケティング］＞［ウェブサイト］＞［ウェブサイトページ］の順に進みます。
  • ランディングページ：HubSpotアカウントにて、［マーケティング］＞［ランディングページ］の順に進みます。
• ページの上にカーソルを重ねて［編集］をクリックします。
• コンテンツエディターで、左サイドバーのadd追加のアイコンをクリックします。
• 最初の列で、Layoutsをクリックする。
• レイアウトをクリックし、ページの所定の位置にドラッグします。 

• 左サイドバーで、add Addのアイコンをクリックします。 
• 最初の列で、Modulesをクリックする。 
• 列目で、モジュールカテゴリをクリックする。 
• 列目で、モジュールをクリックし、ページ上の所定の位置にドラッグする。セクションの各モジュールでこれを繰り返す。 
• セクションにカーソルを合わせ、downCaratダウンアイコンをクリックし、セクションを保存を選択します。 

注:既存のページセクションや、レイアウトなしで作成されたセクションも、再利用可能なセクションとして保存できます。

• ダイアログボックスで、セクションの名前と説明を入力し、保存をクリックします。 

セクションの追加と削除

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

  • ウェブサイトページ：HubSpotアカウントにて、［マーケティング］＞［ウェブサイト］＞［ウェブサイトページ］の順に進みます。
  • ランディングページ：HubSpotアカウントにて、［マーケティング］＞［ランディングページ］の順に進みます。
• ページの上にカーソルを重ねて［編集］をクリックします。
• コンテンツエディターで、左サイドバーのadd追加のアイコンをクリックします。
• 最初の列で、Sectionsをクリックする。 
• 番目の列で、セクションタイプをクリックする： 
  • 保存された : コンテンツエディターで作成されたセクションは、別のページで使用するために保存されます。 
  • Theme : あなたのページに使用されているテーマの開発者によって作成されたセクション。 
• 番目の列で、セクションをクリックし、ページ上の所定の位置にドラッグします。 

注:スマートルールを含む保存されたセクションを追加すると、それらのルールが新しく追加されたセクションに適用されます。これらのセクションはスマートと表示される。

• 保存セクションからセクションを削除するには、そのセクションにカーソルを合わせ、delete削除アイコンをクリックします。ダイアログボックスで［削除］をクリックします。 

スタイル・コンテンツ 

コンテンツエディターでは、サイドバーエディターのスタイルタブで、パディングやマージンなどのスタイルオプションを編集できます。モジュールやセクション、コンテンツの行や列のスタイルを編集できます。

カスタムモジュールとテーマで利用可能なスタイルオプションは、作成する開発者によって設定されます。モジュールとテーマのスタイルオプションの詳細については、開発者向けドキュメントをご覧ください。 

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

  • ウェブサイトページ：HubSpotアカウントにて、［マーケティング］＞［ウェブサイト］＞［ウェブサイトページ］の順に進みます。
  • ランディングページ：HubSpotアカウントにて、［マーケティング］＞［ランディングページ］の順に進みます。
  • ブログ：HubSpotアカウントにて、［マーケティング］＞［ウェブサイト］＞［ブログ］の順に進みます。
• コンテンツの上にカーソルを重ねて［編集］をクリックします。 
• コンテンツエディターで、モジュール、または要素のsectionセクション、row行、またはcolumn列アイコンをクリックします。

• サイドバーエディターで、スタイルタブをクリックします。 
• 要素を隠す：
  • Visibilityセクションを展開するにはクリックしてください。
  • Hide on this breakpointセクションで、Hideをクリックします。デフォルトでは、デスクトップとモバイルのビューでモジュールを非表示にします。 
  • モバイルまたはデスクトップのみにモジュールを表示するには、ページ上部のmobile モバイルまたはdesktopデスクトップアイコンをクリックしてください。Visibilityセクションを展開するにはクリックしてください。Hide on this breakpointセクションで、Showをクリックします。これは、選択されたデバイスタイプにモジュールを表示し、それ以外は非表示にします。 

• パディングとマージンを設定する： 
  • Alignment and spacingセクションをクリックして展開し、PaddingまたはMarginをクリックします。

• • すべての辺に均一な間隔を追加するには、すべての辺に適用チェックボックスを選択し、値を任意のフィールドにピクセル単位で入力します。 
  • 各辺に異なるパディングを追加するには、Top、Left、Right、およびBottomの各フィールドに、の値をピクセル単位で入力します。

• 要素の背景を設定するには、背景セクションをクリックして展開し、オプションを選択します： 
  • None:背景色や画像を削除する。
  • Color:背景に単一色を設定。16 進値,を入力するか、color pickerをクリックしてカラーを選択し、それから透明度値を入力します。
  • 画像：背景として画像を設定します。アップロードをクリックしてコンピュータから画像を追加するか、画像を参照をクリックしてファイルから画像を選択します。 
  • グラデーション：背景として2色のグラデーションを設定します。方向ドロップダウンメニューをクリックし、グラデーション方向を選択します。各色について、16 進値,を入力するか、color pickerをクリックしてカラーを選択し、それから透明度値を入力します。

注意:スタイルタブに表示される正確なオプションは、特にカスタムモジュールでは異なる場合があります。カスタムモジュールのスタイルオプションについては、開発者向けドキュメントをご覧ください。