ココッチィ

心地いい部屋でここちいい音楽を | プログレ狂のオーディオ野郎とインテリア好きな平凡な私のブログ

簡単!はてなブログカスタマイズ!スマホ表示がオシャレに見える!

このブログのURLをコピーする

広告

f:id:rico_note:20170612214300j:plain

はてなブログを始めてしばらくすると、ブログのデザインをカスタマイズするのが楽しくなりませんか?ついつい時間を忘れて夢中になってたりしますよね。

先日、トップに戻るボタンを画像で配置しました。

それがとても、お気に入りでね。黄色いロケットなのよ。

最初、サブマリンもいいな~と思ったけど、上にいくやつだからね。やっぱり、気球とかロケットかなと。

 

そして本日、メガネ主婦さんから当ブログをご紹介いただきまして。

www.megane-shufu.com

梨子さんにしか出来ないような個性あふれるデザインが素敵だしかわいい。特にアイキャッチ画像が全部オシャレです。 ここまでのクオリティには出来ないけど、少しだけブログをオシャレにしたい!

メガネ主婦さん、ありがとうございます。

 

そんなこんなで、今回は私がブロガーの皆様のお知恵を拝借して、カスタマイズ!とか偉そうなことじゃないんだけど、ちょっとイジッてるところをご紹介です。

なお、こちらは有料の「はてなブログPro」を利用している方向けです。

 

基本のテーマはこちらです。

ZENO-TEAL - テーマ ストア

しつこい質問に丁寧に対応していただき、お手数をおかけしました。

zeno-teal.hatenablog.com

 

 

ヘッダー画像は1000×200で作っています。

スマホ表示はレスポンシブデザインにして、ヘッダー画像が小さく表示されるようにしています。

IMUZA.comのid:ausnichtsさんにしつこく相談しました。

www.imuza.com

 

 

サイドバータイトルの前についているアイコンはFont Awesomeを使っています。

fontawesome.io

広告

 

 

おすすめ記事の下の細いラベルは「ひつじの雑記帳」id:codomisuさんのブログから。

スマホ表示を別に作っている最強カスタマイズです。

このラベルは好きな場所にリンクできます。

 

hitsuzi.hatenablog.com

f:id:rico_note:20170531090344j:plain

私はこんな感じで無料写真、無料イラスト素材のサイトをリンクしています。

 ※グローバルメニューを設置したので、こちらは現在使用していませんが、ひとこと何でも宣伝に使えるので、便利ですよね。

 

それから、上に戻るボタン。

f:id:rico_note:20170531090637j:plain

非アクティビズムのつっちーさんの記事を参考にさせていただきました。

www.in-activism.com

 

黄色いロケットの画像をpngで作って、フォトライフにアップしたのですが、なんどやってもjpgになってしまい、背景が白くなってしまいまして。

 

 

フォトライフにアップした画像は、クリックして1枚に表示にするとアップロードした時の拡張子になるようです。

教えてくださった、ふーさんアッサム兄さん!ありがてぇ。つか、これ、みんな知ってるんですか?無知な私。

 

そして最後に黄色いロケットの左側にあるSNSシェアボタン。

前はね、フッターに固定したメニューを設置してたんですけども。あまり使われてないような気がしてたんですよね。

読みに来てくれた人は目的の記事だけ読んだら、ハイさよならって離れてる気がするんです。

 

あ、これ、私の文才の無さのせいっちゃ、せいかもしれませんね。

もっとオモロイ記事がかければ、他にも読んでみっか!と固定バーから人気記事を読んでくれたりするんでしょうね。

 

てなわけで、NAEさんのSNSシェアボタンを利用させてもらってます。

NAEさんは数字で立証してくれるので、とても参考になりますよ。

www.naenote.net

 

 

私は自分のTwitterや読者登録にリンクしたくて、NAEさんに相談しました。すぐにこたらのブログをご紹介いただきました。http://を省くのを忘れないようにしましょう。

english-apple-diy.hatenablog.com

awaさん、勝手にご紹介しました。

 

今のテーマはスマホ表示の時に文字が、ほんの少しだけ小さいかな、と思ったり。見やすい、楽しい!が読む人にとって1番ですものね。

※現在、文字はアドビのWebフォントを使っています。

helpx.adobe.com

 

 

以前のブログで使わせてもらっていたLOGzeudonのid:rokuzeudonさんのテーマも大好きです!おススメです!ここでもしつこく質問しまくっております。本当にありがとうございました。

blog.rokuzeudon.com

 

メガネ主婦さんにオシャレ!と言われて、調子こいてつらつらと、お話してきましたが、サムネイルのデザインがオシャレに見えるとしたら、やはりそれは、統一感じゃないかと思います。

 

普段はイラレとフォトショでサムネイルを作っていますが、Windowsにデフォルトで入っているものを使ってやってみたんです。

www.cheer-up.info

 

サムネイルを作るのはアドビのようなソフトがなくても十分ですよね。記事のサムネイルに統一感が出せれば、勝手にシャレオツに見えてくれるはずです。

 

 

上の記事で紹介したんですが、動物の顔に吹き出し+背景は原色+タイトルは白抜き。これを統一して毎回、サムネイルを作ったりね。

f:id:rico_note:20170512221802j:plain

ここでは猫や犬ですが、動物も色々いるわけですしね。サルにしてみたり、ウサギにしてみたり、出来そうですよね!

 

上の記事には、前に使ってたサムネイルも載せてますので、よかったら、見て下さいね!

 

そんな感じで、統一感があるサムネイルを考えてみてくださいな。とか、偉そうに言っちゃってるけど、まだまだ学ぶことがいっぱいなので、皆さんも色々教えてちょんまげ。

 

最後までお付き合いくださり、ありがとうございました。

広告