ブログ
ブログをカスタマイズしました。
はてなブログは、多くのユーザーが利用しているので、カスタマイズについても、多くの情報を得ることができます。
特に、ブログテーマを作ってくださっているようなブロガーさんのページを見ると、色々なカスタマイズ方法が詳しく掲載されているので、コピペで真似すれば自分のブログでも再現できるので、非常にありがたいです！
ただ、はてなブログの無料会員にはカスタマイズに制限があるので、有料会員になった方が自由度は格段に上がります！
無料会員のまま色々カスタマイズしてしまうと、規約違反になってしまう恐れがあるので注意してください。
プロフィール画像等の変更
プロフィール画像・ヘッダー画像の変更を行いました。
この画像、うちのこどもたちにそっくりなんです！
フリー素材を組み合わせて作っています。
イラストレーター・フォトショップをある程度触れるので、画像の加工とかは得意ではあるのですが、面倒でずっとやってきませんでした・・・。
印象に残るようなもになってくれていたらいいなと思います！
また、プロフィール部分を変更しました。
はてな公式のプロフィールモジュールって昔から使いにくいなと思っていたんです。
カスタマイズがしにくい・・・。
ということで、公式のプロフィールモジュールを使うのをやめて、HTMLモジュールに変更しました。
あまりやっている人を見ないので、何かデメリットがあるかもしれませんが、自分では今までモジュールを分けていた部分をまとめられたので、満足です。
ヘッダー画像のレイアウトについてはこちらの方のブログを参考にしました。
シェアボタンやフォローボタンの変更
シェアボタンはブログパーツを提供してるWebサービス会社のものを利用しています。
プロフィール内にあるフォローボタンや記事下にでるフォローボックスは、はてなブロガーさんが提供してくれていたものをそのままコピペで使っています。
こちらの方のものです。
はてなブログで使えるシェア・フォローボタンについては、この方がまとめていらっしゃいます。
【はてなブログカスタマイズ】色々な「SNSシェアボタン」と「フォローボタン」を集めてみた。 - BACKFLOW (バックフロウ)
関連記事
このブログの「あわせて読みたい」の部分は、やはりブログパーツを提供しているWebサービス会社のものです。
Milliard関連ページプラグインについて | シスウ株式会社
さらに、レイアウトの変更をこちらの方のブログを参考にしています。
関連記事は、はてなブログ公式のものですが、記事の下に来るように変更しました。
こちらに方の記事にまとまっています。
タブメニュー
このブログのテーマは、レスポンシブデザイン対応なので、PCで見たときもスマホで見たときも同じ設定になっています。
PCページとスマホページを共通設定で変更できるので、管理が楽というメリットがあります。
しかし、レスポンシブデザインの欠点は、スマホで見た場合、PCのサイドメニューが全て、記事下に持っていかれるということです。
縦にやたら長いサイトになってしまいます。
縦に長すぎて、下まで見る気が失せるということになりかねません。
これを、緩和するために、タブメニューを設置しました。
ここに４項目設置することで、縦に長くなることを緩和しました。
それでも長めなのですが・・・。
タブメニューの作成に関してはこちらの方が作成されています。
フッターの復活
はてなブログの有料会員は、ヘッダーとフッターをオフにすることが設定でできます。
私は、このテーマに変更してからオフにしているのですが、フッター部分のみ復活させました。
やっぱりフッター部分があるとしまります！
フッター周りの作り込みに関しては、この方のカスタマイズが秀逸です。
トップへ戻るボタン
どうしてもブログは縦に長くなる傾向があるので、トップへ戻るボタンを設置しました。
フッター部分にあります。
みなさん、ページをある程度読み進めると、自動で右下にふわっと出て来る戻るボタンを利用している方が多いと思いますが、小さく半透明のボタンでも記事に多少かかって来るのが嫌で、フッターにだけ設置しました。
jQueryを使われている方が多いのですが、今設置しているのはただのHTMLのリンク設定です。
本当はjQueryを使ったものにしたかったのですが、みなさん動きのあるものばかりの設定方法を掲載していて、自分のやりたいものが見つからずに、諦めてHTMLにしました。
本当は上までスライドしていくアニメーションをつけたいのですが・・・。
HTMLもjavaもさっぱりなので、これが限界でした・・・。
これといった参考サイトはありません。
記事一覧表示
はてな公式から、トップページの表示形式を変更できるようになりました。
全文形式と一覧形式を選べます。
プロ版のみ変更可能です。
デフォルトは全文形式ですが、これに不満がある人は多くて、トップページにアーカイブページをもってきて、むりやり記事一覧表示に見せている人が多くいました。
これが、公式の設定でボタン一つで変更できるようになったのは大きいです！
レスポンシブデザインでは必須設定になってくるのではないでしょうか？
ということで、このブログも一覧形式に変更しています。
そうすると、はてなスターの表示主張が激しく、レイアウトの邪魔になるので一覧状態では消しました。
この方の記事がいろいろと参考になります。
まとめ
今回のカスタマイズは、以上ですかね。
自分なりに満足いくレイアウトになったと思います。
贅沢を言えば、グローバルメニューをもうちょっとうまい具合にしたいのですが、なかなか手が出せていません。
また、今回のカスタマイズに伴いページ表示がかなり重くなったと思われます。
見やすさも大切ですが、軽さもユーザービリティの重要な部分だと思います。
今回は、見やすさ重視ということで、軽さをおざなりにしてしまいました・・・。
でも、自分としては満足です！
参考にさせていただいたみなさま、本当にありがとうございました！！
