人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

はてなブログの既存テーマ(レスポンシブテーマ非対応のもの)をレスポンシブテーマに対応させたい

はてなブログを使用しているのですが、この度レスポンシブテーマにしようと思い、いろいろ試行錯誤しています。
テーマを変更するのも考えましたが、データ消去されるのも考えたので今使用しているデザインをレスポンシブテーマにしようと考えているのですが、うまくいきません。テーマはPink Pharmacyを使用しています。
具体的にCSSを追加すればよいのか、はたまた土台テーマからレスポンシブテーマに当たるHTMLを持ってくればよいのかわからないです。解説をお願いします。

●質問者: なぎうさ
●カテゴリ:はてなの使い方 ウェブ制作
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● ぽけっとしすてむ
●50ポイント

既存のテーマをレスポンシブデザインに変更するには、CSSを追加する方法を用います。(HTMLは基本的に変更しません。)
いくつかの画面サイズを想定して3?6パターンの設定を作っていく事で実現できますが、小さい表示のものから作る方が比較的簡単に仕上げる事ができるため、既存のものを変更する際には多少の頑張りが必要になります。


2 ● kaoato
●50ポイント

>うまくいきません。

当然の結果だと思います。


Pink Pharmacy - テーマ ストア
http://blog.hatena.ne.jp/-/store/theme/12921228815712830659

既存のテーマーにCSS追加して、レスポンシブにするのは、かなり厳しいと思います。
レスポンシブ前提で作れらてないからですね。

邪魔なCSSを打ち消すようなCSSを追加していってみたいな感じになるし、そもそも構造的に無理とか言うのがありそうなので・・・。


ということで逆の路線の方がまだ簡単です。

レスポンシブ対応している、レイアウトが似ているものに、CSSを追加して
Pink Pharmacy風にしていますという方法です。こちらの方が難易度は低いです。


公式のレスポンシブデザインのテーマ

・Evergreen
・Journal-Pink
・B!KUMA
・Reach
・Terminal <=これ

レイアウトが一緒なのは最後当たりなのですが、
予想では厳しそう。



非公式のレスポンシブデザイン

Blank - テーマ ストア
http://blog.hatena.ne.jp/-/store/theme/8454420450091363061


たとえばカスタマイズ前提のスケルトン状態のテーマを使うとCSS追加でそれらしくなるかもと思います。

Pink Pharmacyらしさって、
タイトルの部分、記事タイトルなどの装飾だと思うので、その部分のCSSをコピペして
追加していくだけで、それっぽくなるのでは?

関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