続けてWordPressのカスタマイズをやっている。WordPressをスマホ対応にするプラグインのWPtouchにはiframeのタグとの不都合があるようだ。Youtube、Xvideos、xhamsterをはじめとする動画サイトのコードは、iframeを使っているのでどうもうまく表示されない。
どうなるかというと、スマホで見るとサイズオーバーしてる動画をWPtouchが縮小しようとするが、いったん縮小した動画をiframeのタグがふたたび元の大きさに戻してしまう。それをWPtouchがふたたび縮小しようとして……という動作を永遠にくりかえしてしまうようだ。
それで対策を調べてみると前のバージョンのWPtouchだと、『wptouch/themes/core/core.js』というのをエディットすると治ったようだが、今のバージョンではこのファイルが存在しない。
WPtouchでYoutubeなどのiframeコードが本文に含まれる記事の表示が崩れてしまう場合の対処法 | gori.me
http://gori.me/wordpress/33097
それで困ったが、
iframe {
position: relative;
top: 0;
left: 0;
width: 100%;
}
というタグをCSSに入れると自動的に動画が100%になって上の症状がなくなるようだ。このタグは便利なので他にも使えそうだな。
参考サイト
youtube動画 スマホサイズ 自動調整
http://nagihiro.com/socialmedia/you_smaho/
そのほか、検索して調べて、ヘッダー下に画像RSSなどを表示できるようにカスタマイズして、これでスマホ対応はほぼ完成。
にほんブログ村←気に入ったら投票してください。