WPtouchの見出しにcssを適用させる
WPtouchにzenbackウィジェットを配置するついでに、見出しにCSSを適用してみました。
[WordPress] WPtouchにzenbackウィジェットを表示させる方法 | Time to live forever
これも前から放置していたものをようやく…という感じです(・_・;)
WPtouchの設定
WordPressの管理画面から [設定] – [WPtouch] を開きます。WPtouchの設定画面の「Advertising, Stats & Custom Code」の「Stats & Custom Code」にCSS定義を追加しましょう。
「Stats & Custom Code」にCSSを定義
ここにはHTMLのコードを書きます。
枠内に以下のような形式で、適用したいCSSを記述します。
ちなみにウチのブログでは以下のように記述しています。
6 | border-left:10px solid #3cf; |
12 | -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.3); |
13 | -moz-box-shadow: 2px 2px 6px rgba(0,0,0,0.3); |
14 | box-shadow: 2px 2px 6px rgba(0,0,0,0.3); |
18 | border-left:8px solid #3cf; |
19 | border-bottom:1px solid #3cf; |
29 | border-left:5px solid #3CF; |
CSSの定義を記述したら、設定を保存します。
iPhoneで確認
先ほど定義したCSSが適用されているか、iPhoneで確認してみましょう。
見出しにCSSが適用された
良い感じですね。
参考
WordPressプラグイン「WPtouch」の見出し表示を変更する方法。 | オレっち.com
コメント