当ブログではオリジナル画像を表示するために wp-jquery-lightbox を使っています。
このプラグインは html 生成時に画像アンカータグへ rel=”lightbox[xxxx]” という一文を自動で挿入してくれるため、楽に lightbox が使える様になっているんですね。
これは便利！ と思っていたのですが、lightbox を使わずに別ウィンドウ（タブ）で表示したい時にはこの自動挿入機能が邪魔なのであります。
当サイトではレンズの評価記事の時など、等倍画像やフル解像度画像をお見せしているのですが、画面サイズを超える様な大きな画像を lightbox で表示するとまったくの NG。
画像を閉じる時は右下までスクロールして close ボタンを押さないと閉じられない事も（笑）
たとえばこの画のオリジナル画像を別窓で表示するため「ここをクリック」という target=”_blank” を挿入したリンクを貼ってみます。
クリックしても別ウィンドウ（タブ）では表示されず、lightbox が効いて同じウィンドウで表示されます。
以下が記事書き時のソースとブログ閲覧時のhtmlソースです。
1 2 3 4 5 | ソース <a href="http://limiranger.com/wp-content/uploads/2014/11/20141118-2.jpg" target="_blank">ここをクリック</a> 生成されたhtml <a href="http://limiranger.com/wp-content/uploads/2014/11/20141118-2.jpg" target="_blank" rel="lightbox[2455]">ここをクリック</a> |
この様に、画像ファイルは何が何でも lightbox が効いてしまう様になってしまうんですね。
これは便利な反面、lightboxの機能を使いたく無いときには余計なお世話でしかありません。
もしかしたら lightbox の視覚効果を OFFにするオプションの文字があるのかもしれませんが、調べるのが面倒（英語だし）なので、プラグインのソースをジロジロとチェックして改変してしまいました。その方が早い（笑）
jqlb_do_reqexp() 関数へオレンジ枠部分を挿入しました。
rel=”nolb” という文字があったら rel=”lightbox[‘.$id.’]” では無く、target=”_blank” を挿入というコードです。（rel=”nolb” は記事を書くときに記述する）
修正ではなく追加で書き、すぐにオリジナルに戻せるようにしました。
で、折角修正したのにバージョンアップで元に戻ると困ります。
現状不具合も無いので、バージョンを 9.9.9 にし、バージョンアップを拒否しました（笑）
さて、効果を見てみましょう。
ちゃんと別ウィンドウ（タブ）で表示されましたね。
ソースと生成されたhtmlは次の通り。
1 2 3 4 5 | ソース <a href="http://limiranger.com/wp-content/uploads/2014/11/20141118-4.jpg" rel="nolb">>ここをクリック</a> 生成されたhtml <a href="http://limiranger.com/wp-content/uploads/2014/11/20141118-4.jpg" target="_blank">ここをクリック</a> |
rel=”nolb” はプログラムで識別させる為の目印でしかありませんので、通常使わない文字列であれば何でも良いのです。no lightbox や lightbox-off などでも良かったのですが、rel=”xxxx” にしておくと何かと都合がいい。
こうすることで将来 lingtbox を使わなくなったとか、別のプラグインへ変えた時でも全く問題無いソースが生成される事になりますからね。
※rel=”xxxx” がソースに残っていても表示にはまったく影響が無い。
おはようございます(^^
大きな画は、これまでフォト蔵を愛用しておりましたが
ギャラリー整備に伴い、この件もちょいと気になってたんです。
せっかくのトマホークやFA31の写りを、大きな画で観て欲しいですからね♪
でもバージョンUPがｗ
不具合も自分で色々出来れば良いですが、そこまでのスキルがないので
ここは考えてしまいますね(^^
何れ、ギャラリー整備の時までに考えておきます♪
bluemさん、おはようございます。
フォト蔵の変わりはサブドメインを作成して別サイトにしてもいいんじゃないですかね。
たとえば photo.bluemworks.com を作成して lightboxは設定せず、サイドバーを表示しない固定ページを使うとか。
で、そこへリンクすると。
修正した部分をメモしておいて、バージョンアップがあればまた書き換えるって事であればバージョンアップさせてもいいと思いますよ。
こんにちは
有意義な情報ありがとうございます。
大きいサイズの画像をアップすることを考えて、設定にある、「スクリーンサイズに合わせて画像を縮小」はチェックしていました。
これを入れておけば、画面からはみ出す事がないので
（タブレットも画面サイズで表示されます）
但し、個別にオフしたいという思いがあったので朗報です。
さっそく、見直してみます。
iMovieさん、こんにちは。
出来るだけ細部まで見て欲しいので、秘密基地では「スクリーンサイズに合わせて画像を縮小」はオフにしていますね。
1200px程度なので、スクロールして貰います（笑）
ただ巨大な画だとそのスクロール自体が苦痛になるので、別窓で開く仕掛けを作ったんですよね。
VBAを勉強していて、
Accessで、すごいこと（←自分にとって）ができるようになって浮かれていたら、
今日の記事は違う言語とはいえ、さっぱりわからず、いきなり↓モードです＾＾；
こんなの独学で使いこなすって、すごいな～
やすたろ～さん、こんばんは。
プログラムはどの言語も似た様なもので、違うのは書き方とか関数名ぐらいでしょうか。
なので、VBAをマスターすれば PHPも勉強しやすくなると思いますね。
頑張ってみよ～～（笑）