HOME > Blog カスタマイズ > 画像の魅せかた!?

画像の魅せかた!?

2006年03月12日 AQ
色々なジャンルのブログがある。
基本のテンプレートそのままに、日常の喜怒哀楽を書き綴ったり、毎日の食事を披露してみたり ・・・。

カスタマイズすること自体、楽しんでいる場合もあるし、専門的な情報を発信するためのブログもある。でもどれもが共通して言える事は、自分のブログ自体を覗いて欲しいし、興味を持ってもらいたい ・・・ じゃないでしょうか

そのためには文章だけのブログでは限界があり、なんか味気ない。 アイキャッチさせるために必要なファクターと言えば、やはり写真やイラストであり、その見せ方という事になります。
今回のカスタマイズは、サムネイル画像をクリックした時に、『 かっちょいい〜 』 てきな見せ方 ( 魅せ方 ) をする方法です。

別のブラウザーが開くわけでもないですし、現在のページはそのままでブラックアウトした半透明の背景が広がり、写真やイラストがシンプルに引き立ちます。( 上のカエルをクリックしてみて下さい )

カスタマイズする部分は、トップページ・個別記事・カテゴリー別・月別 の 4つ の HTML 。そして CSS ( スタイルシート ) です。ジャバスクリプトのファイルをアップしなければいけないので、ライブドア PRO もしくは、プロバイダーなどが提供している別のサーバーが必要になります。

まずは必要なファイルを 『 Lightbox JS by Lokesh Dhakar 』 に行って、ダウンロードして下さい。ダウンロードするファイルは以下の 5つ 。

 lightbox.js このカスタマイズの主となるスクリプトファイルです。
 lightbox.css CSS ( スタイルシート ) ファイルです。
 overlay.png 背景を半透明にブラックアウトさせる為の画像。
 loading.gif 画像を読み込む表示待ちをあらわした画像ファイル。
 close.gif ポップアップした画像を閉じさす表示の画像ファイル。

loading.gif と close.gif は、必要でなかったら使用しません。AQ は、close.gif は使用していません。必要か必要でないかは、『 Lightbox JS by Lokesh Dhakar 』 さんとこのサンプル画像を見ていれば、直感的にわかるでしょう。

デスクトップか任意のフォルダーに 『 lightbox 』 フォルダーを作り、そこにまとめてダウンロードすれば良いでしょう。( AQ もそうしていただけると説明がしやすいです

ダウンロードしたファイルのうち、overlay.png と loading.gif  、close.gif ( 使用する方で必要であれば ) を、管理画面内のファイルのアップロードなどを使用してサーバーに上げます。
そのアドレスは必ず控えておいて下さい。


次にスクリプトファイル lightbox.js をサーバーにアップするのですが、loading.gif と close.gif を使用しない方は、そのままサーバーにアップロードします。使用する方はスクリプトファイルに少し加工が必要です。テキストエディターなどでファイルを開いて下さい。開く時は必 ず ・・・
” 日本語 ( EUC ) ” で開いて下さい。


上から少し下がったところに、こういう部分があります。

// If you would like to use a custom loading image or close button reference them in the next two lines.
var loadingImage = 'loading.gif';
var closeButton = 'close.gif';

上記の 赤文字 の部分を、先ほどアップロードして控えていた、” 絶対 URL ” に書き換えます。つまり、アップしたファイルの http:// 〜 から始まる部分すべてを記述します。このスクリプトを使用しているほとんどの人が、loading.gif は使用していますが、close.gif は使用していない傾向にあるみたいです。

もしあなたも close.gif を使用しないのであれば、オリジナルのままさわらず、そのままアップロードしても良いのですが、こうしておいたほうが良いと AQ は思います。

var closeButton = 'close.gif'; を var closeButton = ''; にする。

つまり、close.gif の記述を削除するのですが、こうする事によって Mac の Safari において、ポップアップした画像の右上に意味不明の ? マークが出現するのを防げます。( ただこれの為だけなんです ・・・ 他のブラウザーはそのままにしておいても、? マークはでてきません )

さてスクリプトの記述変更が終わったら、保存して下さい。その時に必ず、” 日本語 ( EUC ) ” で保存 することを忘れないで下さい。そして任意のサーバーにアップロードします。そのアドレスは必ず控えておいて下さい。

これでダウンロードしたファイルの下準備が終わりました。次に、トップページ・個別記事・カテゴリー別・月別の 4つ の HTML に、スクリプトを呼び出すタグの記述をします。<head> 〜 </head> の間の、どこでも良いので以下のタグを追記します。

<script type="text/javascript" src="http:// 〜 あなたがサーバーにアップロードした、スクリプトファイルのURL"></script>

それぞれを管理画面内にて保存。再構築して下さい。ここから後は、まずトップページだけ試した方が良いでしょう。スクリプトが正しく動作しているのを確認した後、他の HTML に取り掛かるほうが無駄がないと思います。

最後に CSS ( スタイルシート ) をさわって終わりです。ダウンロードした CSS ( スタイルシート ) はそんなに長くないので、現在お使いの CSS ( スタイルシート ) に追加する形で コピー & ペースト すれば良いでしょう。そのさい一部を書き換えなければなりません。以下を見て下さい。

#overlay{ background-image: url(overlay.png); }

* html #overlay{
background-color: #333;
back\ground-color: transparent;
background-image: url(blank.gif);
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="overlay.png", sizingMethod="scale");
}

この個所なんですが、赤文字 の部分を、初めにアップロードして控えてあるファイルの ” 絶対 URL ” に書き換えます。つまり、http:// 〜 から始まるすべてのアドレスを記述します。

青文字blank.gif は無視してもかまいません。初めからダウンロードしていませんし、このままでも間違いなく動作します。ただし、関係ないから削除ってのはしないで下さいね。 背景がまっ黒けっけになってしまいます。( 検証済み ) 他の CSS 部分はそのままで良いですが、自分の好みに仕上げたい方は、ちょこちょこいじってみて下さい。(^^)

書き換えた CSS を管理画面内で保存し、再構築します。これですべてのカスタマイズが終了しました。あとは記事を書く時に、クリックしたらポップアップする予定の画像に、rel="lightbox" の属性を追加するだけです。このタグをつけなければ、普通の状態で表示されます。

説明は異常に長いですが カスタマイズを始めてみると、意外に簡単にできるのがわかると思います。細かいところまで ” こだわり ” と ” 美しさ ” を求めて、頑張ってみて下さい。

■ 参考ブログサイト

※ 追記 :
クリックしたらポップアップする予定の画像に title=" 何かのコメント " 属性を付ければ、ポップアップした画像の左下に、そのコメントが反映されて表示されます。

※ 追記 : ( 2006年04月24日 )
現在 Light Box はバージョンがアップし、スライドショーまでできるようになっております。また、Light Box の改造版 Light Box Plus などもあり、バリエーションが増えてきています。他のスクリプトカスタマイズとの干渉を避ける手段のひとつとして、このような違うバリエーションとの組み合わせを考えてみるのも良いかもしれません。(^^)


