MyBBでprettyPhotoを使う

MyBBの添付ファイル画像は、デフォルトでは別にウィンドウを開いて画像のみを表示する。これをlightbox風にポップアップで表示させたかったので、prettyPhotoを使ってみた。

環境

  • MyBB 1.6.14
  • prettyPhoto 3.1.5
  • jQuery 1.11.1

インストール手順

  1. MyBBをインストールしたディレクトリの下に「prettyphoto」という名前でディレクトリを作成する。
  2. prettyphotoの下に、jQuery公式サイトより最新版の1.x系のjQueryをダウンロードし、ファイル名をjquery.jsに変更しておく。
  3. prettyPhotoの公式サイトより最新版をダウンロードし、prettyphotoの下に展開する。
  4. MyBB管理者CPの「テンプレート&スタイル」の「テンプレート」から使用中のテンプレートを選択し、「テンプレートを開く」。
  5. グループ化されていないテンプレート > headerincludeを編集し、次の行を最後に追加する。
  6. フッタテンプレート > footerをを編集し、次の行を最後に追加する。
  7. 記事部品テンプレート > postbit_attachments_thumbnails_thumbnailを編集し、リンク部分の記述に次のように「rel=”prettyPhoto”」を追加する。

添付ファイルのある記事で、添付ファイルがlightbox風に表示されるのを確認する。