イメージビューアー(prettyPhoto)
a-blog cmsでは、サムネイル画像を拡大表示させるイメージビューワー(prettyPhoto)の設定が標準で実装されています。
デモ
1. 設定の編集
管理ページ > カスタマイズ管理:コンフィグ > モジュール:Entry_Bodyイメージビューワーの部分を「 rel="prettyPhoto[{unit_eid}]"」にします。
この機能の設定は、/js/config.jsの以下の箇所にあります。設定を変更する場合は、適用しているテーマ内にJavaScriptファイルを別途作成してください。詳しくは「組み込みJSについて:設定を編集する」を参照してください。
//----------------------------------
// イメージビューア ( prettyPhoto )
ppMark : 'a[rel^="prettyPhoto"]',
ppConfig :
{
animation_speed: 'fast',
slideshow: false,
autoplay_slideshow: false,
opacity: 0.80,
show_title: false,
allow_resize: true,
default_width: 500,
default_height: 344,
counter_separator_label: '/',
theme: 'light_square',
hideflash: false,
wmode: 'opaque',
autoplay: true,
modal: false,
overlay_gallery: true,
keyboard_shortcuts: true,
changepicturecallback: function(){},
callback: function(){},
markup: (省略),
gallery_markup: (省略),
image_markup: (省略),
flash_markup: (省略),
quicktime_markup: (省略),
iframe_markup: (省略),
inline_markup: (省略),
custom_markup: ''
},
ppCaption2Title : true,
ppMark | prettyPhotoを使用する場合のrel属性値 |
---|---|
ppConfig | prettyPhotoの設定値参考:prettyPhoto documentation |
ppCaption2Title | ユニット画像のキャプションをタイトルとして使用するかの設定 |
2. 補足
a-blog cmsのバージョンアップ(Ver. 1.6.2.1以前)をしたサイトで、下記のエラーが表示されることがあります。
index.js : loadClosure is not function
対応としては、Ver. 1.7.0以上へのバージョンアップか、もしくはhighslideをprettyPhotoに変更をしてください。