fbpx
Elementor内部セクションの使い方

Elementorの内部セクションの使い方

今回はElementorの内部セクションの使い方について説明してきます。

内部セクションとは、Elementorで作成したセクションにおいて、そのセクションのカラム内でさらに新しいセクションを作成することです。

これを使いこなせば、Elementorで作成するページでのデザインの幅が広がりますよ!

Elementorのことをもっと学びたい人は、どうぞElementorの使い方完全ガイドを見てください。
様々なElementorに関する情報がまとめられています。

セクションの作成

今回説明するのは、上記の通りセクションの内部に新しいセクションを作成する機能なので、画像の通りまずは必要な土台となるセクションを作成します。
(今回は左に見出しウィジェット、右に画像ウィジェットを挿入しています)

今回説明させていただく内部セクションを使用しない場合、画像の様に見出しウィジェットが挿入されているカラムをカラム内部で分割することができずに、横に新しいカラムを作成するしかありません。

このジレンマを解決してくれるのが、内部セクションになります。

内部セクション

画像の様に、内部セクションウィジェットを見出しウィジェットが挿入されているカラムに挿入します。

そうするとセクションのカラム内に新しいセクションを作成し分けることができます。

作成されたセクションは、それぞれ通常のセクションと同じ機能となるので画像の様に画像ウィジェットやテキストエディターウィジェットを挿入することができます。

内部セクションの設定

内部セクションが理解できたところで、どのような設定が出来るのか確認しましょう。
画像の様に内部セクションにマウスカーソルを持っていくと表にされる枠で囲まれている部分をクリックします。

クリックすると画像の様に、内部セクションの編集画面で設定の変更が可能です。
設定はレイアウト・スタイル・高度な設定に分かれておりそれぞれの項目ごとに設定できます。

レイアウトのコンテンツの幅

画像の様に、コンテンツの幅はボックスと全幅が選ぶことができます。

ただし、注意ポイントがありそれはあくまでも一番最初に設定されたカラム幅(今回は一番最初に作成したセクションの見出しウィジェットが挿入されているカラム幅)を内部セクションは全幅として認識するので全幅を指定してもそのカラム幅以上に大きくなることはありません。

さらに、画像の枠で囲っているコンテンツ幅をバーで変更できる部分を操作しても、カラム内部で多少小さくすることができても、カラム幅以上に大きくすることはできません。

レイアウトのそれ以外の設定

また、コンテンツ幅以外の設定であるカラムギャップ・高さ・垂直報告に並列・オーバーフロー・HTMLタグなどはすべて通常のセクションと同じ内容となります。

これらの内容についてはこちらの動画で詳しく説明していますので、どうぞご覧ください。

スタイル・高度な設定

画像の通りスタイルと高度な設定においても基本通常のセクションと同じ内容となっています。

前述の動画をあわせてご覧いただければ詳しく説明しています。

これで内部セクションの使い方の説明は以上です。

内部セクションを使いこなすとページデザインの幅が広がり、さらにElementorで作成するページが進化していきます。

しっかりと使いこなせるようにしていきましょう!

また以下はElementorの基本的な操作方法を紹介した記事の一覧です。

こんにちは、ナオミです!

このサイトを運営してるナオミです。エンジニア歴13年、海外在住歴18年です。
WordPressの情報やハッキングを防ぐ脆弱性の情報と自分の海外での生活の一部を無料のメルマガで配信しています。

目次

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

WordPressの最新情報が
毎週届く無料メールマガジン

DiviやElementorの情報だけでなく、脆弱性が見つかったプラグインやテーマのリストも毎週届きます。セキュリティの強化につながります。

管理人のナオミが書くメルマガ
海外でエンジニア歴10年以上
DiviとElementorに精通