Stinger3子テーマ「Stinger-minimum」のスマホテーマ対応をしました!

カテゴリー:WordPress    |    タグ:

Stinger3子テーマ「Stinger-minimum」のスマホテーマ対応をしました!
今回このスマホ用「Stinger-minimum」を作りました。 子テーマ「Stinger-minimum」っぽく仕上げられたかな?と思います。 informationこの記事でのカスタマイズバージョン:stinger3ver20131217

出来上がりの図

トップの状態の図です。 アイキャッチ150x150を想定していますが、もし大きくできるなら横幅いっぱいにして大きく表示させるといいかもしれません。 Test_WordPress

アイキャッチのサイズを変更したバージョン

アイキャッチを小さくしてタイトルを横に持ってきたバージョンです。ただこれだとタイトルが長い場合、回り込み解除をするとなんだかブサイクな感じになるのでどうかなと思ってしていません。タイトルが画像下に回り込んでもそんなことは気にならない方へ Test_WordPress-s

スマホテーマのCSSを適用しよう!

こちらは子テーマを使用されている方向けです。 スマホテーマの適用方法です。とっても簡単にできます。 親テーマ(今回なら「stinger3ver20131217」)のheader.phpを変更します。 こちら<!---css切り替え--->の5行目のところを 下記のように書き換えます。 あとは、スマホ用のCSSファイルを子テーマフォルダに入れるだけで適用されます。

スマホ用のCSSファイルダウンロード

今回2つファイルを用意しました。差分がわかるようにコメントアウトしているファイルと必要のないところは消しているファイルです。 最終使用されるときはコメントアウトのところは消して使ってください。消さないで使用されるとたくさん読み込みを行ってしまうので、表示速度に影響がでるかもしれません。 以下からダウンロードしてください。

差分がわかるCSS

コメントアウトした下に今回作成している要素が書いてあります。ほんとうに少しですが、コメントも入れておきました。 smart-diff.zip

差分のないCSS

このまま使用できます。 smart-nondiff.zip

アイキャッチが小さいCSS(差分あり)

アイキャッチ画像のサイズを80x80に設定しています。 smart-diff-smallimage.zip

まとめ

今回作成していて、自身のブログは構造といいますか、元のphpファイルをゴニョゴニョ…としているので大きく変更することができるのですが、Stinger-minimumは構造を大きく変更することなくデザインのみなので結構制限ができてしまいスマホ用テーマはなかなか手ごわいなぁと感じました。 なにかのお役にたてれば幸いです。

ADVERTISEMENT

  • Pocket
  • このエントリーをはてなブックマークに追加

published:2014/04/12    Written by:
カテゴリー:WordPress,      タグ:

最後まで読んでくれた方へ。

閲覧頂きありがとうございました!
お気に召しましたら是非RSS登録やフォローをお願いします!

Twitter

関連記事

memo

【Stinger3カスタマイズ】バージョンアップしたのでこのブログで変更したところを書き留めておく備忘録 #3

つい最近デザインを変更してみたのですが、どうにもノリノリでかけなくなってしまったのでまたデザインを元

記事を読む

Wordpress1

カスタムフィールドを使って記事下にまとめや今日の一言などいろいろと表示させてみよう!

前回このような記事 ブログの記事下に自分のプロフィールとRSS購読ボタンを設置する を書いたのですが

記事を読む

h2-i

ブログの悩みどころ見出しデザイン(h2)をすこし考えてみました。

ブログをやっていて見出しデザインというのは、結構悩みどころだと思います。 現在はとってもシンプルに

記事を読む

image

少しの手間をかけて抜粋部分を表示する。だってそれは読んでほしいから!

この抜粋部分に意図しないものが入ってしまい読んでほしいブログが残念な感じにならないように。 抜粋は

記事を読む

twitter1

【WordPress】TwitterCards(ツイッターカード)に対応する方法

先日、Twitterを始めたので、TwitterCards(ツイッターカード)にも対応。ということで

記事を読む

コメントを残す

3件のトラックバック

ADVERTISEMENT
nijisan

Written by niji_sansan

生まれ落ちた地は神戸。
鉄成分入ってるものに興味あり!
キイロイトリが好き!
感動すると「ほぅ」と言いますw

  • 2016年9月
    « 12月    
     1234
    567891011
    12131415161718
    19202122232425
    2627282930  
電子書籍ストア BookLive!
PAGE TOP ↑