レスポンシヴ
こんにちは、あなたのトリコ、あなたもトリコ、白鳥です。
WordPressのテーマを更新しました。パソコンからだとあまり変わっていないかと思うのですが、スマホからはだいぶ見やすくなったと思います。
サイトと同じ要領でレスポンシヴにしようと思ったのですが、いや～甘かったですね！ CSSで横幅680px以下のときは以下のスタイルに～みたいにしたかったのにぜんぜん反映されないの。
なんでーなんでだーって独りごちながら作業していたんですけれども、ググりにググって‥‥見つけましたよ。
「条件分岐してモバイルからの閲覧には違うCSSを当てるようにすればいい」
なるほど。目からうろこ！
WordPressはPHPなのでそういうことができるようです。PHPだからというのは違うかもしれないけどとりあえずそう理解しました！
というわけで早速紹介されていたコードを使い、モバイルはAのCSS、それ以外はBのCSS、というふうにしました。すっきり！
しかもWordpressだとスタイルシートを読み込むのがheader.phpだけなので、その一ページだけ直せばいい‥‥楽ちん‥‥天才‥‥！
そしてありがたくもGoogleアドセンスのプログラムに参加できることになりました。が、デザインの都合でモバイルのほうはサイドバーの広告を撤去。自動広告と併用するとモバイルのほうは鬼のように広告が出てしまってですね‥‥記事本文には出ないんだけど、記事一覧がもうなんかすごい。調べたら多少調整できるっぽいからもう少しなんとかしたい。なぜならわたしが押し間違えそうだから！
とはいえ自動広告のほうがすっきりしたいい感じの広告をつけてくれるので、そちらを優先することにしました。自動広告すごくない？
でも自動広告、PCのほうだとあんまり出てこないんですよね～なんでだろ。というわけでPCからはサイドバーにも出るよ！ これも条件分岐です！
あんなに悩んでいたのが嘘みたい。条件分岐、めちゃくちゃ使えるじゃん～楽しい！
▽参加してます▽
