目次ショートコードで動画を貼るカスタムフィールドで管理するz-indexが自動で効くようにしてあげるレスポンシブWebデザインに対応させるYoutubeのサムネイルを取得する管理画面で固定の動画を管理するTubePressなんとなく情報が少ない気がするので試しに書いてみます。WordPressで運営しているサイトでYoutubeをよく貼るようなことが多いならちょっとお得、というか管理が楽になるかも知れないTipsをいくつかご紹介。自分でも動画を使うサイトには取り入れたいカスタマイズです。Youtubeをよくはってるサイトやブログを良く見かけますので少しでも効率が良くなればなぁと思ってTipsをいくつか書いてみました。コードばかりで何があるか分かりくいですが内容は以下になります。ショートコードで動画を貼るカスタムフィールドで管理するz-indexが自動で効くようにしてあげるレスポンシブWebデザインに対応させるYoutubeのサムネイルを取得する管理画面で固定の動画を管理するショートコードで動画一覧をドバッと出せるプラグイン・TubePressショートコードで動画を貼るショートコードでYoutubeを手軽に貼れる様にします。"youtube");ショートコードは以下のように指定します。value="rTUwqxHpXMY"]ID入れるだけ。value="rTUwqxHpXMY"]のようにすれば指定されますが未入力ならデフォルト値が使われます。カスタムフィールドで管理する動画ばっかりのサイトならカスタムフィールドで管理しちゃったほうが楽です。?>上記コードをsingle.phpなどに埋め込んで記事投稿時にカスタムフィールドの名前の部分にYTid、IDにYoutubeのIDを入れれば動画を簡単に実装できます。条件分岐を使っているのでカスタムフィールドを使わなければ表示されません。この場合、テンプレートファイルに貼ることになるので場所は固定されます。サイズなどはレイアウトに応じて変更してください。z-indexが自動で効くようにしてあげる少し前にYoutubeにz-indexが効かないのを効くようにする方法を書きました。重複しますが・・Youtube(というか、embedを使った動画全般)には通常z-indexが効きません。fixed;とかでご経験されてる方も多いかと思いますが、この場合は?wmode=transparentというパラメーターを付ければz-indexを適応できます。WordPressのようなブログサイトで毎回手動で入れるのは面倒なのでjQueryで自動挿入します。$(this).attr('src',$(this).attr('src')+'?wmode=transparent');})コードはiframe全般にしているのでサイトに応じて工夫してみてください。再生ボタンで確認できます。灰色の部分にz-indexが指定されています。Queriesを使って様々なデバイスに対応させるレスポンシブWebデザインに動画を対応させるには以下のようにしてあげます。動画をdivで囲みます。;としても、縦が自動調整されないので、アスペクト比を保つためにはdiv等で囲ってあげる必要があります。Queriesで親要素の幅かなんかをゴニョゴニョすればいいんですが、これもいちいちiframeを手動でdivで囲うのは面倒なので自動的に囲ってあげます。class='medias'></div>");管理が楽なのでこうしてますけどもっとスマートな方法あると思います。(動作確認はresponsivepxをご利用下さい)Youtubeのサムネイルを取得する動画のサムネイルが欲しいときはありませんか?いちいちキャプチャ撮るのは面倒です。以下のコードで手軽に取得出来ますよ。/></div><p>ボックスの中にYoutubeのIDを入力して下さい。あかい文字の場所がIDです。';}で、サムネイルを表示させたい場所(ループ内)に以下のコードを含めます。?>サイズは調整してください。metabox管理画面で固定の動画を管理するWP-Tubularで使った方法を使います。以下のコードでsettings.phpというファイルを作り、テーマファイルの中に含めてあげてください。$$var;}?>さらに、functions.phpに以下のコードを追記してsetting.phpをincludeします。$settings[$key];}これでテーマに以下のようなオプション機能が加わりました。あとは、サイドバーやTOPページのスライドとかで見かけるような場所に動画を貼れば管理画面で動画を変更できるようになります。allowfullscreen></iframe>dp_settings(“youtube”)に、管理画面でセットしたYoutubeのIDが入る、という仕組みです。実際にこの方法でYoutubeを管理するのは実はあまり意味が無いのですが、この方法を覚えておくと他にもいろいろと応用できるので挙げてみました。TubePress以前ご紹介したプラグインです。ショートコード貼るだけで、Youtubeの検索結果をドバッとページングつきで出してくれるプラグイン。一度お試しいただきたいです。TubePress以上、Youtubeを使うなら知っておくと得っぽいTipsでした。書いておいてアレですけどあんまり需要無さそうですねw他にもいろいろあるんですが、多くの場合はプラグインでどうにかなる気がします。新バージョン、WordPress3.4...WordPress全てのWordPress使いが導入を検討すべき15のプラグイン今日も飽きずにWordPressネタです。"http://kachibito.net/wp-content/plugins/syntaxhighlighter/syntaxhighlighter3/scripts/shCore.js-end");/*]]>*/タイトルとURLをコピーしました。