さっさと、行こか。

手取り17万、30代OLがゆるゆると一人暮らしするブログ

ブログテーマを【Naked】に変更した。

一度は諦めたブログのカスタマイズ。再チャレンジしてみました。

 

始めは色々調べながら、貼り付けたり消したりを繰り返して試行錯誤していたのですが、ふと途中で気付いたのです。

「あれ、これ全部自分で1からやらなくても、テーマ変えるだけで解決するやつなんじゃね?」

ということに。そんなことも理解していませんでした。無知すぎ(笑)という訳でブログテーマを変更しました!

  

 

 ブログテーマ【Naked】

 

人気らしいテーマ【Naked】に変更しました。

f:id:necorobot:20171010214838j:plain

 

カスタマイズはこちらの開発者ゆきひーさんのブログを参考にしました。

theme-naked.hatenablog.jp

色々な所でお名前が出ている有名人のようですが、本当にすごい方ですね。

  

【Naked】を選んだ理由

 はてなブログにはたくさんのテーマが公開されています。その中から【Naked】を選んだ主な理由は3つです。

 

レスポンシブデザイン

 最優先だった条件がこれです。とにかくスマホから見やすくしたかった!はてなブログの初期設定デザインは見にくくて不満でした。

 

 メニューの設置が簡単

 これもスマホから見た場合なのですが、ヘッダーにメニューがないと記事が探しにくいなと思ったので、どうしても設置したかったのです。【Naked】はヘッダーのメニュー設置が簡単に出来るように、デフォルトで組まれています。

ゆきひーさんのブログで詳しく解説してくださっていたので、私でも出来ました。

【子カテゴリなし】レスポンシブなナビゲーションの作り方 - Theme Naked Blog

 

程よくシンプルでオシャレ

元々のデザインがオシャレなので、あまりいじらなくても良さそうと思いました。シンプル過ぎてもたくさんいじらないといけないし、個性的過ぎても使いにくそうだし。特にサイドバーのデザインがシンプル可愛いなと気に入っています。スマホでは見れないですけど(笑)

 

その他のカスタマイズ

 テーマ以外にも、何点か頑張ってカスタマイズしています。

 

メニューの設置

 これはテーマ変更と連動していますが、ヘッダーにメニューバーを追加しました。記事が探しやすくなったので満足です。

 

見出しデザインの変更

 【Naked】でデフォルトで設定されている見出しはかなりシンプルでしたので、自分好みに変更しました。まずは元々の見出しデザインを白紙にし、上から新CSSを追加しています。

こちらもゆきひーさんのブログに解説があります。

Nakedの見出しをキャンセルする方法 - Theme Naked Blog

 

CSSに関しては色々なところから寄せ集めたので、何がどこのサイトか忘れてしまいました…すみません。

 

 

今後したいカスタマイズ

今回で最低限したかったことは一応出来ました。(レスポンシブ、メニュー、見出し変更)後は、もう少しデザイン的なことを自分好みにカスタマイズをしたいなと思います。

  • 背景画像の変更
  • 文字のカスタマイズ
  • 見出しのデザインもまだ模索中
  • カエレバ、ヨメレバのデザイン変更

など。

 

背景画像はあとりあえず以前撮影した写真を設定しましたが、あまり自分のイメージしていた感じではないというか…。もっと色々探してピンくるものを見付けたいです。

 

あと、【Naked】ではカエレバ・ヨメレバのデザインも設定されているのですが、ボタンにカーソルを合わせると色が変わるようにしたいのです。でもCSSを貼り付けてもうまくいきませんでした。もう少し調べて、出来たら変えたいですが難しいかも。 

 

完全素人&ド初心者ブロガーの私でもなんとか形に出来ました

 今回のカスタマイズにはかなり時間を費やしましたよー!休日丸二日分くらいです、まじで。

 

完全素人&初心者ブロガーの私には簡単と書いてあっても全てが難しいです。でもそんなカスタマイズ難民の私でも、なんとか形になってきたような気がします。それもこれも全て、たくさんの先駆者様方のおかげです。

 

初心者の方には【Naked】オススメです!