★ さとりずむ ★

Amazonプライム・ビデオを中心とした映画レビューブログ。そのほかにも音楽や書籍、育児ネタなどの雑記もあるよ!

映画『ジュラシック・パーク』徹底レビュー!
映画『ミッション:インポッシブル』徹底レビュー!
映画『ミッション:インポッシブル3』徹底レビュー!
映画『オールユーニードイズキル』レビュー!
アニメ『ゆるキャン△』レビュー!

ブログ開始13日目。初心者が頑張って少しカスタマイズしてみた!

よいこのみなさんハロにちわ!さとる(@)です。

 

名前のあとにTwitterアカウントを入れることを覚えたよ!!

38歳、まだまだ進化出来るゥーーー!
肉体は日々衰えているのを実感するけどね!! 

と、いうわけで今日はちょっぴりブログのカスタマイズをしてみました。

ブログ開始より13日が経過し、文章を書くのも少しずつ慣れて来たので、ちょっといじってみようかなと思いました。

気になっちゃった箇所

ブログ開始した時から変えたくて気になってたのが、サイドバーのデザイン。

スマホだと下部に来るやつですね。

プロフィールアイコンもちっちゃくてよくわかんないし、ヘッダーに画像を使うとブログの説明が出なくなっちゃってチンプンカンプンだし。 
いろいろ変えたいところはあるけれど、サイドバーは目立つ部分でもあるのでとりあえずココをやってみようかなと思いました。

Twitterだけじゃなく、Instagramも入れてみたかったので、今回いろいろ調べてやってみました。

まずはプロフィール画像を作り直す

プロフィールアイコンの下書きデータは残していたので、髪の色と背景を変更して作り直しました。

デフォルトのプロフィールモジュールだと、たぶん64×64に縮小されてしまっていました。なので、今回のカスタマイズでは画像サイズそのままで載せることにし、より目立つように以前のものの倍である256×256で作成。

f:id:satorism:20180508042715j:plain

↑これ。
でかいね。いいね。しばらくはこれでいきます。

「似顔絵欲しいけど、絵を描くのは苦手!」って方は、ココナラ というサイトで500円程度から依頼できるので、検討してみてはいかがでしょうか。

サイドバーをカスタマイズする

さて、今回行ったのはデフォルトのものではなく、「HTMLモジュール」を使ったものです。
追加方法は、「デザイン→カスタマイズ→サイドバー→HTML」です。

参考にさせて頂いたサイトはこちら。

panmeeee.hatenablog.com

最初は丸々コピペさせて頂いて、少し自分なりにアレンジしてみました。

インスタグラムの埋め込み

どうせならインスタも埋め込んでしまおうと思って、サイドバーに仕込めるようにしてみました。

参考にさせて頂いたサイトはこちら。

www.mutant-tetsu.com

ちなみに、はてなブログとインスタグラムを連携させると、インスタに投稿した画像をブログ記事内に挿入できます。

今回行ったサイドバーへの表示は、ぼくがインスタに投稿した画像が最新順に表示されるフィードなので、これは便利ですよね。
画像をクリックしてもらうことでインスタグラムに繋がるので、そこからぼくのインスタ画像を見てもらったり、フォロワーになって頂くことができるようになりました。

まとめ

今回はとりあえずここまで!

インスタグラムのフィード表示はかなり気に入っています!ただ、これをやったことによって、ブログにも表示されるってことを意識してインスタにも投稿しなきゃいけないなって思ってしまいますがw

ぼくはHTMLとCSSの知識に乏しいので、今回行ったものはほとんどがコピペです。
なので、まったくわからない!という方でも、根気よく調べていけば必ずカスタマイズできると思います。

まだまだカスタマイズはやりたいので、少しずつやっていこうと思います!
参考になれば幸いです。それではまた!

★ 読者になってくれるとすごく嬉しいです^^ ★