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

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

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

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

1. 目的のコンテンツに移動します。

   • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
   • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
2. ページの名前をクリックします。 
3. コンテンツエディターで、左側のサイドバーにある add 追加アイコンをクリックします。
4. モジュールカテゴリーをクリックして展開し、モジュールをクリックしてコンテンツ内の位置にドラッグします。モジュールを検索するには、 検索 フィールドにモジュール の名前を入力します 。 
5. モジュールの幅を調整するには、列の間にある垂直方向の区切りをクリックして任意の位置にドラッグします。
6. モジュールを編集するには、コンテンツ内で対象のモジュールをクリックします。 
7. コンテンツにモジュールのコピーを追加するには、モジュールの上にマウスポインターを置き、clonduplicate c複製モジュールアイコンをクリックします。
8. コンテンツからモジュールを削除するには、モジュールの上にマウスポインターを置き、delete 削除モジュールアイコンをクリックします。 

セクションを使用する

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

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

セクションを作成する

セクションを作成するには、レイアウトを選択してから、そこにモジュールを追加します。 

1. 目的のコンテンツに移動します。

   • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
   • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
2. ページの名前をクリックします。 
3. コンテンツエディターでコンテンツの上にマウス ポインターを置き、[ +セクションを追加]をクリックします。
4. ダイアログボックスで、メニューの [空白のレイアウト ]をクリックし、 レイアウトをクリックして選択します。
5. コンテンツエディターで、左側のサイドバーにあるadd 追加アイコンをクリックします。 
6. モジュールカテゴリーをクリックして展開し、モジュールをクリックしてセクション内の位置にドラッグします。このセクションの各モジュールについて、この手順を繰り返します。 
7. セクションへのモジュールの追加が完了したら、 セクション の上にマウスポインターを置き downCarat ダウンアイコンをクリックし、[セクションを保存]を選択します。 
8. ダイアログボックスにセクションの名前と説明を入力してから、［保存］をクリックします。 

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

セクションを追加または削除する

1. 目的のコンテンツに移動します。

   • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
   • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
2. ページの名前をクリックする。
3. コンテンツエディターでコンテンツの上にマウス ポインターを置き、[ +セクションを追加]をクリックします。
4. ダイアログボックスで 、セクションをクリックします。保存済みセクションの中から選択するには、左側のメニューで [保存済みセクション ]をクリックし、保存 済みセクションをクリックします。 

注: スマートルール を含む保存済みセクションを追加すると、新しく追加されたセクションにそれらのルールが適用されます。スマートルールが適用されているセクションは、［スマート］としてラベル付けされます。

5. コンテンツからセクションを削除するには、 セクション の上にマウスポインターを置き、 delete 削除アイコンをクリックします。siteTreeIconコンテンツアイコンをクリックすることもできます。次に、セクションの上にマウスポインターを置き、 ellipsesIcon 省略記号アイコンをクリックして、[ 削除]を選択します。
6. 保存済みセクションからセクションを削除するには、 コンテンツ の上にマウスポインターを置き、[ +セクションを追加]をクリックします。次に、左側のメニューの [保存済みセクション ]をクリックし、該当する保存済みセクションカードの delete 削除アイコンをクリックします 。ダイアログボックスで［削除］をクリックします。

コンテンツのスタイルを設定する 

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

カスタムモジュールとテーマで使用できるスタイルオプションは、作成元の開発者が設定します。モジュールとテーマのスタイルオプションの詳細については、開発者ドキュメントをご覧ください。 

1. 目的のコンテンツに移動します。

   • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
   • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
   • ブログ：HubSpotアカウントにて、［コンテンツ］＞［ブログ］の順に進みます。
