- ベストアンサー
fc2blogでshadowboxを使用する方法
- fc2blogでshadowboxを導入する方法について参考ブログを見て試してみたが、動画がポップアップ表示されない問題が発生。
- 参考サイトを順に追っていくと、まずはjQueryとShadowbox jsをダウンロードし解凍。
- 次に、shadowbox cssをメモ帳で開き、6箇所をアップロード先のURLに書き換え。
- windowsweb
- お礼率80% (62/77)
- JavaScript
- 回答数4
- ありがとう数13
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
なぜ、ポップアップしないのか解った気がします。 あなたのページにはshadowbox.js本体だけしかないからです。 ユーチューブ再生には、他に players/shadowbox-flv.js players/shadowbox-swf.js ．．．． とか個別にプレーヤーのJSファイルが必要です。とりあえず 最新のshadowboxに直リンクを張って、ADOBEのswfプレーヤーを使いましょう。 <script type="text/javascript" src="http://www.shadowbox-js.com/build/shadowbox.js" charset="utf-8"></script> <script type="text/javascript" charset="utf-8"> <!-- Shadowbox.init({ language: 'ja', players: ['swf','flv'] }); // --> </script> 記事本体 <div> <a href="http://www.youtube.com/v/92KD9W0K_4c&fs=1&source=uds&autoplay=1" rel="shadowbox;width=320;height=240;title='浅田真央';player=swf">浅田真央</a></div>
その他の回答 (3)
- yyr446
- ベストアンサー率65% (870/1330)
わかりにくい回答で申し訳ない。 どうもおかしいと思い、ShdowBoxの本家サイトをよく見ると ここ↓ http://www.shadowbox-js.com/index.html つい最近、バージョンアップされて、本体JSとCSSが書き換わってた。 新しいバージョン(V3.03)は、ダウンロードしたZIPセットの中身を そのまま同じディレクトリーに配置しておくだけで、何もいじらなくても mimeタイプ毎に自動的にプレーヤーが切り替わるみたいだ。 （以前は、もっと細かくライブラリーが分かれていて、本体JSが動的に<script> タグを生成して動的に読み込んでいた。） ※でも、player=FLVを指定するとJWPLAYERが使われて、エラーが発生するみたいだ。 何か原因があるのかも．．．． 結論としては、下↓ http://www.shadowbox-js.com/download.html のページで、全部のチェックボックスにチェックを入れて、ZIPをダウンロードして解凍したファイルで、 ・Readme ・Licence を除く10個のファイルをそのまま、FC2ブログにアップロードする。－－－(1) テンプレート編集で、</head>の直前に <link rel="stylesheet" type="text/css" href="http://blog-imgs-34.fc2.com/y/o/n/※※※※/shadowbox.css" /> を書く----(2) （※※※※はあなたのアカウント） その後に <script type="text/javascript" src="http://blog-imgs-34.fc2.com/y/o/n/※※※※/jquery-142min.js" charset="utf-8"></script> //jQueryは必須じゃないはずですが．．． <script type="text/javascript" src="http://blog-imgs-34.fc2.com/y/o/n/※※※※/shadowbox.js" charset="utf-8"></script> <script type="text/javascript" charset="utf-8"> <!-- Shadowbox.init({ language: 'ja', players: ['swf','flv'] }); // --> </script> を書く－－－－(3) （※SCRIPTは<head>の中でなく、記事の中に書いてもよい） 本文記事に動画URLへのリンクを張る(player=swfとしていしておく） <div style="text-align: center;"><br /> <a href="http://www.youtube.com/v/92KD9W0K_4c&fs=1&source=uds&autoplay=1" rel="shadowbox;width=320;height=240;title='浅田真央';player=swf"> 浅田真央</a> </div> 別に浅田真央の動画を進める訳じゃないですが．．．． －－－－(4) 上記のやり方で、少なくとも私はできました。
お礼
yyr446さん回答有難う御座います。 <link rel="stylesheet" type="text/css" href="http://blog-imgs-34.fc2.com/y/o/n/※※※※/shadowbox.css" /> <script type="text/javascript" src="http://blog-imgs-34.fc2.com/y/o/n/※※※※/jquery-142min.js" charset="utf-8"></script> <script type="text/javascript" src="http://blog-imgs-34.fc2.com/y/o/n/※※※※/shadowbox.js" charset="utf-8"></script> <script type="text/javascript" charset="utf-8"> <!-- Shadowbox.init({ language: 'ja', players: ['swf','flv'] }); // --> </script> でもポップアップ表示することが出来ましたので、こちらに変更しておきました。 何度も回答して頂き、有難う御座いました。
- yyr446
- ベストアンサー率65% (870/1330)
<a rel="shadowbox;width=動画の幅;height=動画の高さ" title="動画のタイトル;player=flv" href="YouTubeの再生用URL" ><img src="サムネイル画像のＵＲＬ" width=サムネイルの大きさ border=0 </a> YouTubeの再生用URLとは、 :http://www.youtube.com/v/GrjgtS1t6aY&fs=1&source=uds&autoplay=1 みたいなやつで、'GrjgtS1t6aY'がYouTubeVideoのIDです。
お礼
yyr446さん何度も回答有難うございます。 http://www.youtube.com/v/GrjgtS1t6aY&fs=1&source=uds&autoplay=1のようなURLを使用して見ましたが、ポップアップ表示されませんでした。 <a rel="shadowbox" title="画像のタイトル" href="画像のＵＲＬ"> リンク名 </a>の画像の方も試して見ましたが、やはりポップアップ表示されなかったので、他に問題があるのかも知れません。 本当になんども回答して頂き申し訳ないです。
内容はわかりませんが。。とにかく。。 書き換えたshadowbox cssをfc2にアップロードして、テンプレートの編集で 〈/body〉の上に >>この部分ですが。。head内に移動させてください。 <head> <script type="text/javascript" src="http://○○○○/jquery-1-4-2-min.js"></script> <link rel="stylesheet" type="text/css" href="http://○○○○/shadowbox.css"> <script type="text/javascript" src="http://○○○○/shadowbox.js"> <script type="text/javascript">Shadowbox.init({language: 'ja',players: ['img', 'html', 'iframe', 'qt', 'wmp', 'swf', 'flv']}); </script> </head>
お礼
ken_tyanさん回答有難う御座います。 〈/body〉の上から</head>の上に張り替えて見ましたが、うまく作動致しませんでした。 他に問題があるかもしれないので、もう一度確認してもみようと思います。
お礼
yyr446さん回答有難う御座います。 <script type="http://○○○○/player.swf" charset="utf-8"></script> <script type="text/javascript" charset="utf-8"> <!-- Shadowbox.init({ language: 'ja', players: ['swf','flv'] }); // --> </script> を入れる事によって、ポップアップで表示するようになりました。 出来たときは、飛び上がって喜んでしまいました。 yyr446さんには本当に感謝しています。最後まで質問に回答をして頂き有難う御座いました。