貯びっと日記

低所得・投資初心者のちょびっとした投資雑記ブログ。

ちょっとのお金をどう活用するか…実体験を通して自由に書いていくことを目標にしています。

ブログのデザインで参考にしたブロガーの記事をちょびっと紹介

 ブログ初心者である著者。有料化をしてから、ブログのデザインをあれやこれや試してみては失敗し、ようやく今のデザインになりました。一通り作るにあたって、参考にした記事をまとめてみました。

レスポンシブデザイン

ブログのデザインを下記のページから導入しました。

テーマ ストア - はてなブログ

RESPOSIVE(レスポンシブ)と書いてあれば、ページのカスタマイズはすんなりとできました。

有料ブログ化とドメインの取得

 いろんなカスタマイズをしたいということで、まずははてなブログを有料化。せっかくなら独自のURLを取得して運営したい。

https://www.tyobit-diary.work/

著者のURLはこれです。これはドメインを取得する必要があります。参考になった記事はこちらです。

www.mutant-tetsu.com

グローバルメニューの設置

f:id:holyknightseiya1234:20181228183909p:plain

 次にこの部分です。ここを参考にしたブログは下記です。

www.yukihy.comしかしながらこれだけではスマホで見た時にトグルメニューがちゃんとならないようでした。ここでもうひとつ参考にした記事が次です。

www.yucblog.nethtmlのjQueryのバージョンを変えないといけません。

サイドバーにボタンを設置

 おしゃれにしたかったので、「読者になる」、「Twitter」、「Facebook」、「Yahoo!ブログ」のボタンを設置しました。

f:id:holyknightseiya1234:20181229110603p:plain

参考にした記事は下記になります。

www.ituore.comYahoo!ブログのボタンは必要なかったかとは思ってます。Google+にしようか迷いましたが、Google+は2019年8月に終了とのことなので辞めました。1か所空くのも・・・と思ったので仮設置です(笑)

お問い合わせフォームの作成

 記事への個別のコメントは記事の最後からできますが、全体的なお問い合わせや見られたくないコメントはお問い合わせを作ったほうがいいと判断し、作成しました。

f:id:holyknightseiya1234:20181229103845p:plain

参考にした記事は下記の記事です。

www.tssb26.com

Googleにアカウントを作成する必要があります。お問い合わせ専用のURL固定ページから作れます。

https://www.tyobit-diary.work/information

上へ戻るボタン

 f:id:holyknightseiya1234:20181229101752p:plain

 クリックすると一気に上に上昇できます。こいつは下記のブログからです。

azanaerunawano5to4.hatenablog.com 

フッターのコピーライト表記

 

f:id:holyknightseiya1234:20181229102614p:plain

これはブログをやるなら必要だと判断しました。参考にしたのは下記の記事です。

www.inside-shiina.com

他に参考にしたカスタマイズ記事

グローバルメニューの鉛筆マークのカスタマイズ方法は下記の記事より~

www.foxism.jp文字の色やメニューの色などを変更するために利用した記事は以下の記事です。

www.netyasun.com

終わりに

 勝手に見て勝手に参考にさせていただきました。これを作るのに3日ほどPCと睨めっこ。かなり大変な作業でした。しかし大変勉強になりました。

f:id:holyknightseiya1234:20181224150311p:plain