Our Lab

ここは金曜サロンで話題に出たWEB技術のサンプル置き場です

Accordionプラグイン

当テーマ「Elementor」にもFAQ用アコーディオン部品があるが汎用的なプラグインを使ってみた。

他にもあるが有料前提のものが多い。このプラグインもProバージョンはあるが無料でもこの様に色を変える程度は出来る。

サイトでFAQを簡単に作るためのプラグインを使用したサンプルです。プラグイン名は「Accordion FAQ」です。使用しているのは無料バージョンになります。

Accordion FAQ

Contact Form7などの様に管理画面でFAQを新規作成してショートコードで貼り付ける感じで使います。編集画面は宣伝が目立ち目がチカチカしますが非表示にすればまぁ使えなくはないか、といった感じです。

解答欄毎にWYSIWYGボタンが有り押すとビジュアル編集が可能です。HTMLも打てます。画像もこの様に貼れました。

入れてみます

無理でした。 AIアシスタントのpopup設定を外せば、同一ページ内に複数埋め込める様ですが、あまり意味ないと思います。画面右下に居るロボットアイコン

がAIアシスタント本体です。

サイトでFAQを簡単に作るためのプラグインを使用したサンプルです。プラグイン名は「Easy Accordion」です。使用しているのは無料バージョンになります。

Easy Accordion Free Demo

これもContact Form7などの様に管理画面でFAQを新規作成してショートコードで貼り付ける感じで使います。編集画面は宣伝が無いので雰囲気は悪くありません。でもアイコンなどProバージョン限定なので表現力は少し下がります。でも編集画面がスッキリしてるのでこちらの方がオススメです♬

解答欄毎にWYSIWYGボタンが有り押すとビジュアル編集が可能です。HTMLも打てます。画像もこの様に貼れました。

入れてみます

無理でした。
AIアシスタントのpopup設定を外せば、同一ページ内に複数埋め込める様ですが、あまり意味ないと思います。
画面右下に居るロボットアイコン

がAIアシスタント本体です。

当サイトで使用のテーマ「Elementor」のGoogleMap部品はAPIが必要なので面倒い。

普通にGoogleMapから共有→埋め込みHTMLで良いのだが純正WordPress部品の「HTML」にするとiPhoneで表示されないBugがある。これはテーマ側のバグ。

なのでテーマの用意した「HTML」部品を使いそこに埋め込みiFrameタグを貼り付ければiPhoneでも表示出来ることを確認した。

流行のアシスタントAIです。中身はChat-gpt4です。当サイト用に少々カスタムしたアシスタントになっています。

このアシスタントは主に金曜サロンへの勧誘を目的としてカスタムしております。

Open AI の従量制のAPIキーが必要となります。完全無料では使用不可。

アシスタント組み込みには「AI Engine」というプラグインを使っております。簡単なのでオススメです。

画面右下に出ているロボットのアイコンが実物です。