今回は Diviの各種モジュールのうちから「アクションの呼び出し」と「ボタンモジュール」の使い方について、Divi初心者向けに図解したいと思います。
Diviの使い方10 モジュールの使い方6 アクションの呼び出しとボタン
ここでは「アクションの呼び出し」と「ボタンモジュール」に固有の設定について図解します。各モジュール設定のうち、デザイン設定の共通項については下記を参照ください |
1.ボタンモジュールを利用する
「ボタンモジュール」はクリックすることでページ遷移等を実行させたいときに使用します。ボタンを押すと何かが動くというのは一般的にイメージしやすいのでよく利用されます。
1)ボタンモジュールを追加する
ボタンモジュールを利用するには、
「新たなモジュールを追加」をクリックし、 |
「ボタン」をクリックします。 |
標準状態では「クリック」とだけ表示されたボタンが設置されます。
2)ボタンモジュールのコンテンツ設定
ボタンモジュールではコンテンツに下記を設定できます。
- テキスト
- リンク
(1) テキスト
テキストではボタンに表示する文字を設定できます。標準ではクリックと表示されます。あるいは、
「動的コンテンツを使用する」をクリックすることで、下記を設定することもできます。 |
|
(2) リンク
リンクではリンクを設定できます。
|
3)ボタンモジュールのデザイン設定
ボタンでは配置がデザイン設定の属性にあります。 |
4)ボタンモジュールの詳細>属性の設定
ボタンの関係で rel 属性を設定できます。 |
2.アクションの呼び出しモジュールを利用する
「アクションの呼び出しモジュール」はクリックすることでページ遷移等を実行させたいときに使用します。ボタンを利用するのが一般的ですが、アクションの呼び出しモジュールでは、同様の機能をより見栄え良く実装できます。
1)アクションの呼び出しモジュールを追加する
「新たなモジュールを追加」をクリックし、 |
「アクションの呼び出し」をクリックします。 |
初期設定では説明文がセットされていますので変更します。
2)アクションの呼び出しモジュールのコンテンツ設定
アクションの呼び出しモジュールではコンテンツに下記を設定できます。
- テキスト
- リンク
- 背景
(1) テキスト
テキストでは、タイトル、ボタンでそれぞれ文字列を設定できます。またボディにはテキストモジュールと同様に文字列も画像も設定できます。 |
(2) リンク
リンクではリンクを設定できます。
|
3)アクションの呼び出しモジュールの詳細>属性の設定
ボタンの関係で rel 属性を設定できます。 |
ワードプレス Divi レッスン Diviの使い方図解
写真サイトを構築する際に、役に立ちそうな設定や情報をまとめています。こちらは、ワードプレステーマ Divi に関連する記事の目次ページとしています。なるべく図を用いて簡単に説明するようにしています。参考にどうぞ。