Celtis-one テーマでの動画デモ(YouTube)

Celtis-oneテーマでの動画デモ(YouTube)

ルイス・アームストロングの「Hello Dolly」ライブパフォーマンス。

私は YouTube へ公開する動画を作成したことはありませんので、WordPress のテーマ開発時に使用するテストデータ中にあった動画のリンクをデモ用に使わせて頂いてます

テーマユニットテストWordPress Codex 日本語版

動画へのリンクは、この中で使われていたものですが、英語版のテーマユニットテストの動画とは違う動画が使用されていたので、日本語版を作成した方の好みでしょうか (^^)

ただ、いい感じの動画なので私も気に入ってます (^^)

また、この動画のリンクを貼っても問題ないのかというと、そのあたりはよくわかりませんが、問題あればリンクは解除します

WordPressへの動画埋め込み

WordPress の動画埋め込みについてはWordPress Codex 日本語版の該当ページをご覧ください。

埋め込む方法は、検索すれば沢山ヒットしますが、その動画へのリンクを貼るだけです

とっても簡単に出来てしまいます

動画のレスポンシブ対応

Celtis-one テーマは、素のままでは動画がレスポンシブになりませんので、celtispack プラグインをインストールして FitVids モジュールを有効化します

celtispack ダウンロードは、WordPress Plugin : Celtispack ページから行うことが出来ます

レスポンシブへの対応は、下記サイトの jQuery プログラムを使用させて頂いてます

Youtube, Vimeo 等の動画をレスポンシブ対応表示にしてくれます

FitVids.JS – A lightweight, easy-to-use jQuery plugin for fluid width

 

この画面をデスクトップで閲覧しているならばブラウザのサイズをいろいろ変えてみてください

動画がいい感じで拡大縮小してくれるはずです (^^)

スマートフォンから、タブレット、デスクトップまでそれぞれ最適なサイズで表示されます

また、Celtis-one テーマでは、ビデオフォーマットの投稿を表示する画面を設定によりサイドバーの有り無しが選択できるようになっています

デスクトップでサイドバー表示時には、最大幅は620ピクセルですが、全幅表示すると最大幅は960ピクセルという大きなサイズとなります

 


まとめ記事紹介

search star user home refresh tag chevron-left chevron-right exclamation-triangle calendar comment folder thumb-tack navicon angle-double-up angle-double-down angle-up angle-down quote-left googleplus facebook instagram twitter rss