【Inner Section】Elementorのインナーセクション・ウィジェットの使い方を2つの事例と合わせてご紹介!

今回はElementorの「Inner Section」というウィジェットの使い方について説明していきます!

  • 画像の隣に文章入れたいな〜
  • なんか画像を二つ連続で入れられないのかな?

そんな悩みを解決してくれるのが、インナーセクション・ウィジェットです。

使う場面がかなり多いので、使い方が知らない方はぜひご覧ください!

目次

Inner Sectionの使い方

基本的な操作は、セクションのなかにさらにセクションが欲しいとき、「Inner Section」のウィジェットをドラッグして、ドロップするだけです。

そうするとデフォルトで、2つのカラムが生成されます。

コーディングできる方だとよりどのような場面で必要かがイメージ湧くかと思いますが、初心者の方でも覚えといた方がいいウィジェットです。

また左上の本のような形をした黒いアイコンを押すことで、カラムを複製することができます。

下記に公式が出している動画があり、イメージがつきやすいのでご覧ください。

また公式での解説ベージもこちらよりご確認できます。

どんな時に使える?

では実際の例をそれぞれ見ていきましょう。

要素をバラバラに配置したい時

画像の横に要素を入れて、さらにそれを上の要素とは別の配置にしたいなど、上級者になればなるほどよりカスタム性を求めていくと思います。

そんな時には必ず使うのが、インナーウィジェットです。

複数の要素を横並びにしたい時

他には、複数の形の要素を横並びにしたい時に使います。

上記の画像のように、左にはタイトルと説明文があり、またそれに付随した内容が右側にあるといった形です。

ただ注意が必要!

ただ使用する際に注意が必要です。

それはインナーセクションの中にさらにインナーセクションが作れないこと、また、セクションをたくさん設けすぎると重くなるということです。

両方ともアップデートで解決されるかもしれませんが、現在の状況ではまだ解決していません。

デザイン性を拡張させよう!

説明は以上となります。

このインナーセクション・ウィジェットは使う場面が多く、デザイン性の高いサイトを作る際にはほぼ必須といったものです。

ぜひ使って慣れていってください。

他にもElementorでどんなことができるの?っていう方は下記記事をご覧ください。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

hakaseのアバター hakase Elementor博士

Elementor Hacksを運営。 Elementorについてとにかくわかりやすく解説。

目次