この記事へのトラックバック
1. 画像を格好良く魅せる  [ お気楽日記 ]
2006年04月21日 16:30
少し?一段落したので次のカスタマイズにチャレンジ たまにはそれらしい画像もw いつも丁重に解説して下さるAQさんには非常に感謝しておりますm(__)m 画像の魅せかた!? - Pet Lovers Only♪ なんと言っても魅力は、今まで普通にファイルアップすると、別...
2. Blogイヂリ***COOLに画像を表示する-Lightbox Plus   [ [限] 期間限定ですっ!! ]
2006年04月22日 19:14
今日もイヂリネタでスミマセン ミニカーネタを書こうと思いつつ、思いつかないのでついつい逃げてます(ぷ) Lightbox Plus 今まで、別ウインドウで開いていた画像を同一ウインドウ内に表示させるスクリプト。 『Lightbox』に機能追加されたもの。 こちらのサイトで...
3. 大改造〜ww  [ ruru's footprint ]
2006年11月30日 05:42
ブログのデザインを変更しました☆ (о´艸`)゚.+:* ふふ♪ ←こちらが元のデザインです。間違えてるんじゃない!? って思いました? 間違えてませんよ。((´∀`*))ヶラヶラ 改造に改造を重ねて… こうなっちゃいました。写真と見比べると、なんと...
この記事へのコメント
1. Posted by kou   2006年03月12日 09:13
これいいですよね
ちょっと前から導入してますけど
かっこいい!![めがね]
思ったより簡単ですしね

コレにチョット似てる greybox ってのもチャレンジしたんですけど
使いみちがない [orz...]
2. Posted by AQ   2006年03月12日 14:07
> kou さん いらっしゃい (^^)
あっ、kou さんもすでに導入してましたか [アハ]
いいですよね。一発で気に入っちゃいました。
それにホントに簡単に、カスタマイズできますしね。
僕の説明が長ったらしくて、難しく感じてしまいそうですが [汗汗]

greybox [?] なんですかそれ? 興味ある!
調べてみようっと [ニコ]
3. Posted by ぱぱ (^^)   2006年04月16日 18:53
先ほどはありがとうございます。<(_ _)>
早速、チャレンジさせていただいてるんですが、上手くいかない箇所がありましたのでコメントさせていただきました。

>次にスクリプトファイル lightbox.js をサーバーにアップするのですが

とありますが、ライブドアブログでファイルをアップロードすると、『- error.file.invalid_type』というのが出てしまいます。jsファイルをそのままアップロードできるのでしょうか?よろしくお願いします。<(_ _)>
4. Posted by ぱぱ (^^)   2006年04月16日 19:05
もう1点お願いします。

>日本語 ( EUC ) ” で保存することを忘れないで下さい。

とありますが、メモ帳ではそういう機能が内容なのですが、やはりテキストエディタをダウンロードしてきてやった方が良いのでしょうか?よろしくお願いします。<(_ _)>
5. Posted by AQ   2006年04月16日 21:18
> ぱぱ (^^) さん いらしゃいませ。

> 次にスクリプトファイル lightbox.js を
> サーバーにアップするのですが ・・・

もしかしたら、ライブドアの 『 ファイルのアップロード 』 を使用してサーバーに上げようとしていませんか [?] それでは、スクリプトファイルはサーバーに上げる事はできません。

独自ドメインに変更できていると言う事は、有料版をお使いだと思うのですが、FTP ソフトを使用して直接サーバーにアップしなければなりません。

> 日本語 ( EUC ) で保存

メモ帳では、開く事もできませんし、保存する事もできません。必ずテキストエディターをダウンロードしてご使用下さい。今後カスタマイズをしていく中で、テキストエディターは絶対にいるものですから ・・・。
6. Posted by ぱぱ (^^)   2006年04月16日 21:41
AQさん、ありがとうございます。<(_ _)>
そうです。『 ファイルのアップロード 』 を使用してサーバーに上げようとしています。(笑)

今から、テキストエディターとFTPソフトを窓の杜でダウンロードして、頑張ろうと思います。

ど素人ですみません。<(_ _)>
7. Posted by ぱぱ (^^)   2006年04月16日 21:59
お手数おかけしますが、テキストエディターの方は何とかできたのですが、FTPの件が何とも解りません。
どこか詳しく書いてあるところをご存知でしたら教えていただけないでしょうか?よろしくお願いします。<(_ _)>

因みに、ソフトは『FFFTP』というものをダウンロードしてみました。
http://www.forest.impress.co.jp/lib/inet/servernt/ftp/
8. Posted by AQ   2006年04月16日 22:15
> ぱぱ (^^) さん

FFFTP のサポートページがあります。

http://ftp.hm/ffftp/

こちらに FFFTP に関する、トラブルシューティングや
色々なヘルプ項目が掲載されています。

サーバーにアップするだけなら、簡単な設定で
サーバーにつなげる事ができますけどね。

ちなみにライブドアのサーバーにつなげる為のホスト名は
ftp.blog.livedoor.com です。あとはユーザー名のところに
ぱぱ (^^) さん の ID を。パスワードのところに
同じくライブドアのパスワードを記入するだけです。
9. Posted by ぱぱ (^^)   2006年04月16日 22:32
丁寧にありがとうございます。
早速、チャレンジ!します。[フリフリ]
ε=ε=ε=ε=ε=ε=ε=ε=ε=ε=(;^_^)/ゼンリョクダッシュ
10. Posted by AQ   2006年04月16日 22:42
> ぱぱ (^^) さん

またわからなくなったら ・・・
ε=ε=ε=ε=ε=ε=ε=ε=ε=ε=(;^_^)/ゼンリョクダッシュ
で、戻ってきてください。[アイタ]
11. Posted by ぱぱ (^^)   2006年04月16日 23:00
お言葉に甘えて。。。
ε=ε=ε=ε=ε=ε=ε=ε=ε=ε=(;^_^)/ゼンリョクダッシュ
アップはできたようなんですが、URLの表示がどうやって見れば良いのか解りません。[もっとorz...]

http ではなく、ftp://ftp  って事ないですよねぇ?
とりあえず、jsをそのままアップして、アップされたところを右クリックしてURLをクリップボードに。。。っていうことでコピーすると、上記のような表示が出ます。[あーあ]

因みに、overlay.pngなどは普通に『ファイルのアップロード』で良いんですよねぇ?

何だか、頭がぐちゃぐちゃです。(x_x;)シュン
12. Posted by AQ   2006年04月16日 23:17
> ぱぱ (^^) さん

まず、アップロードするときに上側に並んでいる 『 A 』、『 B 』、『 A/B 』 のタブは何にしてアップしました。[?]

A は、アスキー = テキスト文章ファイル
B は、バイナリー=画像ファイルなど
A/B は、自動判別

わからなかったら、A/B にしておいて下さい。それから 『 Euc 』、『 Jis 』、『 無 』 の部分は、無か念のため Euc にしてアップして下さい。

そしてアドレスの事ですが、一番初めに出てくる階層にファイルをアップした場合は、そこの中のファイルアドレスはすべて、http:// 自分のアドレス / です。『 / 』 の後にそのアップしたファイル名を付ければ、アップしたファイルのアドレスになります。

> overlay.png などは普通に 『 ファイルのアップロード 』 ・・・

良いですよ。でも FFFTP でそのままアップしてしまったほうが早いような気がしますが ・・・。スクリプトファイル以外は、やりやすい方でやって良いですよ。(^^)
13. Posted by ぱぱ (^^)   2006年04月16日 23:35
では、もう一度!チャレンジしてきます。

本当にありがとうございます<(_ _)>
14. Posted by AQ   2006年04月16日 23:39
> ぱぱ (^^) さん

はは (^^) お礼は何度もいりませんから。
またすぐに戻ってくるような気がする ・・・ [汗汗]
15. Posted by ぱぱ (^^)   2006年04月17日 00:04
はい、戻ってまいりましたぁ。(x_x;)シュン

