Home > IT,Web > Movable Type Archive
Movable Type Archive
Lightbox Movable 設置 備忘録
- 2009年5月 8日 19:49
- GX100 | Movable Type
正確にはLightbox2.04 を Movable4.25で使う。
画像のポップアップを格好良くするJavascriptです。
参考にしたサイトは、
(Lightbox2.04 だと、上記の設置方法では動作しないので注意してください)
設置方法
(設置場所などの環境によって多少変わります)
- Lightbox.js パラメーターの編集
- Image.pm を編集
- ファイル群をput
- スタイルシートの編集
- Lightbox.js パラメーターの編集
fileLoadingImage 「読み込み中を示す画像URL」
fileBottomNavCloseImage 「CLOSEボタンの画像URL」
overlayOpacity 「背景の不透明度)1で黒」
animate 「リサイズ時のアニメーション(true:アニメーションする、false:しない)」
resizeSpeed 「リサイズ時の速度(1:低速、10:高速)」
borderSize 「枠のサイズ(余白)」
最低限、下記の項目は修正する必要がある。
fileLoadingImage
fileBottomNavCloseImage
設置ファイルのパスを環境にあったものに変更する。
- mage.pm を編集
ここは参考サイトの通りしました。2箇所修正。
ブログに写真を貼り付けたら、自動的にlightboxが適用するようになる。
(要は自動で「rel="lightbox」を記述するようにするため。)
必要なければこの項目は不要。
Image.pmの場所は、
mt>lib>MT>Asset>image.pm
1箇所目
修正前
<a href="%s"><img alt="%s" src="%s" %s %s /></a>
修正後
<a href="%s" rel="lightbox"><img alt="%s" src="%s" %s %s /></a>
2箇所目修正前
$text = sprintf(
'<img alt="%s" src="%s" %s %s/>',
MT::Util::encode_html( $asset->label ),
MT::Util::encode_html( $asset->url ),
$dimensions, $wrap_style,修正後
my $thumb_width = $param->{thumb_width}; my $scale = $asset->image_width / $thumb_width; $dimensions = sprintf( 'width="%s" height="%s"', (( $asset->image_width / $scale, $asset->image_height / $scale )) );
$text = sprintf(
# '<img alt="%s" src="%s" %s %s />',
# MT::Util::encode_html( $asset->label ),
# MT::Util::encode_html( $asset->url ),
'<a href="%s" rel="lightbox"><img alt="%s" src="%s" %s %s /></a>', MT::Util::encode_html( $asset->url ), MT::Util::encode_html( $asset->label ), MT::Util::encode_html( $asset->url ),
$dimensions, $wrap_style,
- ファイル群をput
私の場合は、他のサイトを参考にして、
[ /mt/javascript/lightbox ] を設置場所とした。
- スタイルシートの編集
現時点で最新のlightbox2.04を設置しようとすると、今までの方法ではスクリプトが起動しない。
さらに参考にしたサイトから引用して、
私の場合は、以下とすることで、起動しました。
テンプレートモジュールのHTMLヘッダーに記述。
<script type="text/javascript" src="/mt/javascript/lightbox/js/prototype.js"></script>
<script type="text/javascript" src="/mt/javascript/lightbox/js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="/mt/javascript/lightbox/js/lightbox.js"></script>
<link rel="stylesheet" href="/mt/javascript/lightbox/css/lightbox.css" type="text/css" media="screen">
再構築すれば完了。
グループ表示する場合は新記述カッコ内を統一する。
例:「 rel="lightbox[ここにグループ名]" 」
以上の説明は、分かりづらいかもしれませんが、備忘録として要点のみを記述しています。
あくまでも私の環境の「lightbox2.04」、での動作確認です。
それ以外の環境やバージョンでは、また違った不都合があるかもしれません。
(アーカイブ系のページであるかもしれません)
(Googlechromeで見たときcloseのgif あたりの表示がおかしい)
- Comments: 0
- TrackBacks: 0
MEMO MovableType 次ページ処理
- 2009年4月11日 18:27
- MEMO | Movable Type

惨敗です。挫折です。
見てください。このアクセス数。9割5分は自分で踏んでます。
(ビール飲んで、うひーのプロフィール画像です)
ほんと難しいっすわー。
なんなの、これ。
みんなのサイトを参照しながら設定してるけど、タグとか全然わかんないし。笑
なんとなくこういう意味だろうなーって、ここまで来ましたが、やっぱりマニュアル本が必要なのでしょうか。
次ページ処理するのに「MTPaginate」を導入しようと思ったところまでは、良かったのですが。
いっこうに前に進みません。
進むどころか、プラグインフォルダにアップロードするとmt.cgiがスクリプトエラー。
あああああああああ!
もう疲れたので、やめます。次ページ処理を次ページ処理します。
なんのこっちゃ。
やっぱりはじめから理解しないと難しいようです。
当面の課題は、
1.MTの構成を理解すること
2.MTタグを理解することと
3.MTプラグインを理解すること
(ある意味この3つは必須だろ!って自分に突っ込み入れます)
備忘録
http://bizcaz.com/archives/2006/02/08-225445.php
http://m.nj-clucker.com/2008100823.php
http://www.koikikukan.com/archives/2006/04/20-005555.php
http://30smash.main.jp/mt/customize3/post_44.html
- Comments: 0
- TrackBacks: 0
MovableType4.25 DEBUT
- 2009年4月10日 16:23
- Column,Diary | IT,Web | Movable Type

完全に見切り発車です。
フライングですが、公開します。
ココログから
サイトデザインとかカテゴリーなど、微調整していきたいところが、山ほどあります。
難しいですね。途中で心が折れそうになったけど、ようやくここまで来ました。
めっちゃ疲れました。
そーそー。
ついでにドメイン取得したので、ryujimatsuda.com の方も、整理したいなと思い始めています。
どんどんやることが拡大していって、収集がつかなくなってるけど・・・・。
まぁ、今後のWeb関連の知識になればと、自分を慰めることにします。
この経験をもとに、僕みたいな初心者向けMovableType設置記事とか書いてみようと思います。
初心者がもっと簡単に設置できたらいいのにね。
では。
- Comments: 0
- TrackBacks: 0
1
- Search
- Feeds
- Tag Cloud
-
- 2011年
- Amazon
- blog
- Book
- Cooking
- D5000
- DIY
- Dropbox
- EASEUS
- Eye-Fi
- Flickr
- Fusion
- Gadget
- item
- Javascript
- LED
- Lifehack
- Lightbox
- Logo
- mac
- Memo
- MovableType
- MTPaginate
- MUJI
- Nike
- RUNNING
- Shop
- Sugarsync
- TBS
- TOTO
- WBC
- YTClock
- お盆休み
- アナログ時計
- アフェリエイト
- アンティーク
- イタリアン
- イヤープラグ
- インフルエンザ
- エコポイント
- キャンプ
- グローエ
- コムズガーデン
- コールテン鋼
- スクリプトエラー
- タイマー
- テレビ
- デスクトップカスタマイズ
- データベース
- トラス
- ドメイン
- パース
- ファンタジー営業部
- フローリング
- プラグイン
- マグライト
- マスダンパー
- マーケティング
- ミース・ファン・デル・ローエ
- ユニクロ
- レビュー
- 七草がゆ
- 上棟式
- 亀
- 京橋
- 住宅
- 住設機器
- 偶然
- 共有
- 前田建設
- 台北101
- 地デジ
- 地デジカ
- 基礎
- 大阪城公園
- 実験流し
- 店舗
- 建築
- 引渡し
- 心斎橋
- 情報
- 戎
- 投稿
- 掃除
- 携帯
- 撮影
- 整理
- 料理
- 新年
- 日韓問題
- 映画
- 時計
- 有吉
- 本棚
- 水栓
- 水没
- 照明
- 猫
- 現場
- 生ハム
- 発熱相談センター
- 白いんげん
- 看板
- 福娘
- 竣工
- 結婚式
- 絵
- 耳栓
- 自転車
- 花見
- 言葉
- 足場
- 連絡先
- 遠藤秀平
- 那須
- 野球
- 銀河鉄道999
- 阪和線
- 隈研吾
- 雪
- 電車
- 韓国
- 鳥
