furutakeの日常

カメラ、DIY、買ったもののレビュー記事、たまにバイクの事など日常的な事を書いてる完全自己満ブログ

ブログのデザインを久々に変更してみました

どうも、furutakeです。

今回はブログのデザインを変えた事を記事にしてみます。

前回ブログのデザインを変えたのは1年半以上前

1年半ぐらい前に一度ブログのデザインを変えてからずっといままで変更せずにつかっていました。

変更した時の記事がこちら furutake.hatenablog.jp

ずっと使用していると見慣れてきて、若干見た目に飽きてきたというかそんな感じなってまして、記事を更新する時間がなかったため、初めて5月には0記事ということになってしまったり、更新頻度が落ちておりました。(言い訳w)

書いた記事にコメントいただけたらやはり嬉しいし、スターだけでもつけてもらったら嬉しいですよね。それが最近の更新頻度が落ちてから記事を書いてもあまりスターもつかない=読まれない→見られないなら時間かけても書くの面倒→更新頻度落ちる→頑張って記事を書く・・・みたいな勝手に悪循環のような状態になってモチベーションが低下してました。

でもあんまり読まれた読まれない関係ないって思う事にして、この際だからブログのデザインを変えてみよーと思うことにしました。

前からまたテーマ変えたいなーと思っていましたが、変更すると面倒なのは記事下や上に設置しているシェアボタンやデザインCSSがすべてリセットされてしまうということ。

でもいままでのデザインを一新するためにも、すべてHTMLやCSSは消えてもいいや!と思えるようになり変更しました。

テーマ変更後にやったこと

今回デザインのテーマはこちらを使用しました。

マテリアルぽっぷ - テーマ ストア

マテリアルぽっぷというデザイン。自分的に好みの感じでしたので、サクっと変更しました。

そしてDemoブログも用意されており、デザイン変更についての質問とかも出来るようでした。

https://material-pop.mamegoro.com/

テーマ変更後にいろいろと消えてしまった部分があるのでそれをいじっていきます。自分のブログをいじると、ここをこうしたい、あれをこうしたいとなってカスタムするのに夢中になり、なんだか楽しくなってきました。

ま、カスタムと言えど、どなたかがつくってくださったものをそのままコピペですので、大したことはしてないんですけどねw

そんな訳で以下はグーグル先生で検索してやったことです。

問い合わせフォームを設置

参考にさせて頂いたブログ www.tssb26.com

今まで問い合わせってないっちゃ無いのですが、一応それっぽいようにしたかったので、Googleフォームを使って記事に貼り付け、そのリンクにとぶように設定してみました。

f:id:furutakeru:20180721193541p:plain

赤枠のMailの文字をクリックすると開くように設定してみました。

ポリシーのページを設置

参考にさせて頂いたブログ liberty-life-blog.com

AmazonアソシエイトGoogleアナリティクスを利用しているので、サイトポリシーを掲載する必要があるという記事を見たので、コピペして設置しました。

追記 2017.7.22】

アナリティクスの項目部分の文末がおかしくなっており、ご指摘頂きまして訂正致しました。 ご指摘頂きありがとうございます!!

記事の上下にシェアボタンを設置

参考にさせて頂いたブログ blog.minimal-green.com

以前のテーマの時にも設置してましたが、前のとは少し違うデザインのボタンを設置しました。こちらもコピペさせて頂きまして完了!

f:id:furutakeru:20180721191823p:plain 赤枠のところ。記事の上下に配置してます。

プロフィール(about)のページをいじった

参考にさせて頂いたブログ www.okuni.me

プロフィールってちゃんと書いたことないのですが、簡易的なものをちゃんと書こうと思い、こちらもコピペで完了。内容はまだこれから更新して行く予定です。

furutake.hatenablog.jp こんな感じにしてみました。

Pro化しないとできない事

f:id:furutakeru:20180721192956p:plain

この画像のようにトップページにカード状に記事一覧表示できるようにしたいのですが、どうもこれをやるにはPro化が必須みたい。 でも一応Archiveと書かれているボタンを押すと記事一覧が表示されるようになってます。

これを変更するには下の画像のように f:id:furutakeru:20180721231316p:plain

「設定」の「詳細設定」の中にこの「トップページの表示形式(PC版)」があり、デフォルトでは「全文形式」なので、これを「一覧形式」にできれば上記の画像のように記事をカード状に表示できるんだろうと思いますが、Pro化してないためやったわけでないのでわかりませんw

こういったところが変更できないとなると、やっぱりPro化したほうがいいかなーなんて思ったり。(そう思って1年以上ずっとPro化したことないですがw)

まとめ

久しぶりにブログのテーマ変更とカスタマイズをして素人でもコピペでここまでできました。 カスタムするのが楽しくて、夜中に3時間ぐらいやってて若干寝不足気味でしたw まだグローバルナビゲーションバーのところの文字サイズを変更したいと思っているので、またグーグル先生で調べて調整してみたいと思います。

また今回デザインを変更したことによって、さらに愛着がわいたのか、記事を書くモチベーションがあがり、この記事で今月3記事目となりました。

モチベーションの維持って結構大変だったりしますが(特に自分みたいな雑記ブログだと)、これからもこんな感じのペースでブログ更新していきたいと思いまーす。

それとトップ画像はとりあえず外してみました。 また画像を貼り付けるか、今のままで行くはもうすこし考えてみたいと思います。