よもやまチョモランマ

WordPressでもlightbox

ひとつの画面に、小さい画像がたくさん並んでいて、クリックすると拡大表示される。
そういうページには、やはりライトボックスですよね。

KRWもオフライン活動のページがある限り逃れられません。
WPに移行したことでコトきれていたライトボックスを復活させるに至りました。

【参考】プラグインなしでLightbox機能を導入する-wordpress

とにもかくにも 公式サイト から最新版をダウンロード。

解凍して「dist」フォルダの中にある
「css」「images」「js」フォルダをテーマ直下にアップロード。
※すでにこのフォルダがある場合は上書きしないよう注意

<head>内に呼び出しコードを記述。
※すでにjQueryを呼び出してある前提

<link href="<?php echo get_stylesheet_directory_uri(); ?>/css/lightbox.css" type="text/css" rel="stylesheet" media="all" />
<script src="<?php echo get_stylesheet_directory_uri(); ?>/js/lightbox-plus-jquery.js" type="text/javascript"></script>

あとは<a>タグに「rel=”lightbox”」をつければOK。

案外すんなり出来ました。

以前よりもデバイス解像度が大きくなっているせいか、元画像もっと大きくしなきゃダメかな~ってなったけど・・・