ブログのテーマをNakedに変えました。

www.yukihy.com

ゆきひーさん (id:ftmaccho)が作られたもの。

シュッとしたデザインがかっこいいなと思って。

CSSやらHTMLやら疎い初心者の自分が、

「こんなデザインにしたいなー」を、自力で調べながらどれくらい実現できるものだろう？と思って試してみました。

作成のコンセプトは、

1. シンプルで使い易いこと
2. 初期状態でも十分使えるほどおしゃれなこと
3. 簡単に他の人と被らないようにカスタムできること
4. 深くまでカスタマイズしたい人はどんどん改造できること

３・４の部分を実現するにはどうしたら良いかを考え、その方のカスタマイズの意欲によってどこまでも改造できるようにしたいなと思い、作成しました。

オシャレ・レスポンシブ・カスタム可能なはてなブログテーマ「Naked」リリース！ - Yukihy Life

「その方のカスタマイズの意欲によってどこまでも改造できるようにしたい」という部分に惹かれました。

• ブログのテーマをNakedに変えました。
  • グローバルメニュー
  • グローバルメニューにアイコンをつけました。
  • フォントを游ゴシックに 
  • ボタン風リンクでメールフォーム設置 
  • サムネイル画像を大きくした 
  • 文字の行間を変えました
  • instagramを表示させました 
  • 関連記事を表示
  • フッターにコピーライトを表示

今回自分がやりたいなと思ったこととしては、

・トップの画像を左右画面いっぱいに表示する

・イラストブログらしく、スマホのサムネイル画像を大きくしたい

・シュッとした印象にしたい。フォントを読みやすくてシンプルでかっこいいものにしたい。

・instagramの画像を活用したい。

・コピーライトというものを表示したいな。

というようなこと。

グローバルメニュー

theme-naked.hatenablog.jp

グローバルメニューにアイコンをつけました。

家みたいな立方体のマークをつけました。お気に入り。

www.mukaikaze.net

フォントを游ゴシックに 

レスポンシブなテーマなのですが、思うところありPCとスマホで表示を変えたい部分があるので、レスポンシブを選択していません。

スマホのフォントを游ゴシックにしました。

ezolab-blog.net

ボタン風リンクでメールフォーム設置 

スマホ記事下のメールフォームのリンクをボタン風にしました。

digitalkoukisin.seesaa.net

サムネイル画像を大きくした 

スマホのトップページのサムネイル画像のサイズを大きくしました。

tsukuruiroiro.hatenablog.com

文字の行間を変えました

www.ituore.com

instagramを表示させました 

PCサイドバーとスマホ記事下にinstagramを表示させました。

↓これね。

www.mukaikaze.net

関連記事を表示

記事下に関連記事を表示させました。

corp.shisuh.com

フッターにコピーライトを表示

theme-naked.hatenablog.jp

＝＝ブログカスタマイズの参考になるブログテーマ3選＝＝ 

ブログカスタマイズ

Webサイト、ホームページ 

Web開発、Web制作、Webデザイン