日刊すぎタイム

ユーチューブにアップした動画をワードプレスで作成したサイトに貼ることは以前からしていました。

貼る方法は、ググれば沢山出てくるのでやり方は省略します。
私が運営するサイトのアクセスを解析したところ、スマホが半数以上になったので
ＰＣサイトよりも、スマホサイトに重点を置いていきたい。と思いました。

そこで、ワードプレスのプラグインをいくつか試した結果、wptouchが良かったのでインストールして使い始めたのです。

先日、「スマホでは動画がきちんと表示されているのか？」気になってみると。。。

ちょっと。。。

かろうじて再生ボタンは押せますし、動画は別画面が立ち上げるので見るのも問題ありませんが、この中途半端な感じはとても嫌。

リサイズされていません。
何でかなぁ、と調べてみると、原因が判明

埋め込みコードを貼ると上手く表示されないようです。
「この動画を共有」をクリックして表示されるＵＲＬを貼るだけでＯＫ

上手く表示されました。
やれやれ、と思ってふとＰＣページを見ると、、、

は、はみ出しとる！
スタイルシートで、マージン、パディングを変更するも効果なし。
本当はスタイルシートを全部見直せば原因が分かるかもしれませんが、そんなに気が長くないので、解決方法を検索。

すると、divタグを使った簡単な方法を発見
http://kachibito.net/wordpress/youtube-tips.html
というサイトです。

中段の.mediasという部分です。
これを使ったところ、

キッチリ直りました♪
もちろんスマホも問題なしです。