ウィジェットやCSSでトップページをカスタマイズしてみたよ

ブログ運営
とりとん
とりとん

もうすぐでブログ開設から2ヶ月経つね〜

記事をアップすることには少しつづ慣れてきましたが、まだまだブログのカスタマイズが止まりません。

2週間前くらいからGoogleアナリティクスを導入してみたのですが、ありがたいことにTwitterから覗きに来てくださっている方もちらほら・・

そして、トップページのこだわりがすごいですねって言われましたw

実際、記事を書こうと開いたのにカスタマイズしたい箇所を見つけて気付いたら時間が・・というのは日常茶飯事なのでこだわっていることに間違いはないです!

誰かに見てもらっとるって思うと気合入るよね!

来訪者の皆様ありがとうございます〜

トップページのカスタマイズ

トップページは序盤からこだわって作っていましたが、今回はヘッダーロゴとカテゴリーメニューをふわっと動くようにしてみました。

これは表示される度にちょっとテンション上がるのでやってみてください⬇️

とりとん
とりとん

簡単に設定できるよ〜

更にトップページに表示されている記事や配置もカスタマイズしました。

これはWordPressのダッシュボード→外観→ウィジェットから簡単に設定できます。

いくつか追加できるウィジェットがあるので、それぞれ何が表示されるのか試してみました。

『インデックスリストトップ』に追加すると、デフォルトで最新記事が並んでいる箇所にウィジェットを追加することができますよ。

例えば・・“人気記事“を追加すると、PV数が多い順番に記事が表示されたり、“CTAボックス“を追加すると、見てほしいページに飛べるようにボタンを表示して来訪者の行動を促したり、結構カスタマイズすることができます。

記事数の変更は、WordPressのダッシュボード→設定→表示設定から設定できますよ。

アイキャッチのサイズ

これは本当に最初からしっかりと調べておけばよかったなーと思っていることなのですが、画像のサイズが定まらない。

大きすぎるとブログが重いし、小さすぎても引き伸ばして表示されるので画質が大変なことになるし。

最初は何回もサイズ変更の為に作り直していたのですが、メディア一覧の“画像を編集“から画像縮尺の変更をすることができます。

もしくは、アイビスペイントに画像を読み込んで解像度を変更する機能を使うか・・

どちらにせよ先に画像サイズは統一しておいた方が後々楽です!

参考程度に以下当ブログの画像サイズです⬇️

画像のサイズ参考
  • ヘッダー背景:1200×800
  • ヘッダーロゴ:640×427
  • 記事のアイキャッチ:1280×720
  • 記事内のイラスト:1024×400
  • カテゴリー別のイラスト:1200×279

私がいつも画像を作成しているアイビスペイントの基本的な使い方はこちらからどうぞ⬇️

実際の表示サイズに対してPCならだいたい1.5倍、スマホなら2倍のサイズで画像を設定すると綺麗に表示されるみたいやけど・・・

オススメの画像サイズがあれば教えてください!

最後まで読んでいただきありがとうございました!

とりとん
とりとん

次回のブログ運営日記では、記事内の画像について書いたのでよかったら読んでみてください〜

コメント

タイトルとURLをコピーしました