今回は Diviの各種モジュールのうちから「トグル」と「アコーディオン」のモジュールの使い方について、Divi初心者向けに図解したいと思います。
Diviモジュールの設定方法８ トグルとアコーディオン
ここではトグルモジュールとアコーディオンモジュールに固有の設定について図解します。各モジュール設定のうち、デザイン設定の共通項については下記を参照ください |  |
１．トグルモジュールを利用する
「トグル」はサイト上に訪問者が自由に開いたり閉じたりできる文書や画像のは配置場所を設置できます。
１）トグルモジュールを追加する
トグルモジュールを追加するには、
 | 「新たなモジュールを追加」をクリックし、 |
 | 「トグル」をクリックします。 |
設置したモジュールは下記のようにクリックすることで開いたり閉じたりできます。
あなたのタイトルはここに入ります
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
２）トグルモジュールのコンテンツ設定
トグルモジュールではコンテンツに下記を設定できます。
 |
|
(1) 状態
 |
|
３）トグルモジュールのデザイン設定
トグルモジュールには下記のデザインが設定できます。
 |
|
(1) アイコン
 |
|
(2) トグル
 |
|
４）トグルモジュールの詳細設定
トグルモジュールの詳細設定では下記を設定できます。
 |
|
２．アコーディオンモジュールを利用する
「アコーディオン」はサイト上に訪問者が自由に開いたり閉じたりできる文書や画像の配置場所を設置できます。トグルとの違いは、アコーディオンでは同じ場所に複数設定することが可能で、それぞれのコンテンツが伸びたり縮んだりするアコーディオン状に配置されます。
１）アコーディオンモジュールを追加する
アコーディオンモジュールを追加するには、
| 「新たなモジュールを追加」をクリックし、 |
 | 「アコーディオン」をクリックします。 |
設置したアコーディオンモジュールは下記のように配置され、クリックすることで開いたり閉じたりします。
あなたのタイトルはここに入ります
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
あなたのタイトルはここに入ります
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.
２）アコーディオンモジュールのコンテンツ設定
アコーディオンモジュールのコンテンツの設定では下記を設定できます。
 |
|
３）アコーディオンモジュールのデザイン設定
アコーディオンモジュールのデザイン設定では下記を設定できます。
|
|
４）アコーディオンモジュールの詳細設定
アコーディオンモジュールの詳細設定では下記を設定できます。
|
|
ワードプレス Divi レッスン Diviの使い方図解
写真サイトを構築する際に、役に立ちそうな設定や情報をまとめています。こちらは、ワードプレステーマ Divi に関連する記事の目次ページとしています。なるべく図を用いて簡単に説明するようにしています。参考にどうぞ。
0コメント