OpenPEN設置環境
・OpenPNEのバージョン
[OpenPNE3.8.20]
・Pluginバージョン
[opDiaryPlugin 1.5.1]
・運用環境
[kagoyaレンタル専用サーバー]
Apacheバージョン Apache/2.4.20
MySQLバージョン 5.6.22 (Ver 14.14 Distrib 5.6.22)
PHP 5.6.23
・OpenPNE設置場所
WEBサイト閲覧用ルートディレクトリー(public_html)にサブディレクトリー
(openpne)のフィルダーを作成展開
////////////////////////////////////////////////////////////////////////////////
・日記・日記コメントの画像表示にLightboxを使用するためのカスタマイズ
[参考サイト]
http://itkan-kei.blogspot.jp/2016/02/openpne.html
————————————————————————————————————————–
■【日記本文の写真をlightboxで表示】
[修正ディレクトリー]
/public_html/openpne/plugins/opDiaryPlugin/apps/pc_frontend/modules/diary/templates
[修正ファイル]
showSuccess.php
[修正箇所]下記 －：削除 +：追加
オリジナル（変更前）
<?php use_helper('opDiary', 'Text') ?>
-
<?php decorate_with('layoutB') ?>
<?php slot('op_sidemenu', get_component('diary', 'sidemenu', array('member' => $member, 'year' =>
カスタマイズ（変更後）
<?php use_helper('opDiary', 'Text') ?>
+ <?php use_javascript('/opDiaryPlugin/js/lightbox.js', 'last') ?>
+ <?php use_stylesheet('/opDiaryPlugin/css/lightbox.css', 'last') ?>
<?php decorate_with('layoutB') ?>
<?php slot('op_sidemenu', get_component('diary', 'sidemenu', array('member' => $member, 'year' =>
オリジナル（変更前）
<ul class="photo">
<?php foreach ($images as $image): ?>
- <li><a href="<?php echo sf_image_path($image->File) ?>" target="_blank"><?php echo image_tag_sf_image($image->File, array('size' => '120x120')) ?></a></li>
<?php endforeach; ?>
</ul>
カスタマイズ（変更後）
<ul class="photo">
<?php foreach ($images as $image): ?>
+ <li><a href="<?php echo sf_image_path($image->File) ?>"rel="lightbox[photo]"><?php echo image_tag_sf_image($image->File, array('size' => '120x120')) ?></a></li>
<?php endforeach; ?>
</ul>
————————————————————————————————————————–
■【日記コメントの写真をlightboxで表示】
[修正ディレクトリー]
/public_html/openpne/plugins/opDiaryPlugin-1.5.1/apps/pc_frontend/modules/diaryComment/templates
[修正ファイル]
_list.php
[修正箇所]下記 －：削除 +：追加
オリジナル（変更前）
<ul class="photo">
<?php foreach ($images as $image): ?>
- <li><a href="<?php echo sf_image_path($image->File) ?>" target="_blank"><?php echo image_tag_sf_image($image->File, array('size' => '120x120')) ?></a></li>
<?php endforeach; ?>
</ul>
カスタマイズ（変更後）
<ul class="photo">
<?php foreach ($images as $image): ?>
+ <li><a href="<?php echo sf_image_path($image->File) ?>"rel="lightbox[photo]"><?php echo image_tag_sf_image($image->File, array('size' => '120x120')) ?></a></li>
<?php endforeach; ?>
</ul>
————————————————————————————————————————–
■【lightboxを使用した場合にloadingマークとcloseマークが表示されない不具合修正】
（原因）
画像指定先フォルダーにloadingマークとcloseマークがないため
[修正ディレクトリー]
/public_html/openpne/plugins/opDiaryPlugin/web/js
[修正ファイル]
lightbox.js
[修正箇所]下記 －：削除 +：追加
オリジナル（変更前）
function LightboxOptions() {
this.fileLoadingImage = '/opTimelinePlugin/images/loading.gif';
this.fileCloseImage = '/opTimelinePlugin/images/close.png';
this.resizeDuration = 700;
this.fadeDuration = 500;
this.labelImage = "Image";
this.labelOf = "of";
カスタマイズ（変更後）
function LightboxOptions() {
this.fileLoadingImage = '/openpne/plugins/opDiaryPlugin/web/images/loading.gif';
this.fileCloseImage = '/openpne/plugins/opDiaryPlugin/web/images/close.png';
this.resizeDuration = 700;
this.fadeDuration = 500;
this.labelImage = "Image";
this.labelOf = "of";
http://lokeshdhakar.com/projects/lightbox2/からdownloadにて\lightbox2-master\src\imagesのフォルダーに上記設定した保存場所へコピーして下さい。