Elegant ThemesのDiviでイメージスライダーショートコードを追加する方法

0

Elegant Themesで提供されるショートコード

Diviテーマを含むすべてのElegant Themesテーマに素敵なウェブサイトを簡単に作成するために役立つショートコードを含むさまざまな機能が提供されます。

エレガントなテーマは、独自のショートコードが内蔵して文(ポスト)を作成するときに様々な効果を簡単に追加することができます。 ちなみにElegant Themesのテーマを使用している場合、ショートコードが、基本的に内蔵されており、Elegant Themesを使用していない場合、ET Shortcodesプラグインをインストールすると、ショートコードの使用が可能です。

Elegant Themesでは、次のような機能のためのショートコードを提供しています。

  • ボタン(様々なスタイル)
  • ボックス(色、テキストを含む)
  • 画像スライダー(複数の画像を表示する場合に便利)
  • 声(使用期限/ユーザーレビューなどを上げるときに便利)
  • 価格表(Pricing Table)
  • トグル方式のコンテンツ(アコーディオン)
  • タブ方式のコンテンツ
  • 様々なスタイルのリスト
  • Dropcap、Quotes(引用)、ツールチップ
  • 著者情報ボックス(Author Info Box)
  • パスワードで保護されたコンテンツ)

ボタン、ボックス、タブ、イメージスライダー、トグルコンテンツ、作成者情報などは、記事作成し、そのアイコンをクリックして簡単に追加することができます。

Elegant Themesショートコード

たとえば、ボタンを追加するには、上の図で三番目のアイコンをクリックして、さまざまなボタンを追加することができます。

Elegant Themesのショートコードを使用して、イメージスライダーを追加する

複数の画像を表示する際に、画像のスライダーを使用すると、効果的に表示することができます。

画像スライダーは「タブ」ショートコードを利用して追加することができます。 スライダーを作成する前に、事前の画像を準備します。 画像は WordPress ダッシュボード(伝言板)の メディア>ライブラリでアップロードして画像のURLをコピーしてくれます。

書き込み画面のツールバーで 「タブの追加」 アイコン(下図を参照)をクリックするようにします。

Diviテーマでイメージスライダーショートコードを使用する

その後、タブを追加することができるポップアップが表示されます。

Diviテーマからイメージスライダーを使用する

(1) スライダータイプから 画像を選択します。

(2) タブの内容に画像のURLを貼り付けます。 画像が複数ある場合 「タブ一個追加」(3)をクリックして続行画像のURLを追加しようにします。

残りのオプション(例えば、効果)は、適切に設定します。

すべての画像を追加すると、 "OK"(4)をクリックします。 その後、画像のスライダーがショートコードを追加します。

ショートコードで追加することができる画像スライダーは文(single post)に簡単に追加して使用するのにお勧めです。 (2017_0925追加:現在Diviテーマを無効にして例示として挙げショートコードは削除されました。)

Divi Builderを使用している場合は、さまざまなモジュールを使用することができます。 たとえば、Divi Builderで自主的に提供される満杯幅スルリイより、記事スライダー、ポートフォリオモジュールなどを挿入することができ、 革命スライダー などの外部スライダーを挿入することも可能です。

Slider Revolution などの外部スライダーを使用すると、より良い効果を得ることができますが、サイトの速度を遅くすることができるので、使用時にいくつかを考慮して選択するとなると思われる。

Elegant Themesで最も多く使用されてテーマは断然Diviテーマです。 Diviテーマについては、「Elegant ThemesのDiviテーマツアー"文を参照してみてください。

※一部文にアフィリエイトのリンクを含めることができます。_コーヒーカップの値にブログ運営を スポンサーすることができます。

Ω