部品のカスタマイズ、登録、再利用

Elementorのウジェット操作は、部品(パーツ)をドラッグ&ドロップしてページ領域に貼り付けて、ページを作成して行くのが基本の操作になります。そして諸々のパーツを組み合わせて新たなパーツを作成して、Elementorのライブラリーに登録する機能があります。
登録したパーツは、ページ編集の際に、ライブラリーから呼び出して再利用することができます。

即ち、その部品(パーツ)の操作には、以下の3種類の機能があることを頭の片隅においてページ編集に当たることが必須になります。
1.部品(パーツ)のカスタマイズ
2.部品(パーツ)の登録
3.部品(パーツ)の再利用

今回、Elementorの代表的な部品(パーツ)の見出し、テキスト文書、画像、リンクボタン等を使ったいくつかの部品(パーツ)を実際に作って、ライブラリーに登録する手順、そして登録した部品(パーツ)を呼び出してページに貼り付けてみたいと思います。

以降の記載内容について、補足説明します。2段の段組みを設定して、左側段組み上で部品(パーツ)を作成し、右側段組み上(背景色が黄色の領域)で部品作成の手順を解説しています。

Parts-1:左=テキスト、右=画像

吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

左側のカラム(段組み)に、最初のパーツを作成してみました。その内容は、
1.先ず最上段に見出しがあり、
2.その下に、2段の段組みがあり、
3.左の段組み内にテキスト文書があり、
4.右の段組み内に画像があり、
5.最下段にリンクボタンがあります。

見出し「Parts-1:左=テキスト、右=画像」を登録名として
テンプレート登録します。

Parts-2:左=画像、右=テキスト

吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

左側のカラム(段組み)に、次のパーツを作成してみました。その内容は、
1.先ず最上段に見出しがあり、
2.その下に、2段の段組みがあり、
3.左の段組み内に画像があり、
4.右の段組み内にテキスト文書があり、
5.最下段にリンクボタンがあります。

見出し「Parts-2:左=画像、右=テキスト」を登録名として
テンプレート登録します。

Parts-3:テキスト内の画像左寄せ

吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

左側のカラム(段組み)に、3番目のパーツを作成してみました。その内容は、
1.先ず最上段に見出しがあり、
2.その下にテキスト文書を挿入し、
3.そのテキスト文書の最上段最左端に、
4.画像を挿入して、画像の位置を最左端にして、
5.画像の右周りにテキスト文書を配置する。

見出し「Parts-3:テキスト内の画像左寄せ」を登録名として
テンプレート登録します。

Parts-4:テキスト内の画像右寄せ

吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

左側のカラム(段組み)に、4番目のパーツを作成してみました。その内容は、
1.先ず最上段に見出しがあり、
2.その下にテキスト文書を挿入し、
3.そのテキスト文書の最上段最左端に、
4.画像を挿入して、画像の位置を最右端にして、
5.画像の左周りにテキスト文書を配置する。

見出し「Parts-4:テキスト内の画像右寄せ」を登録名として
テンプレート登録します。

Parts-5:2段段組み内テキスト

吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

左側のカラム(段組み)に、5番目のパーツを作成してみました。その内容は、
1.先ず最上段に見出しがあり、
2.その下に2段の段組みを設定し、
3.各々の段組み内にテキスト文書を入れ
4.最終行にリンクボタンを設定。

見出し「Parts-5:2段段組み内テキスト」を登録名として
セクションの編集ボタンを右クリックして
「テンプレートとして登録」を選択する登録名として
テンプレート登録します。

Parts-6:画像ボックス

吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

左側のカラム(段組み)に、6番目のパーツを作成してみました。その内容は、

1.先ず最上段に画像を設定し、
2.その下に見出しを挿入し、
3.更にその下にテキスト文書を入れ、
4.最終行にリンクボタンを設定。

見出し「Parts-6:画像ボックス」を登録名として
テンプレート登録します。

Parts-7:アイコンボックス

吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

左側のカラム(段組み)に、7番目のパーツを作成してみました。その内容は、

1.先ず最上段にアイコンを設定し、
2.その下に見出しを挿入し、
3.更にその下にテキスト文書を入れ、
4.最終行にリンクボタンを設定。

見出し「Parts-7:アイコンボックス」を登録名として
テンプレート登録します。

Parts-8:画像カルーセル

吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

左側のカラム(段組み)に、8番目のパーツを作成してみました。その内容は、

1.先ず最上段に見出しを設定し、
2.その下にテキスト文書を挿入し、
3.更にその下に画像カルーセルを設定し、
4.最終行にリンクボタンを設定。

見出し「Parts-8:画像カルーセル」を登録名として
テンプレート登録します。

Parts-9:画像ギャラリー

吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

左側のカラム(段組み)に、9番目のパーツを作成してみました。その内容は、

1.先ず最上段に見出しを設定し、
2.その下に画像ギャラリーを設定し、
3.更にその下にテキスト文書を入れ、
4.最終行にリンクボタンを設定。

見出し「Parts-9:画像ギャラリー」を登録名として
テンプレート登録します。

Parts-10:動画ボックス

吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

左側のカラム(段組み)に、10番目のパーツを作成してみました。その内容は、

1.先ず最上段に見出しを設定し、
2.その下に動画を設定し、
3.更にその下にテキスト文書を入れ、
4.最終行にリンクボタンを設定。

見出し「Parts-10:動画ボックス」を登録名として
テンプレート登録します。

Parts-11:地図ボックス

吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

左側のカラム(段組み)に、11番目のパーツを作成してみました。その内容は、

1.先ず最上段に見出しを設定し、
2.その下にGoogleマップを設定し、
3.更にその下にテキスト文書を入れ、
4.最終行にリンクボタンを設定。

見出し「Parts-11:地図ボックス」を登録名として
テンプレート登録します。

Parts-12:アコーディオン

吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。
吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

吾輩は猫である。名前はまだない。どこで生れたか頓と見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

左側のカラム(段組み)に、12番目のパーツを作成してみました。その内容は、

1.先ず最上段に見出しを設定し、
2.その下にアコーディオンを設定し、
3.更にその下にテキスト文書を入れ、
4.最終行にリンクボタンを設定。

見出し「Parts-12:アコーディオン」を登録名として
テンプレート登録します。