WordPressでブログを更新するようになって2ヶ月半くらいが経過しました。
この記事を上げる前までも、画像を変えてみたりだとかちょこちょこブログの編集はしていましたが、本日、ずっと変えたいと思っていたブログロゴを作成してみました。
今回は変更してみたことについて、まとめた記事となります。
ブログロゴの変更
ブログロゴは、その名の通り、サイト名をロゴにしたものです。
サイトロゴという言い方をする場合もあるようですね。
テキスト表示だと味気ないので、ブログロゴを作ってみたい！という憧れはずっとあったのですが、一度作成した時にうまく表示する事が出来ず、結局テキストでの表示のままになっていました。
ただ、たまたま目についたこちらのブログロゴ作成の説明がすごくわかりやすくて、自分でも出来そうな気がしてきたので、早速作ってみることにしました。
基本的に、この記事の通りの手順で作成していまして、ブログロゴはCanvaというサイトで作成しました。
Canvaは無料で利用できますが、会員登録が必要になります。
ただ、GoogleやFacebookのアカウントでもログインする事が可能なので、実際に利用してみて面倒さは特に感じませんでした。
トップページに「ロゴ」の項目があるので、そこからベースとして使えそうなテンプレートを選んで編集していけば大丈夫です。この画像のテンプレートのロゴは英語ですが、日本語への変更も問題なくできました。
本当はテンプレートを利用せずに一からロゴを作ることも可能だそうですが、テンプレートでイメージが湧きやすい分、私には作りやすかったです。
画像作成後は↑のサイトの説明通り、バナー工房で画像を切り取り(トリミング)し、PEKO-STEPで画像背景部分を透過させるように編集しました。バナー工房でも背景透過編集は可能でしたが、文字の中の空白部分が透過出来ていませんでした。
この手順が最善手なのかと聞かれると正直微妙ではあるんですが、どちらのサイトも会員登録やインストールは不要だったので気楽に使えたことは良かったです。
ブログロゴが完成したらWordPress内のcocoon設定の「ヘッダー」にあるヘッダーロゴの項目に画像を設定して完成です。
ヘッダーの背景画像も設定した結果、こんな感じになりました。
結局選んだテンプレートに含まれる木のイラストは消してしまっていますし、テンプレートで作った意味…って感じですが、初心者には作りやすかったですね。
画像も、この夏にスマホで撮影したもの(撮影場所は京都府北部にある父の実家の近くでした。 興味ないと思うけど、伝えたかったｗ)をCanvaで編集したものになります。
【2020年3月24日追記】ヘッダー画像を新しいものに変更しました。ブログ名の「~行雲流水~」も現在は使っていません。
全く狙っていなかったのですが、PCから見た場合とスマホ(タブレット)から見た場合で画像の色の雰囲気が違っているので、個人的に面白いなと思っています。
※cocoonでヘッダー画像の表示サイズが変更できることを知らなかっただけですw
このブログロゴで100点！とは思えないので、どこかで変更するかもしれません。
それでも、とりあえずテキスト表示のままよりは自分のブログの個性が出たような気がします。
ファビコンも変更しました
サイトロゴと同時に、ファビコンも新たに設定し直しました。
ファビコン…と聞いてピンと来ない人も多いと思います。
サイトアイコンという言い方をする事もあるので、そっちの方がわかりやすいかもしれません。
ファビコンは、この画像を見ていただければ見覚えのある方も多いと思いますが、サイト名の横にある小さなロゴのことになります。Amazonだと左隣にある「a」のロゴですね。
WordPressを始める際、とりあえずファビコンは設定しておく方がいいという話を聞いたので、プロフィールに使用している画像だったり、フリーのアイコンだったりを設定してはいました。
ただ、どこかでちゃんと作ったものを設定させたいと思っていまして。
どんなファビコンにするか考えている時に「ブログタイトルの中の1文字を使用したものにしたい」と思っていました。
悩みましたが、一番強調したいと思っていた「緑」の文字をファビコンに使うことしました。
こちらも画像はCanvaで作成し、PEKO-STEPで背景透過の編集したものを、こちらのファビコン作成サイトで完成させました。
「緑」という文字が画数の多い文字となってしまうため、パソコンでもぎりぎり見えるくらいの状態なので、スマホから見た時は文字が潰れてしまうかもしれないな…と思います。
しかし、とりあえず緑色のファビコンが見えていたら良し！と割り切ることにしました。
合わせてグローバルナビゲーションも編集してみました
サイトロゴ、ファビコン変更に合わせて、ホーム画面に表示されているグローバルナビゲーションも変更しました。
私自身WordPressを始めるまで「グローバルナビゲーション」という言葉は知らなかったのですが、ホーム画面のブログロゴの下にあるカテゴリーやリンク集、問い合わせ欄の項目が並んでいるところの名称となります。
ずっとデフォルトのままにしていたのですが、「ホーム」の項目はブログロゴの部分をタップ(クリック)すればホーム画面にジャンプ出来るので無くてもいいかな？と思い削除しました。
そして、特にサイドバーが常時表示されないスマホでは、カテゴリー別の記事がホーム画面から確認しづらくなっていたので、主要なカテゴリーを表示してみました。
こちらもまだまだ見づらい部分などあるかもしれないので、気になったら随時変更していきたいです。
ブログの設定はやっぱり時間泥棒
今回、これらの変更に合わせてcocoonのスキン(簡単なデザイン変更機能)もこれまでとは違うものにしてみたので、個人的にはかなりページ全体の雰囲気が変わったような気がしています。
ここまでがっつりデザインを変更したのはWordPressを始めた数週間の時ぶりでしたが、改めて思ったのはWordPressのデザイン変更は時間泥棒だな…という事ですｗ
色々記事を書いたり、過去記事をリライトしようと思っていたのに、あっという間に半日が過ぎていた感じです。
ただ、時間がかかった分、それぞれは小さい変更ではありましたが知識は増えたと思うので、やってみて良かったと感じています。
まだまだWordPress(とcocoon)は出来ることが多すぎて分からないことだらけですが、記事も増やしつつデザインの事も調べて、より見やすいブログのページになればと思っています。
それでは、今回はこのへんで。
コメント