ミラー何とかってのが出てきて削除したら画像が消えちゃいましたぁ(爆)

今日は頭の中がぐちゃぐちゃですので、また時間があるときに再チャレンジします。

16. Posted by AQ   2006年04月17日 00:10
> ぱぱ (^^) さん

お帰りなさい。ww
ミラー何とか [?] ダウンロードした FFFTP は最新のバージョンですよね。私のは古いバージョンなんでちょっとそれはわからないですが、頭がぐちゃぐちゃの時は、いったん手を休めるのが正解です。[ニコ]

でもやりかけたんですから、最後まであきらめないで下さいね。何日掛かっても良いですから、頑張っていきましょうよ。完成するまでお手伝いしますからね。(^^)
17. Posted by ぱぱ (^^)   2006年04月17日 08:47
おはようございます。
どうも『js』ファイルが上手くアップできてないようです。
http://www.c-union.info/lightbox.js
とやってファイルを開こうとすると、”window”は宣言されてません。というエラーが出るんです。やはり上手くアップできてないという事でしょうか?

それからAQさんのCSSを見ようとアドレスに『site.css』をつけて見てみたのですが、CSSのどのあたりに入れてあるのでしょうか?

よろしくお願いします。
18. Posted by AQ   2006年04月17日 11:20
> ぱぱ (^^) さん

私がそのアドレスでスクリプトをダウンロードしたところ、ちゃんと正しく開けられましたよ。中身も見ましたが、後に書き換えを行なわなければならない個所はあるものの、問題は無いようでした。

私の CSS は設置しているスクリプトなどに応じて、合計4枚サーバーに置いてあります。ぱぱさんが見た CSS には lightbox の CSS は書いてないですよ。ww

置いてあるアドレスはここです。↓

http://blog.pekebatu.com/box.css
19. Posted by AQ   2006年04月17日 11:25
> ぱぱさん

rel="lightbox" の書く位置が間違っています。
本来ブランクして開く大きな画像のほうに rel="lightbox" を記述します。その時に、そちらの画像のタグに記載してある、target="_blank" は削除しなければなりません。

その、target="_blank" があると、lightbox が開かずに、通常の画像が開きます。
20. Posted by ぱぱ (^^)   2006年04月17日 12:40
AQさん、こんにちはっ!
target="_blank" を両方の画像から削除してみました。そして、rel="lightbox"は右側の画像だけに残してみましたが、やはりダメです。

あと、
>次にスクリプトファイル lightbox.js をサーバーにアップするのですが、loading.gif と close.gif を使用しない方は、そのままサーバーにアップロードします。使用する方はスクリプトファイルに少し加工が必要です

とありましたので、jsはそのままアップした形になってます。

cssはAQさんのと比べさせていただくと、『, sizingMethod="scale"』というのが私のにはなかったので追加させていただきました。

どこが悪いんでしょう?
よろしくお願いします。<(_ _)>
21. Posted by AQ   2006年04月17日 18:42
> ぱぱさん

rel="lightbox" の入れるところが違いますよ。
target="_blank" が記述してあった方の画像に入れるんですよ。

サムネイルのほうじゃ無くて、<a href="" で始まる、ハイパーリンクされている、大きく表示される方の画像です。

PS. 返事遅くなってすみませんね。[汗汗]
高校のラグビー部をコーチしに行ってるんですよ今 A^^;
22. Posted by AQ   2006年04月17日 18:48
> ぱぱさん

それから CSS の中の、overlay に対してリンクさせてる
画像のアドレスから、?blog_id=○○○ を消してください。
これは、あなたのブログ ID ですので、必要ありません。

上記の事と、これを合わせて修正して、
もう一度どうなったか教えて下さい。[普通]
23. Posted by ぱぱ (^^)   2006年04月17日 19:16
AQさん!!!!![ウェーン]
で・で・できましたぁ。やったー[叫び]

21.22の項目をやったらさっくりとできましたぁ。(*^-^)
是非!是非!小市民の苦労の賜物?(爆)を見てください。

http://www.c-union.info/archives/50665546.html

本当に本当にありがとうございます。<(_ _)><(_ _)><(_ _)>

これを機にまた新しい機能を勉強しにお伺いしますので、よろしくお願いしま〜す。あっ!今、心の中でそれはうるさいからもういい?って思いましたぁ。(笑)

では、またあつかましくお伺いさせていただきます。[晴れ]

24. Posted by AQ   2006年04月17日 19:28
>ぱぱさん

良かったですね。(^^)
でもまだトップページの HTML にしか、スクリプトのリンクを貼っていないんですね。すべての HTML で見せるためには、トップページ、個別記事、カテゴリー、月別の4つのページにスクリプトのリンクを貼らなければなりません。

それとポップアップした画像の上にマウスカーソルを置くと、左上に Windows ですと、イメージツールバーが出てきます。これは正直言って美しくないので出ないようにしてしまいましょう。

こちらを参考にメタタグを新たに記述すればよいですよ。(^^)

http://blog.pekebatu.com/archives/50403240.html
25. Posted by ぱぱ (^^)   2006年04月17日 19:51
はい。早速、全てのHTMLを書き換えてきましたぁ。
お陰さまですっきりです。[フリフリ]

そして、調子に乗ってコピペだけで、こっちのブログまでやっちゃいました。(*^-^)

http://papa.livedoor.biz/archives/50785019.html

真ん中のチャートです。

しばらくは画像キチガイになりそうです。(爆)
26. Posted by AQ   2006年04月17日 20:01
> ぱぱさん

はは (^^) バッチリです。
ついでにブログの宣伝もバッチリですね。[アイタ]

SEO にも凝っておられるみたいですね。
頑張って人気ブログに仕立て上げて下さい。[音符]
27. Posted by ぱぱ (^^)   2006年04月17日 20:42
宣伝?
プププッ (*^m^)o==3
そんなつもりはないんですが、勝手にすみません。(/-\*) ハジュカチ…

で、ちょっと贅沢な質問です。

rel="lightbox"は投稿時には挿入できないですよねぇ。
やはり一度アップしてから再度、ブログの編集ですよねぇ〜。
28. Posted by AQ   2006年04月17日 20:59
> ぱぱさん

宣伝は、冗談ですよ (^^)

現在のライブドアのシステムを利用してる限りは
無理っぽ見たいですね [汗汗]

Movable Type のような自分でいちから構築して
ブログを作成するシステムなら可能みたいです。
でもそうなると私のスキルでは、どうにもなりません。[汗タラー]

頑張って、" 手動 " でカキコして下さいな [汗汗]
29. Posted by お気楽管理人   2006年04月21日 15:37
AQさん、こんにちは [ラブラブ]
あれ〜始めにこちらにTBさせて頂いたのですが・・・

