画像のポップアップでのWordPressとの違い

本日は、筆者も意外でしたが、ポップアップ画像の表示例で、HAIKよりWordPressの方が簡単だったことを紹介します。ELEMENTORを使った事例ですが、ELEMENTORを使わない場合でも、WordPressの標準として「メディアファイル」機能を使う分には同じ仕様でWordPressの方が易しいと感じた事例です。


先ずはHAIKでのポップアップ画像の例

画像の説明



左の画像は、実際の画像の50%に縮小されて表示されています。クリックして画像がオリジナルのファイルサイズに拡大します。

[check]上記のおまじないです。

&show(a0777_000030.jpg,colorbox,50%,画像の説明);


これがWordPress(それもELEMENTOR)だったら?

画像の説明



ELEMENTORの画像貼り付けウジェットで一旦画面上に画像を貼り付けた後、「リンク先:なし」のデフォルト設定を「リンク先:メディアファイル」に設定を替えるだけで、ポップアップ画像が設定されます。

要するに、HAIKの場合のような生成されたプラグインのオプションに「colorbox,50%」のようなマニュアックな設定とは、根本的に違った設定となります。


その結果、HAIKと同じ動きのポップアップ画像が実装

下記の画像の左側のサムネイルをクリックして、右側のポップアップ画像が表示されるのですが、当ページは、WordPressではなくHAIKページなので、実際の動きの確認は、コチラのページで確認できます。
20180525_Link先_メディアファイル2


同じ画像に外部のリンクを貼る場合

画像の説明



前記のリンク先のメディアファイルをカスタムURLに変更して、その下にリンク先URLを設定すれば、ポップアップ画像表示の替わりに外部リンク先にリンクします。


即ち、HAIKのようなプラグインのオプションを直接変更するような操作ではなく、WordPressでは画像編集画面でリンク先をポップアップ画像にしたり、外部URLにしたりすることが、簡単に設定できると言うことです。


ちなみに、今回、画像をクリックして表示される外部リンク先は「藤心パソコン倶楽部」のサイトです。コチラのページで、その動作が確認できると思います。


今年度のWordPress塾は、正に ELEMENTOR塾?

「もっと手軽に、もっと易しく」を前提に、プラグイン「ELEMENTOR」によるページ編集に特化した「個人レッスン付きWordPress塾」がお薦めする講座となります。