2. ページの名前をクリックします。 
3. コンテンツエディターで、モジュールをクリックします。
4. サイドバーエディターで、［スタイル］タブをクリックします。 
5. 要素を非表示にするには：
   • ［共有範囲］セクションをクリックして展開します。
   • ［このブレークポイントで非表示］セクションで、［非表示］をクリックします。デフォルトでは、パソコンとモバイルのビューでモジュールを非表示にします。 
   • モバイルまたはパソコンのみにモジュールを表示するには、ページ上部のmobile モバイルまたはdesktopパソコンアイコンをクリックしてください。［共有範囲］セクションをクリックして展開します。［このブレークポイントで非表示］セクションで、［表示］をクリックします。これにより、選択されたデバイスタイプでモジュールが表示されるようになりますが、それ以外では非表示になります。 

6. パディングとマージンを設定するには： 
   • ［位置合わせとスペース］セクションをクリックして展開し、［パディング］または［マージン］をクリックします。

• • 上下左右の全てのサイドに均一のスペースを追加するには、［全てのサイドに適用］チェックボックスをオンにして、［上］、［左］、［右］、または［下］フィールドのいずれかにピクセル単位で値を入力します。 
  • 上下左右のサイドごとに異なるパディングを追加するには、［上］、［左］、［右］、［下］の各フィールドにピクセル単位で値を入力します。

7. 要素の背景を設定するには、［背景］セクションをクリックして展開し、目的のオプションを選択します。 
   • なし：背景の色または画像を削除します。
   • 色：背景色として使用する単一の色を設定します。16進値を入力するか、カラーパレットをクリックして色を選択してから、透明度の値を入力します。
   • 画像：背景として画像を設定します。アップロードをクリックしてコンピューターからの画像を追加するか、画像アップロードをクリックしてファイルから画像を選択します。 
   • グラデーション：背景として2色のグラデーションを設定します。［方向］ドロップダウンメニューをクリックし、グラデーションの方向を選択します。それぞれの色について、16進値を入力するか、カラーパレットをクリックして色を選択してから、透明度の値を入力します。

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

コンテンツを管理する

サイドバーエディターでは、コンテンツのセクション、行、列、モジュールの概要を見ることができます。この概要で、要素の名前変更、編集、複製、削除を行ったり、要素を非表示にしたりすることができます。 

1. 目的のコンテンツに移動します。

   • ウェブサイトページ：HubSpotアカウントにて、［コンテンツ］＞［ウェブサイトページ］の順に進みます。
   • ランディングページ：HubSpotアカウントにて、［コンテンツ］＞［ランディングページ］の順に進みます。
2. ページの名前をクリックします。 
3. 左のサイドバーで、siteTree［コンテンツ］タブをクリックします。 
4. サイドバーエディターで表示するページ要素を管理できます。 
   • ページのセクションのみを表示するには、［全て折りたたむ］をクリックします。これにより、全ての行、列、モジュールが折りたたまれ、サイドバーエディターにページのセクションだけが表示されるようになります。 
   • ページ上の全てのコンテンツを表示するには、［全て展開］をクリックします。これにより、サイドバーエディターに全てのセクション、行、列、モジュールが表示されます。 
   • 個々のページ要素やコンテナーを表示するには、その名前の横にある+ プラス記号をクリックします。
   • 要素やコンテナーを非表示にするには、その名前の横にある- マイナス記号をクリックします。 

5. ページ要素を編集、名前変更、複製、削除、および非表示にするには: 
   • 要素を編集するには、その要素の名前をクリックします。 
   • 要素の名前を変更するには、その名前の横にあるellipses省略記号アイコンをクリックし、[[要素]の名前を変更]を選択します。 表示されるダイアログボックスに要素の名前を入力し、［保存］をクリックします。 
   • 要素を複製するには、要素名の横にある ellipses 省略 記号アイコンをクリックし、[複製]を選択します。これにより、元の要素の完全なコピーが隣に表示されます。 
   • 要素を削除するには、要素名の横にある ellipses 省略記号アイコンをクリックし、[削除]を選択します。 
   • モジュールを非表示にするには、hide非表示アイコンをクリックします。これにより、コンテンツプレビューではモジュールが非表示になりますが、サイドバーエディターでは非表示になりません。ページ上で非表示になっているモジュールを表示するには、view disp表示アイコンをクリックします。