読者です 読者をやめる 読者になる 読者になる

むぎろぐ

元看護師が色んなことを書いていく雑記ブログ

はてなブログのスマホのカスタマイズを参考にした記事とともに紹介する

初めて当ブログに訪れた人におすすめの記事をPick Up!1. 自己紹介やお問い合わせ
2. はてな初心者の方に見てほしい!ブログ運営について書いた記事
3. アマゾンですぐに購入できるおすすめのものを紹介
4. 人気ブロガーになる方法を人気ブロガーに聞いてみた
5. 僕の仕事に対する考え方についてまとめた記事

【スポンサードリンク】

f:id:nmugi:20170318210745p:plain

 

どうも、むぎです!

今回はブログについての記事を書いていこうと思います

 

 

スマホのデザインをカスタマイズをしたい

先日、はてなブログのテーマを「Naked」に変えました

関連記事:はてなブログのテーマを「Naked」にしたからカスタマイズを参考にした記事とともに紹介する - むぎろぐ

 

PC用のカスタマイズは上の記事で僕のブログとほぼ同じようにできると思います

 

アドセンス広告の掲載位置に関しては以下の記事を参照してください

関連記事:レスポンシブデザインのテーマは難しい!アドセンスの掲載位置を紹介します - むぎろぐ

 

「Naked」はレスポンシブデザインのテーマなので、

レスポンシブ設定にしていれば問題なのですが、

 

スマホのデザインをカスタマイズをしたいっ!

と思うようになりました

 

今回はスマホのカスタマイズを参考にした記事とともに紹介しようと思います!

「これからスマホのカスタマイズをしよう」

と考えている方の参考になればうれしいです

 

カスタマイズの紹介

f:id:nmugi:20170318203623p:plain

では、具体的なスマホのデザインのカスタマイズの方法を紹介します

調べるために参考になった記事はこちら

 

shiromatakumi.hatenablog.com

 

僕が以前使っていたテーマ「Brooklyn」を作ってくださったシロマティさんの記事です

関連記事:はてなブログ初心者に本当におすすめのテーマだった!「Brooklyn」ありがとう! - むぎろぐ

いつも参考になる記事をありがとうございます

 

最初にするカスタマイズ

まず最初にしておいた方がいいカスタマイズです

「TOPページ」「記事ページ」「フッター」「見出し」など

スマホのデザイン全体をおしゃれにすることができます

 

www.ituore.com

 

こんな素晴らしい記事を書いていただいて本当に感謝です

マジでおしゃれになります

これは絶対しておいた方がよいでしょう

 

SNSシェア・フォローボタンの設置

これも必須でしょう

好みがあるかもしれませんが僕が参考にした記事はこちらです

 

SNSシェアボタンの設置

www.ituore.com

 

SNSフォローボタンの設置

www.ituore.com

 

統一感のあるフォローボタンになって、すごくおすすめです!

 

トグルメニュー設置

これも設置しておいて損はないはず!

メニューの設置です

参考にした記事はこちら!

 

www.yukihy.com

 

こちらも有名なゆきひーさんの記事ですね

現在使っているテーマ「Naked」を作ってくれた方です

いつもお世話になっております

 

これも使っている方が多いのですが複合メニューバーの設置という方法もあります

www.yukihy.com

 

自分でカテゴリーの名前を打ち込んで、URLを入れるのが面倒だ!

という方にはこんな方法もあります

 

www.ituore.com

 

shunさん、良い仕事し過ぎです(笑)

 

ちなみに僕はなんとなくトグルメニューの方にしました

 

目次

目次のカスタマイズです

目次の表示と非表示ができるやつです

PCのカスタマイズの際はゆきひーさんのものを使用しましたが、

スマホのカスタマイズでは以下の記事を参考にしました

www.yone-himajin.com

 

<追記>やっぱりゆきひーさんの目次のカスタマイズにしました

参考にした記事はこちらです

www.yukihy.com

 

こんなものもあります

使っている方多いですよね

www.tsubasa-note.blog

 

パンくずリストの設置

これも忘れずにやっておいた方がよいでしょう

参考になる記事はこちらです

bulldra.hatenablog.com

 

以前書いた記事でも紹介していますが、パンくずリストはSEO対策にも効果ありです

関連記事:はてなブログSEO対策!記事のリライト方法を参考にした記事ととともに紹介する - むぎろぐ

 

画像のセンタリング

画像をセンタリングする方法です

PCだと左寄りでもそんなにおかしいことはないかもしれませんが、

スマホだと中央じゃないとちょっと気になるんですよね

アドセンスも中央寄せにしているので余計に気になるんです

ということで参考にした記事はこちら!

PCを前提に記事が書いてあるので、

スマホの場合はタイトル下にコピペしないといけません

uriuridayo.hatenablog.com

 

太字を蛍光ペン風にする

太字を蛍光ペン風にするカスタマイズです

参考にした記事はこちら

mu2in.hatenablog.com

 

人気記事セレクションの設置

これもけっこう設置している方が多いですよね

サイト内の回遊率アップのためには欠かせないです!

参考にした記事はこちら!

www.tontonpig.com

 

僕はタイトルと枠の色を変えて使用しています

おすすめです

 

カエレバ・ヨメレバのデザインをカスタマイズ

最後に忘れてはいけないのがカエレバ・ヨメレバのデザインのカスタマイズです

こちらもゆきひーさんの記事を参考にしました

www.yukihy.com

 

まとめ

いかがでしたか?

今回ははてなブログのスマホのカスタマイズ方法を紹介しました

ほぼ記事を載せただけですね(笑)

すみません

でも、本当におすすめの記事ばかりですよ

 

これからスマホのデザインのカスタマイズをしたいという方の参考になれば嬉しいです

 

おすすめの記事紹介

他にもブログについてのおすすめの記事を書いています

もしよければ読んで下さい

 

最後まで読んでいただいてありがとうございました

 

ではまた!