Elementorでアコーディオン
ブロックエディタでアコーディオン
上記の２サイトの該当ページは、アコーディオン機能を実装した事例になります。
左側は、Elementorで作成したFAQページですが、中身はアコーディオン・ウジェットで作成されています。右側のブロックエディタで作成したアコーディオンは、SWELL専用ブロックのアコーディオン・ブロックの実装例です。
アコーディオン表示で Elementor VS Gutenberg
SWELL
Elementor VS Gutenberg with Lightningテーマ
Elementor使用のLightning
脱ElementorのLightning
上記の２サイトは、何れもWPテーマ「Lightning」で作成された見本ページです。
ただ、使用しているページ編集エディタが異なります。
左側は、Elementorを実装して、全ページElementor仕様のサイトになっております。
それに対して、右側は、脱Elementor即ちElementorを一切使用しておらず、ブロックエディタ：Gutenbergを使用したページ作りをしております。サイトの中身は、ほぼ同じ内容になっています。
作成者として、どちらが作成しやすかったかと言うと、左側のElementorサイトでした。
Elementorは使い勝手面からブロックエディタより断然作成し易いのは事実ですが、今回、ブロックエディタに慣れる意味で、Elementorの作成工数の倍の時間と手間をかけてのブロックエディタへのチャレンジ結果でした。
フルワイド・ブロックで背景色付きの見出し設定とは？
フルワイド・ブロックを使用した見出し設定には、通常は背景画像を使うケースが主流ですが、画像ではなくて背景色を使う場合もあると思います。今回は、見出し設定に単なる背景色を使った事例を紹介します。
尚、背景画像を使う場合に、背景固定というオプションを良く使いますが、背景画像でなくて背景色設定の場合は、背景固定というオプションは機能しませんので要注意です。
SWELLのFAQブロックとは、所謂、「良くある質問」ページです。
Elementorの「良くある質問」
SWELLのFAQブロック問」
SWELLのFAQブロックは、Webサイトの「良くある質問と回答」ページに相当するページを編集する時に使用されるブロックになります。
上記の左側ページが、Elementorで編集した「良くある質問」ページです。
右側ページがSWELLのFAQブロックで編集した「良くある質問」ページになります。
SWELLのFAQブロックの方が多彩なデザインでバリエーション豊かな表現になっていると思います。
SWELLのステップ・ブロックとは、「〇〇の流れ」みたいなもの？
制作代行の流れ（SWELL）
制作代行の流れ（Elementor）
SWELLのステップ・ブロックとは、物の流れや操作手順などを表す表現方法の場で良く使われる機能をブロックにしたものです。上記の左側がSWELLの専用ブロック「ステップ」を実装したページです。
右側は、Elementorで作成したSWELLのステップと同等な「処理の流れ」的な表現例ですが、ElementorにはSWELLのような専用ブロック（ウジェト）はありません。
SWELLのキャプション・ボックスはElementorのアイコンボックス？
キャプション・ボックス実装例
アイコン・ボックス実装例
SWELLページの２ページ目「新しい制作代行プラン」のページでは、キャプション・ボックスというブロックを実装しています。（上記の左側ページ）
それに対して、Elementorのアイコン・ボックスは、「Elementor支援サイト」のトップページでアイコン・ボックスを多用しています。（上記の右側ページ）
即ち、SWELLのキャプション・ボックスは、Elementorのアイコン・ボックスに等しいボックスになります。
SWELLのフルワイド・ブロック VS カバー・ブロック
SWELLで作成したフルワイド・ブロックの実装例
Lighthouseで作成したカバー・ブロックの実装例
上記の2ツのサイトの共通点は、背景固定画像を所どころに配した一見するとLPページにも見える今流行りのWordPressページになっていると思います。ただ違うところは実装しているWPテーマだけです。
左側のページは、SWELLで作成した「藤心Online SWELL道場」のトップページです。
右側のページは、サイト全体をElementorで作成した「WP試作見本サイト」の中で、唯一Elementorを使用せずGutenbergで作成したページとなっているところです。
SWELLでのトップページでは、フルワイド・ブロックで背景固定画像を実装し、Gutenbergページでは、カバー・ブロックで同じような機能を実装していることになります。
SWELLを購入してSWELLサイトを作成
巷では、WordPressの世界に新しいWPテーマ「SWELL」が公開され、その機能とデザイン性の豊かさでユーザーを魅了しているみたいです。タメぐち為五郎もミーハー気分で評判のSWELLを購入してみました。
どうなることやら、これから先が思いやれるが、購入したからには、やるしかないとの思いで早速HP作りに取り掛かることにしました。