もふりたい隊長

美女AIと猫ミーム動画をyoutubeやtictokにあげています

はてなブログのカスタマイズ方法①~レスポンシブデザイン~

f:id:marketzero:20161229030938j:plain

はじめに

はてなproに移行してから1か月が経ちました。

少し備忘録にもなりますが、ブログのカスタマイズについて自分なりに調べて実際にいじってみた事をまとめてみようと思います。

ブログを今やっている人や興味があってやってみようと思っている人も是非読んで頂ければと思います。

 

まず、レスポンシブデザインですが、無料版のはてなブログでは、スマホ用の画面がカスタマイズ出来ないなど、有料版(pro)に比べて使えない機能が数多くあります。

月々1,008円(2年契約で月600円)を払ってまでproに移行すべきかどうか迷いますね。

そこで今回は、無料で行える「レスポンシブデザイン」について解説します。

 

 

レスポンシブデザインって?

スマートフォンでもPCと同じデザイン設定でブログを表示します。レスポンシブデザインのテーマを設定しているときのみ使用してください。 

 

まずは「レスポンシブデザイン」対応のテーマを選択し、適用しましょう。

 

レスポンシブデザインに対応したテーマはこちらを参考にさせて頂きました。


対応したテーマを上記のサイトで確認したら、実際に適用してみましょう。

ダッシュボード>デザイン>モバイル>詳細設定>レスポンシブデザイン適用にチェックで完了です。

 

f:id:marketzero:20161229031313j:plain

 

最後にデザインCSSに以下を入れれば完了です。

 

/* Responsive: yes */

 

場所は、ダッシュボード>デザイン>スパナ>デザインCSSにあります。

f:id:marketzero:20161229031421j:plain

 

「変更を保存」すれば、モバイルで見た時にPC版と同じように見えるはずです。

 ぜひ試して見て下さい。

Copyright (C) 2016 Marketzero All Rights Reserved.