ブログのロゴを無料で作成できるCanvaなら初心者でも簡単ね!

今回は無料のデザインツール、Canvaを使ってWordPressで作ったブログのサイトロゴを作成する方法をご紹介です。

ロゴを変更するだけで、一気に「自分のブログ感」が増しますよね。

当ブログではWordPressテーマ「Diver」を使っているため、ロゴ推奨サイズに合わせて作成しますが、お使いのテーマのヘッダーサイズに合わせるだけなので大きな違いはありません。

きじとら
あるいはヘッダーサイズを調整するかな。

ツールは前回同様、web上で操作ができる「Canva(キャンバ)」を使用していきます。

はち
ソフトをダウンロードしなくていいし、おしゃれなフォントも選び放題!使わない手はないっしょ

Diverのロゴサイズは?推奨サイズを確認する

当ブログで使っているDiverのヘッダーロゴのサイズを確認します。

ダッシュボード⇒外観⇒カスタマイズ⇒「サイトロゴ・アイコン」を開くと、ロゴ画像の推奨サイズは「250×60px」となっています。

絶対値ではありませんが、デフォルトの状態で綺麗にロゴが表示されるサイズになりますので、まずはこれに近いサイズで作成するのがいいでしょう。

Canvaで先にサイズを指定して作成する方法

ロゴのサイズが決まっているなら、予めサイズを指定して作成していくと、Canvaだけでロゴ作成が完了します。

ちゃとら
後からトリミングしたりする必要がないってことね。

まずはCanvaのトップページからログインして、画面右側の「カスタムサイズ」に作成したいロゴのサイズを入力します。

250×60って、かなり細目の長方形なので、現在のテンプレート内にはないサイズ。

そこで、背景・素材・テキストを使って、装飾していきます。

まずはシンプルに背景は白。

続いて左側のツールより、「テキスト」を選んでブログタイトルを入力します。

きじとら
フォントが多すぎて逆に迷っちゃって大変かも…

ちなみに現在、当ブログのロゴで使用しているフォントは「Great Vibes」。

キャンバスいっぱいに拡大します。

素材からイラストを挿入しちゃったりして。

Canva内の無料イラストはちょっといまいち少ないから、他のサイトで予めアイコンやイラストを用意しておくっていうのもいい方法だと思います。

Canvaの便利なところは、作成中のデザインとは別パターンを同じ画面内で作れるところ!

このフォント以外だったらどんな感じになるかなー?とか、色違いパターンを見比べることができてとても便利。

デザインの下に表示される、「新しいページを作成」をクリック。

同じサイズのキャンバスが表示されるので、別パターンのロゴを作っていきます。

ブルー
もちろん一発で決まれば作る必要はないな

背景色付き、イラスト挿入パターンとか、文字の白抜きとか。

完了したらダウンロードしますが、複数のデザインパターンを作成した際は、全部のデザインが圧縮ファイルでダウンロードされるので、必要ないデザインは削除しておきましょう。

タイトルは英数字に変更して、PNGでダウンロードすればOK。

Canvaで作成したロゴ画像をWordPressにアップロードする

Canvaで作成・ダウンロードしたロゴ画像を、早速ダッシュボードからヘッダーに設置していきます。

Diverの場合は、外観⇒カスタマイズ⇒「サイトロゴ・アイコン」ですね。

「画像を選択」から、PCに保存したロゴ画像を選択してアップロード。

テストブログにアップしてみましたが、こんな感じ↓

ヘッダーの背景色をロゴの背景色と同じにすると、統一感がでますね。

デザインが決まらない!テンプレートからロゴを作成する方法

ちょっとデザインを加えたいけど、なかなかアイデアがでてこない…

そんな時はCanvaのテンプレートを使うと、ヒントがもらえるかも。

いろんな種類のテンプレートがありますが、サイズや形状がロゴに近いものを選んだ方が作りやすい気がします。

きじとら
無料登録の場合はテンプレートのサイズを変更することができないからです。

今回は「メルマガヘッダー(600×200)」を選んでみました。

左側に並ぶテンプレートから、ロゴとして使いたいデザインを選びます。

これをブログ用のロゴにあわせて、テキストや線の長さなどを編集。

こんな感じでどうでしょう…?

ぶち

これくらいシンプルなやつなら、テンプレートからじゃなくても作れたんじゃ…

ちゃとら
見本だからいいの、いいの♪

これをダウンロードして、PCのソフト(ペイントなど)を使ってリサイズしていきます。

ブルー
うちではPhotoScapeを使用してるな

PhotoScapeで使える便利な機能はこちらをチェックしてみてくださいね↓

PhotoScapeでの編集画面↓

不要な部分をトリミングして、250×60近くまでリサイズ。

先ほどと同様、テストブログにアップして、ヘッダーの背景色をあわせてみました。

Canvaの無料会員では「透過」が使えない

Diverでは固定ヘッダーといって、画面をスクロールしてもヘッダーが表示される機能がついています。

ロゴがホームリンクになっているので便利な機能なんですが、(スマホの場合は検索やハンバーガーメニューも表示される)ロゴが透過していないと背景色などが邪魔になってしまうんですよね。

当ブログ初期の頃の固定ヘッダー↓(ロゴ不使用でヘッダーの背景を透過)

Canvaにも透過機能は付いていますが、残念ながら有料会員でないと使用できない機能。

有料登録には、30日間の無料トライアルもあるので、そちらを利用して背景を透過するか、あるいはGIMPなどの別ツールを使ってみる方法があります。

固定ヘッダーを使用するなら、透過も視野にいれるか、スクロールした状態も考慮してロゴデザインを作成するのがおすすめですよ。

きじとら
GIMPを使ったロゴの透過方法は次回ご紹介します
このブログはWordPressテーマ「Diver」を使用しています

ブログの収益化・効率化を狙うならテーマによるSEO対策や操作性は大事な要素の一つ。

WordPressテーマ「Diver」は初心者にも使いやすく、自分色のブログを作りやすいサイト構造が特長。

人と被るようなブログにしたくない!そんなあなたにおすすめのテーマです。

ブルー
当サイトからのDiver購入者限定特典もあるんだな

はち
可愛いブログを作りたいけど、カスタマイズしてる時間ない!そんな人は必見だね

ちゃとら
ブログ作りの時間短縮をお手伝いする秘伝のレシピなの
おすすめの記事