ども。HTMLやらCSSやら独学で勉強するもやはり、ちんぷんかんぷん意味不明、ヘ(゚д゚)ノ ナニコレ? なオレっち(@yashiki55)です。
しかし!そこは何とか頑張って、ググってググってググりまくって、独学の意地を発揮しとるワケですが、今回も素人なりにWPtouchの見出し表示の変更に成功しました。ε- (´ー`*)フッ
WPtouchはブログサイトをiPhoneやスマートフォン用に最適表示してくれる便利なWordPressプラグイン。
なのに!なのにデフォルトの見出し表示が気に入らない。( ゚д゚ )クワッ!!
パソコンではWordPressのstyle.cssをイジってブログのデザインを作っているのに、せっかくWPtouchでスマートフォンに最適表示をしても、iPhoneで見たらWPtouchのstyle.cssを読み込んでるらしいのです。
ファイル名は同じstyle.cssだとしても、当然違うモノを使ってるワケですねん。ヽ(´Д`;)ノアゥ…←当たり前
ゆえにWPtouchのデザインがみんな同じデフォルトのカッコわるいヤツになっちまうんです。特に見出し表示のデザインがダサいんです。ただ太字になってるだけですよ?(´・д・`)コレ、ヤダ
パソコンで見ると↓
これをiPhoneで見てみると↓
やはりコレ、なんとかしたいですね。( 」゚Д゚)」ヤルゾ!
汗水流して来る日も来る日もググった結果、参考にしたのはコチラのサラリーマンプラスさんの記事でした。
(ΦωΦ)フフフ…←実はすぐに見つけた。
ブログ/サイトをスマートフォン対応するWordPressプラグイン「WPtouch」の設定方法 | サラリーマンプラス
WPtouchの設定画面からCSS定義を追加します
WordPressの管理画面から入って、設定 > WPtouch > Advertising,Stats & Custom Code にCSS定義を追加しましょう。
これ、実際にはココへCSS定義を入力するってことは、「この部分に関してはWPtouchのstyle.cssじゃなくて、この定義を参照するんですよ〜」ってことになるみたいですね。
なので、次のように記述するとイイみたいです。
<style type=”text/css”>○○○○</style>
○○○○のところは、WordPressのstyle.cssで自分が指定している見出しデザインのCSSを書いてあげるワケですね。
オレっちの場合は画像のように入力しました。
よければ画面一番下の「Save Optins」を押して保存しましょう。
さっそくiPhoneで見てみましょう。
できた!
デタ━━━━(゚∀゚)━━━━!!!!
なんか、いい気分です。
めでたし。めでたし。
v( ̄Д ̄)v イエイ
LEAVE A REPLY