出来てないのかしら [ガビン]
出来てなかったらお知らせ下さい (;^ω^A
投稿時にすぐお送りしたんだけどな〜
livedoor側の問題[?]

>>バージョンアップ版
楽しみにしております♪

[u]いつも詳細な設置方法記載に感謝です^^[/u]
試しに下線でも(ぷ)
30. Posted by AQ   2006年04月21日 16:10
> お気楽管理人 さん (^^)

[blockquote]あれ〜始めにこちらにTBさせて頂いたのですが ・・・ 出来てないのかしら [ガビン][/blockquote]
できていません [アイタ]

早速一番乗りで使用しましたね、新しいカスタマイズ (^^)
まだ細かい CSS の調整ができていなくて ・・・
それ以上に今日の記事の準備もできていなくて ・・・ [もっとorz...]

[span][style]color:#CC0066;[/style]頑張ろうっと[/span] [汗汗]
31. Posted by お気楽管理人   2006年04月21日 16:34
再びこんちわ〜^^
>TB
送信完了しました!!
でもこちらの管理画面の「送信履歴」にはちゃんと残ってるんですけどね〜[?]

もし二つになったら一つ削除しといて下さいネ

>>まだ細かい CSS の調整ができていなくて ・・・
>>それ以上に今日の記事の準備もできていなくて
カスタマイズしてたら記事書く暇は無いですよね[ニヤリ]

実は私も仕事(お気楽事務員)が進みません[あーあ]
32. Posted by AQ   2006年04月21日 17:34
> お気楽管理人さん

コメント/トラバ、どうもありがとうございます。(^^)
無事に受け取りました。
( 半角スペースが入っていたんじゃ無いですか [?] )

せっかくご紹介してくれたのに、個別記事の Light Box が動作していないんですよ〜 [ウェーン] 多分、コメントリンクのスクリプトだと思うんですが、また今日も眠れない ・・・ [もっとorz...]
33. Posted by ひでP   2006年04月21日 19:51
AQさん、初めまして。ひでPと申します。
いつも色々と参考と言うか、マネさせて頂いております[汗タラー]
このカスタマイズも参考にさせて頂いたのでお礼に参りました。
どうもありがとうございます。
また遊びに来ますので、どうぞよろしくお願い致します。
34. Posted by AQ   2006年04月21日 20:49
> ひでP さん 初めまして (^^)

さっそく遊びに行かせて頂きました。[音符]
どうぞ私の記事でよければ、いつでもご参考にして下さい。
そちらのコメント欄にも書きましたが、関連する記事を
お書きになった場合は、遠慮せずにトラバかけて下さいね。

こちらこそ、どうぞ宜しくお願い致します。[フリフリ]
35. Posted by お気楽   2006年04月22日 14:42
AQさん( ^ ^ )/ こんちは

[blockquote]個別記事の Light Box が動作していない[/blockquote]
ひでPさんが設置されている[strong]Lightbox Plus[/strong]を設置することで、他ページも動作するようになりました[音符]

Lightboxバージョンアップ版へ移行されると思いますが、とりあえず動作確認のご報告に^^
36. Posted by AQ   2006年04月22日 16:54
> お気楽さん (^^)

えぇ〜ホント [ビックリ]
それじゃ〜 早くバージョン替えなきゃいけませんね [汗汗]
もうやることありすぎっ A^^;

今日も息子の学校の PTA の役員に選ばれてしまった。
・・・ [もっとorz...] 無理やっ言うてんのに [汗汗]

ねぇ。ブログのほうが大事やのに [アイタ]
37. Posted by ひでP   2006年04月22日 20:17
AQさん、こんばんは。

再度、トラバ送信させて頂きました。
今度はうまくいけてるようです[音符]

>ブログのほうが大事やのに
そうですよね(笑)
役員がんばって下さい。
38. Posted by AQ   2006年04月22日 20:24
> ひでP さん こんばんわ (^^)

もう、あのカスタマイズやらなきゃ!
あれの関連記事を掲載しなきゃ!
あそこを修正しなきゃ!
これをあそこに移動して [無言]

やることいっぱいありすぎ ・・・ [もっとorz...]

トラバ受け取りました。コメントもありがとです。[ニコ]
39. Posted by かもめ   2006年06月19日 18:02
AQさん、はじめまして[ニコ]
駆け出しブロガーのかもめです♪いつも参考にさせて頂いております☆
AQさんのカスタマイズでlightboxjsを見たのがきっかけで今導入にチャレンジしているところです♪

lightboxjsで成功したんですが、ヴァージョン2.02でトライでいまだ成功していません[鼻水]

あちこちブログ等を参考にさせていただいたり、情報収集で考えてはいるのですが……。

構成ファイルをFTPでサーバーへアップし、絶対URLへの書き換えはおkなはずなんですが…ここから先へと進めません。

何を質問すればいーのかも分からない素人なもので…もう少し情報収集してがんばってみます。
livedoor blogで設置する上での注意点などありますでしょうか?
40. Posted by かもめ   2006年06月19日 20:33
連続のコメントになってしまいすいません[あーあ]

昨夜からのべ10時間以上もかけてやっっとできました><

原因を理解してはいないんですが、
ふとBloggerの方でためしてみた時に
cssファイルへのリンクを設置した場所を
<head>の下の他のcssファイルへのリンクのタグの真上に設置したらうまくいったことをヒントに、
livedoorでもトップページにて同様にしてみたら
上手くいきました[ラブラブ]
もう感激でありますo(≧∇≦o)(o≧∇≦)o
41. Posted by AQ   2006年06月19日 21:14
> かもめさん はじめまして (^^)
>>39

lightboxjs 2.02 ・・・
僕のブログでは使用できないんですよね (-_-;)
他のスクリプトと干渉して動作はするんだけど、あまりにも不安定なので、lightbox_plus で我慢しています。[汗タラー]

ブログ見させていただきました。blogger に設置しているのは綺麗に表示されていますよね。見たところ、スクリプトファイルと CSS は livedoor のサーバーにアップしてあるファイルを引っ張ってきています。

ということは、スクリプトファイルは正しく livedoor のサーバーにアップできているということになります。CSS の一部に誤記がありました。でも表示されないだけで、動作には関係ない個所です。

CSS に記述する、絶対 URL は3箇所だけです。

blank.gif
prev.gof ← ここが間違っている。gif が gof になってる
next.gif

スクリプトファイルの中の書き換える絶対 URL も、基本の lightbox.js の中の2箇所ですし、それもできているみたいです。

でっ、どういう状態になるんですか?
表示されない? 動作しない? 動作しても、おかしくなる?
それが知りたいですね ・・・。
42. Posted by AQ   2006年06月19日 21:24
> かもめさん
>>40

あら〜 (-_-;) 検証している間に、できちゃったんですね [汗汗]
まっ、とりあえず良かったです。(^^)

CSS をうまく読み込んでいなかったという事ですね。
でも、これは直しておいてくださいね。↓

prev.gof ← ここが間違っている。gif が gof になってる

それと、画像の上にカーソルを置くと、イメージツールバーが表示されます。せっかくの綺麗な画像が台無し (>_<) メタタグを設置して、表示させないようにしましょう。

[a]http://blog.pekebatu.com/archives/50403240.html#jump[txt]■ イメージツールバーの外し方[/txt][/a]

また遊びに来てください (^^)
43. Posted by かもめ   2006年06月19日 23:20
御丁寧に検証していただき、さらには説明までしていただいてありがとうございます☆

gofになってましたか(笑)
よくよく眺めたらさっきもjsがjpになってたりと
知らないところで打ち間違いしてたりして
画面の前で笑ってます><


Mixiからはじめて、ブログに可能性を感じていざ
始めてみたんですが 分からないことだらけですw
またいろいろと勉強させていただきます♪

どうもありがとうございました♪♪
44. Posted by AQ   2006年06月19日 23:36
> かもめさん

いえいえ。お役に立てず、もうしわけありません。[汗汗]

カスタマイズをしなければ、ブログは簡単なコミュニケーションツールなんでしょうけど、みんなと一緒じゃ嫌ですよね。(^^)

カスタマイズは奥が深いですよ〜 [フリフリ]
でも、一番大事なのは、見に来られる方のためにおこなうカスタマイズです。自分のやりたいことばかりでなく、訪問者に気持ちよく思ってもらえる改造は、どんどんとおこなって下さいね〜 (^^)
45. Posted by さる   2006年08月12日 12:17
どうもはじめまして!
私もLightbox JSに挑戦しているのですが、なかなか
うまくいきません。

何か、良いアドバイスをいただけないでしょうか><?

今、初心者と言う事で、最低限のlightbox.jsとoverlay.png を
借りた無料のサーバにアップロードしました。

トップページ・個別記事・カテゴリー別・月別の 4つ の HTML に、スクリプトを呼び出すタグの記述もURLをしっかり入れて完了しました。

つまずいている所は、CSS ( スタイルシート ) の部分だと思うのです・・・。
 
続きます↓
46. Posted by さる   2006年08月12日 12:17
自分でも分からないけど、たぶんここが原因かと・・^^;

ダウンロードしたCSS ( スタイルシート )に絶対URLを入れ
ライブドアブログのCSS ( スタイルシート )にコピペ
すると解釈しましたが、正解でしょうか?

この解釈が正解であれば、どのあたりにコピぺすればよろしいのでしょうか?

もしくは、ダウンロードしたCSS ( スタイルシート )を
絶対URLを入れ、アップロードすると言う事でしょうか?

rel="lightbox" を入れても表示されないのが現状です・・

どうか、アドバイスよろしくお願いいたします><
47. Posted by AQ   2006年08月12日 16:17
> さるさん 初めまして (^^)
>>45
>>46
ごめんなさいね [汗汗] 夜にならないと時間があかない ^^;
さるさんのブログチェックしたら、またレス返しますね。
それまで、お待ちください [フリフリ]
48. Posted by さる   2006年08月12日 23:33
どうも、お手数かけて申し訳ございません><

いつでもかまいませんので!

AQさん、とてもいい人だ〜><感動TT
49. Posted by AQ   2006年08月12日 23:46
> さるさん
>>45
>>46
お待たせしました。

[blockquote]最低限の lightbox.js と overlay.png を
借りた無料のサーバにアップロードしました。[/blockquote]
確認しました。スクリプトの中も見ましたが、『 loading.gif 』 と 『 close.gif 』 に絶対 URL が入っていないだけで、問題なくアップされています。overlay.png もリンクが切れる事無く表示されています。

[blockquote]ダウンロードしたCSS ( スタイルシート )に絶対URL
を入れライブドアブログのCSS ( スタイルシート )に
コピペすると解釈しましたが、正解でしょうか?[/blockquote]
そうです。それで間違いはありません。
何かしらのファイル名をつけ、別に単独でサーバーにアップしてもかまいません。私はこの後者の方法をとっていますが、それは別に意味があってしている事で、通常は、ライブドアの CSS に貼り付けて管理画面内に貼り付けるだけで結構です。

貼り付ける場所は、どこでもかまいません。
お好きな位置へどうぞ。通常は一番最後に貼り付けるのが、管理上、良いのじゃないでしょうか。貼り付ける位置で、表示されたりされなかったりの問題はでません。

でっ ・・・
[blockquote]rel="lightbox" を入れても表示されないのが現状です・・[/blockquote]
この記述を付けている画像はどれですか [?]
それを見てみたいのですが、トップページ上では見当たりません。lightbox が動作しない原因は、このタグの記述する場所の間違いしか考えられないのですが、それを確認してみたいですね。
50. Posted by さる   2006年08月13日 08:00
早速ありがとうございます><!
ライブドアの CSSの一番下に早速、絶対URLを入れて
貼り付けてみました。

rel="lightbox"を入れた画像は、消去してしまっていました・・・^^;申し訳ないです。

早速、過去の記事の「ドナルドダック」イラストに
rel="lightbox"をサムネイルじゃない方のURLの御尻に
入れて表示させてみたいと思います。

アドバイスよろしくお願いいたします><
51. Posted by さる   2006年08月13日 08:42
やはり、通常の画像が表示されてしまうようです・・・><

こんなに、苦戦した事がないので、自分の力の無さを実感じています[もっとorz...]
52. Posted by AQ   2006年08月13日 17:52
> さるさん
>>51
このコメントを書いている段階では、IE では動作しているみたいだったけど、すぐに動作しなくなりました。ちょうど、さるさんもブログをさわっている最中だったのかな [?] IE が動作している時でも、Firefox ではまったく動作していませんでしたね。(-_-;)

まず、現在のさるさんのブログは構文エラーが出るため、ローカルにダウンロードして検証しようにも、こちらのオーサリングソフトが落ちちゃって、確認できない状態になっています。多分、右サイドカラムトップに設置した、アンケートが原因と思われます。

初めの頃は何度か確認できたけど、今はまったく無理っぽ [汗タラー]

その頃チェックしてわかったのは、ローカルにダウンロードしてスクリプトの呼び込みタグを、ボクのスクリプトに直接つないでみたの。そうすると問題なく動作しました。結果、lightbox のスクリプトを開き閉じる時に、間違った作業をしたんじゃないかと考えました。

必ず 『 日本語 ( EUC ) で開き 』、『 日本語 ( EUC ) で閉じる 』。そして、FTP でアップする時に、EUC の文字コードで上げる。この辺をチェックして下さい。

また、rel="lightbox" の記述が、画像のアドレスの記述と引っ付いています。必ず半角スペースを空けて下さい。そして、lightbox のスクリプトを呼び出す記述の位置ですが、今のところから変えて、</head> の上にしてみてくれませんか [?]

これでまた結果を教えて下さい。
53. Posted by さる   2006年08月14日 02:02
アドバイスありがとうございます><
あぁぁ、構文エラーが起こっていますか・・・申し訳ないです><
アンケートを消去し、構文エラーしそうな
怪しい部分はすべて元に戻してみました。
どうでしょう?無理ぽでしょうか><?

lightboxデータはloading.gifとclose.gifを使用していないので
ダウンロードした、そのままのデータをアップロードしています。
そのままのデータもFTPでアップする時に、EUCの文字コード
で上げないと駄目なのでしょうか?

先ほど、変更点はありませんが、EUCで開きEUCで保存
し、アップロードしましたが、画像は通常表示でした・・・
今は、改めてそのままのlightboxデータをアップロードしています。

続きます↓
54. Posted by さる   2006年08月14日 02:18
そして、rel="lightbox"の頭に半角スペースを入れてみました!

lightbox のスクリプトを呼び出す記述の位置も、4つとも
</head>のすぐ上に変更しました。

[a]http://image.blog.livedoor.jp/monkey182/imgs/4/7/4767eeff.JPG?blog_id=1294789[txt]その中の1つの個別記事はこんな感じです。[/txt][/a]

[a]http://image.blog.livedoor.jp/monkey182/imgs/c/b/cb323da1.JPG?blog_id=1294789[txt]ちなみにCSSの貼り付けはこんな感じです。[/txt][/a]

すべて試しましたが、通常表示のままでした><

AQさんに、ご迷惑がかかってしまうので、
次回、もしアドバイスいただけまして、それでも無理なようでしたら
諦めようと思っています。

イラストブログなだけに、この画像表示が成功したら
泣いて喜んでしまいそうです・・・><
でも、男・・・諦めも肝心だとも思うのです。

いつもお手数をかけて申し訳ないです><
55. Posted by さる   2006年08月14日 04:14
たびたびすいません!

もう一つ、テスト用のブログを作り、同じように
設定してみましたが出来ませんでした><

おそらく、構文エラーなどではなく
私、何処かボンミスしているんだと思います・・・><

自分でもボンミス箇所を探してみます。
AQさん、応援よろしくお願いいたします!
いつもすいませんです><
56. Posted by AQ   2006年08月14日 05:14
> さるさん
>>53
>>54
構文エラーはアンケートじゃなかったみたいですね。取り外した後でも表示されます。やはり Light Box 自体のスクリプトに問題があるかも知れません。

ただ、さるさんのブログをチェックしていて、今のこの時間までに何度か動作していた時間帯がありました。『 あっ、できてるやん (・・;) 』 と思ったのもつかの間、すぐにエラーがでます。

たぶん、ボクのチェックと、さるさんのカスタマイズが同時進行しているため、そういう現象になっていると思います。ひとつ気になるのは、IE で動作しているのを確認した時でも、Firefox では動作していない事です。これは最終的に成功したとしても、結局、意味の無いカスタマイズになってしまいます。

そこで提案なんですが、もう一度、頭の中を真っ白にして、Light Box の設置を止め、[a]http://serennz.cool.ne.jp/sb/sp/lightbox/index_ja.html[txt]Light Box Plus[/txt][/a] を設置してみてはいかがでしょうか [?] 私も以前 Light Box を設置していて、他のスクリプトと干渉する為、Light Box Plus に変更した経緯があります。

その時も、IE では動作するが、Firefox では動作しないというものでした。ライブドアのリニューアルテンプレートに仕込んであるデフォルトのスクリプトと干渉するのかもしれません。

ですので、初めから [a]http://serennz.cool.ne.jp/sb/sp/lightbox/index_ja.html[txt]Light Box Plus[/txt][/a] を設置する方が良いと思います。見た目は変わりませんしね。少し拡張機能が付いているだけです。設置方法も、Light Box と大差ありません。直感的に設置する事が可能です。

それともうひとつ。さるさんのブログページの読み込みが遅く、一度読み込んだと思えば、また何かを読み込みにいきます。これも、ものすごく気になっていたひとつなのですが、Light Box はページのすべてを読み込まなければ動作しないようになっています。

これを解消しなければ、せっかちな閲覧者はページの読み込みを待たず、すぐにクリックする為、結果的に Light Box を通さず、通常の画像がブランクする形になります。

この読み込みが繰り返される原因は、2つの <iframe> です。これを取り去って検証してみた結果、読み込みスピードは早くなりました。ランキングの関係もあるでしょうから、この事についてはこれ以上言いませんが ・・・。

>>55
さるさんの検証用のブログに関しては、サイドカラムのアバターと占いのプラグインを外して、確認をおこなって下さい。あの占いのプラグインはヘタするとズ〜と読み込みを続けますから。

ここまできたら、最後までお付き合いしますから、頑張って成功させましょうね (^^) きっと単純な問題だと思います。単純すぎて気づかないだけだと思います。

私の方では、さるさんのブログ HTML をこちらのローカルにダウンロードさせて、何度も動作しているのを確認していますから。
57. Posted by さる   2006年08月14日 07:13
うれしい言葉、ありがとうございます><
<iframe>も消してみました!

早速Light Box Plusを検証用のブログに設定しました。
同じく、通常表示のようです。

また帰ってきてから、挑戦してみます。
お手数かけて申し訳ありません・・・。
58. Posted by AQ   2006年08月14日 10:38
> さるさん
>>57
現在、検証用のブログにはスクリプトの呼び出しタグが設置されていなかったので、私のタグを貼り付けて確認しました。問題なく動作しています。確認の為に私のスクリプトを読み込んでみていただけますか [?]


http://blog.pekebatu.com/lightbox_plus/lightbox_plus.js

・・・ です。これで問題なく動作すれば、設置における " 環境 " は問題が無い事になります。つまり、あとはスクリプト自体の不具合を考えれば済む事になりますね。

外してしまった <iframe> などは、それらの設置が終わった後に元に戻せば良いと思います。それで、動作がおかしくないのを確認すれば無事に終了〜 ・・・ といけば良いのですが (^_^;)
59. Posted by AQ   2006年08月14日 11:04
> さるさん
追加でしてもらいたい事なんですが、</body> の位置を末尾の</html> の真上に設置していただけますか。現在、下部に移動させたヘッダー広告のタグの <a name="top"></a> の上にあります。

これは、W3C の DOC 宣言にそぐわない HTML の位置なので。
関係ないかもしれませんが、考えられる部分は一応と思います。
60. Posted by さる   2006年08月14日 18:06
AQさん!表示できるようになりました><
うれしいです><
が・・・

AQさんのスクリプトを貼り付けての動作成功です。

どうやら、私のlightbox_plus.jsのアップロード方法が悪いようです。

EUCの問題なのか、はたまた、アップロードした無料サーバ
(忍者ツールズ)に問題があるのか・・・

とりあえず、通常のブログの方にも挑戦してみたいと思います。

私なんかのために、時間を割いてくれて、本当にありがとうございますTT

通常のブログの方もAQさんのスクリプトで成功しましたら
報告にきます><
61. Posted by さる   2006年08月14日 19:14
AQさん、通常ブログの方もAQさんのスクリプトで成功いたしました。

ですが今、AQさんのスクリプトをダウンロードし
そのまま私の無料サーバ(忍者ツールズ)にアップし
設定をしましたが無理でした。

[a]http://monkey182.gozaru.jp/lightbox_plus/lightbox_plus.js[txt]『 スクリプトアドレス 』[/txt][/a]

"lightbox_plus.js"とそれを読み込むhtmlファイルと画像が全て同じディレクトリに置かれることが前提という事は、やはり
ライブドアのサーバにlightbox_plus.jsをアップしなければ
ならないのでしょうか?

私、PROではなく、無料の方なので、アップロード出来ないのです。

もしくは、やはり私のアップロード方法が悪いのでしょうか><
ゴールは目の前なのに・・・><
どうか、アドバイスよろしくお願いいたしますTT
62. Posted by さる   2006年08月14日 19:21
あれれ・・・ 上の [a]http://monkey182.gozaru.jp/lightbox_plus/lightbox_plus.js[txt]『 スクリプトアドレス 』[/txt][/a]
をクリックすると404になってしまいますね・・・

やはりアップロードの方法が間違っているのかもしれません><
ちょっと、いろいろ試してみます!
63. Posted by さる   2006年08月14日 21:17
AQさん!できました!

原因が分かりました><
どうやら、無料サーバ(忍者ツールズ)にアップロード自体は出来るのですが
パーテションか何かの問題で、JSがうまく起動してくれなかったようです。

という事で、JS起動できアップ出来るFC2ブログを借りて
アップロードしたら表示できるようになりました><

ついでに、2,0を入れてみました!
倍ぐらいデータが多かったですが、基本が同じだったので
無事動作確認できました><
64. Posted by さる   2006年08月14日 21:18
すごく難しかったです><
AQさんがいなかったら、完全に無理でした><

どう感謝を言っていいのか、分かりません・・・
本当にありがとうございます!

感謝の気持ちというのも、ちょっと違うかもしれませんが
うちのブログにLINK、そして記事にてAQさんのこのブログの
紹介をしてもよろしいでしょうか?

イラストを描く方やライブドアブログの方が、来てくれているので
この画像の表示、またはライブドアブログカスタムには、
みなさん興味があると思うのです。
だからと言って「AQさんに聞いてみて!」という発言や、
記事にはしないので、ご安心ください。
お忙しいのに、大変になってしまいますから・・・^^;

よろしいでしょうか><?
65. Posted by AQ   2006年08月14日 23:45
> さるさん
>>60
>>61
>>62
>>63
>>64
ありゃ〜 出かけている間に、大変やったみたいですね (・・;)
でも、おめでとうございます ヽ(^。^)ノ
苦労して設置できたものは、喜びもひとしおでしょう。

それにしても最終的には、2.0 ですか (^_^;) うらやましいです。
ボクの所は 2.0 は動作不良おこすので、設置できなくて ・・・ 個別記事なんかに入れている大量のスクリプトと干渉するんですよね ^^;

さるさんのところなんかは、2.0 のほうが良いかもしれませんね。ブログのカテゴリから考えたらピッタシです。

でも ・・・
原因がスクリプトをアップしているサーバーにあったとは (+_+) 実はそんな気もしつつ、" まさかなぁ〜 " という固定観念にとらわれていました。私も勉強させて頂きました (^_^;)

[blockquote]うちのブログにLINK、そして記事にてAQさんの
このブログの紹介をしてもよろしいでしょうか?[/blockquote]
記事の中ではもうご紹介して頂いているみたいで、ありがとうございます。宣伝していただける事に拒否は致しません。感謝いたします。どうぞ、宜しくお願い致します [フリフリ]
66. Posted by monkey182   2006年08月14日 23:52
おかえりなさいまし!

いえいえとんでもございません><
AQさんにアドバイスをいただけなかったら
今回の問題点も気づきませんでしたよ!

本当に感謝しています!

今度からは、AQさんの通常の記事にコメントさせていただきます^^!

今後とも、どうぞよろしくお願いいたします><[フリフリ]
67. Posted by AQ   2006年08月15日 00:19
> あれっ? monkey182 さん
>>66
再度、おめでとうございます (^^)

[blockquote]今度からは、AQさんの通常の記事に
コメントさせていただきます^^![/blockquote]
はは (^^) そうですね、ここのページがものすごく
重くなっているような気がします。ww

こちらこそ、宜しくお願い致します m(_ _)m
68. Posted by ましまろ   2006年08月15日 11:20
Lightbox Js v.2.02 をダウンロードしたんですが、Zipファイルが解凍された時に、overlay.pngだけが、ないのですが、どうしたらいいのでしょうか?

Lightboxのホームページもみましたが、ダウンロードは1箇所だけですねぇ。。
69. Posted by ましまろ   2006年08月15日 11:50
V2.02には、AQさんが、初めに指定されている、

[blockquote]// If you would like to use a custom loading image or close button reference them in the next two lines.
var loadingImage = 'loading.gif';
var closeButton = 'close.gif';[/blockquote]
は、見当たりませんでした。

その代わり、(上の方にありました)

[blockquote]Configuration
//
var fileLoadingImage = "[strong]images/loading.gif[/strong]";
var fileBottomNavCloseImage = [strong]"images/closelabel.gif"[/strong][/blockquote]
がありました。ここの、太文字の部分に、アップロードしたURLをいれればいいですか?多分似たような意味なので、ここだと思うのですが。全く同じ文章はありませんでした。やっぱり、バージョンが違うからですよね。

それから、overlayについても、Jsの中盤ぐらいにその文字を沢山見つけました。う〜ん、なぜわたしのZipには、入ってないのでしょう。。
70. Posted by AQ   2006年08月15日 12:59
> ましまろさん
>>68
>>69
ごめん [汗汗] AQ の仕事はお盆休みないので、
それらについてのレスは、夜になります。
お待ち頂けますようお願いします。[汗タラー]
71. Posted by 万年床生活者   2006年08月15日 13:44
>>70
[strong]チャンピオン、毎日ごくろうさまです(゚◇゚)ゞ[/strong]
と言いつつ...
「あの…私も相談があるんですが・・・」って言ったら
さすがにブチ切れますか??[叫び]
72. Posted by ましまろ   2006年08月15日 16:11
お暇な時で、いいですよ

カスタマイズで、ちょっと、ぐちゃっとしてしまって、そのあと、その前のものをコピーペーストしたんですが、元に戻らず、TOPページの下側の画像が、上の方に来ているという現象が起き、ためしに、全くカスタマイズされてない、同じデザインを選んで、全再構築しましたが、それでも、直っていないので、ライブドアカスタマーサービスに、報告しました。

どうなってるんでしょうね〜。
その前のものは、全て、コピーして、後は貼るだけなので、良いんですが。。よく分かりません。

お仕事ご苦労様です。
73. Posted by AQ   2006年08月15日 21:56
> ましまろさん
>>68
[blockquote]zip ファイルが解凍された時に、overlay.png だけが、
ないのですが、どうしたらいいのでしょうか?[/blockquote]
2.0 のバージョンは、無くて良いのです。
ましまろさんだけじゃなくて、みんな同じです (^_^;)

>>69
[blockquote]やっぱり、バージョンが違うからですよね。[/blockquote]
そのとおりです。この記事の説明は Light Box Js の説明であって、Light Box Js v2.0 の説明はしておりません。基本は同じですので、応用さえできれば設置に大差はありませんが ・・・。

[blockquote]Configuration
//
var fileLoadingImage = "[strong]images/loading.gif[/strong]";
var fileBottomNavCloseImage = "[strong]images/closelabel.gif[/strong]"[/blockquote]
そうです。この部分に絶対 URL を入れれば OK ですが、必ずこの [strong]images[/strong] のフォルダーごと、サーバーにアップして下さいね。

>>72
現在ライブドアのサーバーに、また不具合が発生しているみたいですね。コメントのレス返すだけでも精一杯です。[汗汗]

単純に再構築をかけただけでテンプレートデザインが崩れるみたいです。落ち着くまではカスタマイズなどおこなわず、何も触らない方が良いと思います。(^_^;)
74. Posted by AQ   2006年08月15日 22:10
> M床さん
>>71
[blockquote]「 あの … 私も相談があるんですが ・・・ 」 って言ったら[/blockquote]
全然かまいませんよ (^^) 時間さえいただけたら。ww

コメント欄に表示される、やり取りだけじゃ無いですからね。
実は、メールでもバンバン来てます (^_^;)

(;゚д゚)アッ.... でも下ネタ系ならフレパメールでお願いします ww
75. Posted by monkey182   2006年08月15日 23:07
私も、ブログのデザインが崩れました!ビックリ。
完全にLightbox Jsのせいにしてしまっていましたw

ライブドアの方の障害だったんですね・・・

ブログ直すためにいろいろいじっていて、イラストも描けず。

早くAQさんの↑のコメント見とけばよかった><w
76. Posted by AQ   2006年08月15日 23:18
> monkey182 さん
>>75
[blockquote]私も、ブログのデザインが崩れました!ビックリ。
完全にLightbox Jsのせいにしてしまっていましたw[/blockquote]
はは (^_^;) 気持ちはわかる ww
タイミングがそういうタイミングでしたもんね [ギョロ目]

こういう時に結構みんな、CSS や HTML を直したり、記事の中の画像をやり変えたりと色々やってしまうみたいです。

ボクはいつも自意識過剰なんで、『 絶対、自分のせいじゃない! 』 って思って、そういう時はブログ閉じちゃいます [アイタ]
77. Posted by ましまろ   2006年08月26日 11:19
ライトボックスを入れてみました。一番ベーシックなやつです。

が。。画像は出てくるのですが、OverlayとLoadingが動いていないようです。Coseは、動いているようなんですが。

CSSとJSを確認しましたが、特に問題は、なさそうなのですが。。

どこかで、又へんなことをしているのでしょうか?
78. Posted by AQ   2006年08月27日 16:49
> ましまろ さん
>>77
確認しました。Light Box を設置しているのはトップページだけですよね。トップページに関してはローディングの画像も出ていました。 ( この画像は一番初めにしか出てきません。一度表示されると、後はキャッシュが働いて表示されないんです )

気になるのは CSS の最後の記述の部分。

[blockquote]filter: progidDXImageTransform.Microsoft.AlphaImage
Loader(src='http://image.blog.livedoor.jp/
violetkisaki/imgs/2/5/25f7626c.png',
sizingMethod="scale");[/blockquote]
png 画像へのリンク URL を記述する部分ですが、なぜかシングルクォーテンション 「 ' 」 で囲まれていますが、あの部分はダブルクォーテンション 「 " 」 で囲まなければなりません。

そこを修正してみて下さい。それで、綺麗に表示されなければ、LightBox のスクリプトと、ましまろさんが他に設置しているスクリプトの相性が合わないことになります。Light Box Plus に変更して下さい。

それと CSS の中にツリー化の指示がなされていますが、ところどころに <style type="text/css"> <style> </style> などの記述が目に入ります。これらの記述は通常 HTML の中にするもので、CSS の中に記述するのは間違いです。

ブラウザーの種類によっては、誤作動するもとですので、修正しておいて下さい。その部分を削除するだけで OK です。
79. Posted by ましまろ   2006年08月28日 20:39
そうですね、Style等は、削除して、”に変更してみて、写真にグレー色の、外枠は出ましたが、黒いシャドウはでませんでした。

やっぱり、Scriptが合わないのかもしれませんね。

今度Plusのほうをやって見ます!
80. Posted by AQ   2006年08月28日 21:13
> ましまろ さん
>>79
上のコメントでは、全角の 『 ” 』 になってるんで、
まさか? と思い確認しましたが、CSS のほうは正しく
半角の 『 " 』 になっていますね。・・・ 多分。

Light Box Plus に変更なさる方が解決は早いかも知れません。
81. Posted by ruru   2006年11月30日 07:02
おはようございます。
トラックバックさせていただきました。
(*- -)(*_ _)ペコリ

はじめてでしたので、やり方が、わかんなくって ・・・
(;^_^A アセアセ・・・
82. Posted by AQ   2006年11月30日 12:28
> ruru さん
>>81
ちゃんと無事に届いて良かったですね (^^)
昨日の夜は、ライブドアのサーバーがおかしくて
コメントなんかも、なかなか入んなかった [ガビン]
83. Posted by ruru   2006年11月30日 21:43
>AQさん
>>82
やっぱりですか!? おかしいと思ってたんです。 カスタマイズをして
再構築しても、全く反映されなくて。 何度やってもダメでした。
コメントも何度 入れてもダメで・・・。で、時間が経ってから見ると
同じコメントが、ずら〜っと・・・。 (;^_^A アセアセ・・・
自分のブログで良かった。 あははww

記事は、Lightbox に内容を変えました。 [ニコ]
そのほうが良いと思いまして。 (*゚ー゚)(*。_。)ウンウン♪
84. Posted by ruru   2006年11月30日 21:53
追記
あの・・・。 コメント78ですが、Firefox と Opera で見ますと
はみ出てます。 ruru のPC がおかしいのかな?
そう見えるのは、私だけかしら?
85. Posted by AQ   2006年12月01日 02:18
> ruru さん
>>83
>>84
今日もなんかサーバーの調子が悪いみたいだね (+_+)
コメント 78 の CSS の表記でしょ。
Firefox なんかは、英語の連続表記をすると、
コメント欄をはみ出すんだよね〜 [汗汗]

よく注意して、その都度ブラウザーを変えて
見なきゃいけないね。( じゃまくさい ^^; )
86. Posted by 万年床生活者   2006年12月01日 06:26
[strong]"word-break is an unknown property"[/strong]
ってやつですか...[?][汗タラー]

全然違ったりして...[汗汗]
87. Posted by 万年床生活者   2006年12月01日 16:18
>>86
全然違いました(> <)わたしゃ一体何言ってんでしょうね(^_^;)
ところで 「 word-wrap: break-word; 」は
IE でしか効かないようですが
長い英単語がコメント欄からはみ出してしまうのはAQさんでもどうしようもない事なのでしょうか…?
88. Posted by AQ   2006年12月02日 09:08
> M床さん
>>86
>>87
[blockquote]長い英単語がコメント欄からはみ出してしまうのは
AQ さんでもどうしようもない事なのでしょうか…?[/blockquote]
いや、今まであまり気にしてなかったって言うか、それをどうにかする必要性を感じていなかったというのが本音で (^_^;)

コメント数があまり多くないサイトなので、気がついたら管理画面内で、そのつど修正すりゃ良いか〜 みたいな ww

でも、言われちゃうと気になりまする〜 (*-゛-) ウーン・・・
方法が何か無いか、調べてみます。ヽ(^。^)ノ
89. Posted by ruru   2006年12月06日 00:17
トラックバックを いただいていたのを、さっき気づきました。
ありがとうございます。(*- -)(*_ _)ペコリ

なぜ、反映されないのでしょう?
受信設定を「受け入れる」にしてあるのですが・・・。

「トラックバック管理」を見ると「下書き」になってました。 なぜ???
2度も送っていただいてたんですね。すみません。

今は、反映されてます。
90. Posted by AQ   2006年12月06日 05:57
> ruru さん
>>89
あ〜 最新の記事に書いてた TB ってこの事かっ。

『 コメント受信時の状態 』 の設定が、
" 下書きにしておく " になってるんじゃないの [?]
91. Posted by ruru   2006年12月06日 06:03
>AQさん
>>90
違いますよ。あれは、rutu さんへのコメントです。

[blockquote]『 コメント受信時の状態 』 の設定が、
" 下書きにしておく " になってるんじゃないの[/blockquote]
いいえ。受信設定を「受け入れる」にしてあったんです。
でも、なぜか「トラックバック管理」は「下書き」になってたんですよ。

意味不明です。 (*-゛-)ウーン・・
92. Posted by AQ   2006年12月06日 06:07
> ruru さん
>>91
(*-゛-) ウーン・・・
93. Posted by 万年床生活者   2006年12月06日 14:17
[strong](*-゛-) ウーン・・・[/strong]
94. Posted by ruru   2006年12月06日 20:44
[big][strong][span][style]color:#FF3300;[/style](*-゛-)ウーン・・[/span][/strong][/big]
95. Posted by AQ   2006年12月07日 00:28
>>93
>>94
もうええ!ちゅ〜ねん [汗汗]
96. Posted by 万年床生活者   2006年12月08日 08:50
>>95

[span][style]font-size:200%;[/style](o ̄∀ ̄)ノ”ぁぃ
97. Posted by AQ   2006年12月08日 13:42
> M床さん
>>96
うわ〜 スタイルの指定まで使ってきちゃった [汗汗]
やるなぁ〜 最近のM床さん〜 (^^)
この記事にコメントする
 :Name
 :Mail
 :URL
  情報を記憶:   書き込みのリセット: 
 
ご利用のブラウザ、設定ではご利用になれません。
 
  



Promotion
Mini BBS
Tag Click