【初心者向け】スキンの設定と無料ロゴの作成。~Simplicityをカスタマイズ~02

スポンサーリンク

Simplicityのスキン設定で簡単にデザインを変更

前回は、Simplicityというワードプレスのテーマをインストールしました。

画面の配置が少し変わりましたが、まだ色味がありません。

インストールするテンプレート(テーマ)によっては、ここから「css」というデザインをカスタマイズできる言語を使って、色をつけたり文字の大きさを変えたりしなくてはなりません。

でも、いきなり新しい言語を勉強するのは抵抗ありますよね。

そんな方のために、Simplicityでは簡単にサイト全体の色調を設定できる、「スキン」という機能があります。

これを使ってみましょう。

設定方法はこれだけです。

「WordPressの管理画面」 → 「外観」 → 「カスタマイズ」と進みます。

サイドバーの「スキン」をクリックすると、「選択しない」「瑠璃紺きなり」「深紅きなり」などが並んでいます。

今回は、「淡桜」を選択しました。

「保存して公開」ボタンを押せば、設定完了です。サイト内の枠線や、リンクの文字に色がつき、ブログらしくなってきました。

ロゴの作成。シンプルなロゴを無料で作れる「squarespace.com」の使い方

次に、ブログの顔とも言えるロゴを自分で作ってみましょう。

無料でロゴを作成できるサイトはたくさんありますが、お勧めなのは「squarespace.com」というサイトです。

Simplicityのテーマにふさわしいシンプルなロゴを直感的に、簡単に作れるのです。

「squarespace.com」にアクセスします。

中央の「LOGO NAME」という黒いボックスに、あなたのサイト名を打ち込みます。

ロゴ作成1

「Search」ボックスに、ロゴに入れたいイラストの名前を入力します。このとき、英単語で入力してください。

ロゴ作成2

すると単語に応じたたくさんのイラストが出てくるので、好きなものを選びます。

ロゴ作成3

選んだイラストが画面に表示されます。これで自由に移動したり大きさを変えたりできます。

左サイドバーに「Tagline」のボックスがあります。ここにロゴのサブタイトルを入力できます。シンプルさを追求したいなら、使わなくても良いでしょう。

ロゴ作成4

イラスト同様、サブタイトルもロゴのタイトルも自由に移動・拡大縮小ができます。

文字を選択すると、「FONT FAMILY」からフォントを変えられます。

ロゴ作成5

イラスト・文字は色を変更できます。クリックでカラーパレットから選んでもいいですし、「#xxxxxx」とあるボックスに16進数のカラーコードを入力することもできます。

選んだ色はリアルタイムで変わるので、画面を見ながら適当な色を決めましょう。

ロゴ作成6

文字の太さは「FONT WEIGHT」、文字のスタイルは「FONT STYLE」で変更できます。

ロゴ作成7

画面の左上には設定ボタンがあります。

ロゴ作成8

「GRID SIZE」を「1」にすることで、背景が白くなります。画面のスクリーンショットを撮ることで、大きなロゴを作りたいならここを設定しておきましょう。(無料でダウンロードできるロゴのサイズは 400×360 のサイズなので)

ロゴ作成9

画面左下の矢印ボタンで、ロゴを大画面で表示できます。スクリーンショットを撮るときは大きくした画面が良いでしょう。

ロゴ作成10

全部でいくつのイラストがあるのかわかりませんが、単語を打ち込めば素敵なイラストがたくさん出てくるので、いろいろ検索してみましょう。

画面右上のメニューボタンで、サイトのその他のサービスなどを見ることができますが、今回はロゴを作るだけなので不要です。

気にったロゴが作れたら、「SAVE LOGO」をクリックし保存しましょう。

ロゴ作成11

「DOWNLOAD LOW RES」で400×360ピクセルのpng画像をダウンロードできます。高画質の画像のダウンロードは有料です。

ロゴ作成12

名前とメールアドレスを入力すると、今回作成したロゴに再びアクセスできるようになります。後で手直ししたいなら、登録しましょう。

上にも書きましたが、無料で大きなロゴを作るなら、スクリーンショットを使うのがオススメです。Windowsならスクリーンショットボタンがありますし、macなら「Command + Shift + 4」です。

ただ、デメリットもあります。スクリーンショットの画像はJPGファイルになるので、背景が白い画像になってしまいます。なので、私は画像を別の無料ソフトで加工して、背景の白い部分を透明化させています。これが少し面倒かもしれません。

★☆↓↓毎日更新しているアメブロ↓↓☆★
東大卒の理系夫婦〜共働き2歳差育児

LINE@やっています。ちゃこと直接話してみたい方はクリックを^^
育児中のママ向けのメッセージをたま〜に配信しています♪
友だち追加
にほんブログ村 教育ブログ 幼児教育へにほんブログ村 子育てブログ 2015年4月~16年3月生まれの子へにほんブログ村 子育てブログ 2017年4月~18年3月生まれの子へ

スポンサーリンク

ツイッターのフォローボタン
日頃感じていること、子育ての様子をツイートしています♪

スポンサーリンク

感想・質問をお書きください

名前の欄はニックネームで構いません。また、コメントはスパム防止のため、承認制となっています。

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください