こんにちは、昨日ブログを始めて立ち上げたくるりです。
今回はワードプレスの無料テーマcocoonでブログ初心者がそれっぽいブログデザインをする記事です。
難しいことは何もしません（できません）。一緒にそれっぽさ重視のブログデザインをしていきましょう！
※今回はワードプレスによるブログの立ち上げ方法については説明しません。
ぼくはhitodeblogさんの記事を参考にさせていただきました。
今までパソコンにほとんど触ったことがなかった僕でも脳死でできました。hitodeblogさん、ありがとうございます！！
cocoonでのブログデザイン（やることは２つだけ！）
ブログ初心者の僕がしたブログデザインはたった二つだけです
たったこれだけでそれっぽい（それっぽさしかない）ブログデザインができます。
それでは行ってみよー！
①スキンの設定
一つ目にやることはスキンの設定です。
まずワードプレスを開いて、cocoonの設定画面に行きます。
開いたらスキンという部分をクリックします。
下にスクロールして自分の好きなスキンを選びます。画像の上にカーソルを動かすとイメージ画像が見れます！
ちなみに私はいつものコーヒーというスキンを使っています。
好きなスキンを選択したらさらに下にスクロールして、変更をまとめて保存で終わりです！
これで全体のデザインが決まったはずです。次はヘッダー画像の設定に移りましょう。
②ヘッダー画像の設定
ヘッダー画像とはブログを開いたときに一番最初に目に入ってくる画像のことです。くるりのブログでいうこれですね。
ブログを開くと一番最初に目に入ってくるということで、ここがそれっぽいとすごくそれっぽくなります（語彙）
いわばブログの顔です（知らんけど）
このヘッダーは要素として二種類に分かれています。
- 背景画像の設定
- ロゴの設定
この二つに分けて説明をしていきます。
１、背景画像を設定しよう
まず背景画像を探しましょう。
もちろん自分が撮った写真や自分で編集してロゴ入りの写真を最初から作っちゃうのもいいですが、初心者はそれができません。
そこで私は、背景画像はO-DANという無料写真素材サイトからとってきました。
商用利用もOKだし、ユーザー登録も必要なく日本語で検索もできるので便利です！
まず、O-DANにアクセスをします。
好きな言葉を検索して
画像をクリックします
ダウンロードを押して完了です。
次にヘッダー画像の設定です。
cocoonの設定画面を開いて
ヘッダーをクリックします。
下にスクロールしてヘッダー背景画像の選択をクリックします。
ファイルをアップロードをクリックして、先ほど保存した画像をドロップするか、選択してアップロードをして終了です。
（画像を選択する場所の上にある高さというところでヘッダーの大きさも変えられるみたいです）
２、ロゴを設定しよう
ロゴに関しては文字入力で設定することもできます。
（cocoonの設定⇒ヘッダー（下にスクロール）⇒ヘッダーロゴを入力）
しかしそれだと少し味気ないのでロゴも自分で作ってみましょう！
わたしはロゴはロゴメーカーというサイトで作りました。
こちらも無料で商用利用OKでとても簡単に作れます。
「ショップ名を入れて始める」の部分に自分のブログの名前を入れます。
＞を押すと、
こちらの作成画面でいろんな設定ができます。（ぼくはフォントを変えただけです）
テキストの下の部分にブログの副題を入れることもできます。（このブログでいう健康で～～の部分）
気に入ったら完成させるを選んで
保存形式とサイズを選んで保存して終わりです！
png（透過）を選ぶと文字の背景を透過させることができます。
サイズは大きいサイズで問題ないと思います（たぶん）
これで最後です。今作ったロゴをcocoonに設定します。
cocoonの設定⇒ヘッダーを開いて下にスクロール。
ヘッダーロゴの選択をクリックして
さっき保存したロゴをアップロードして完成です。
最後に下スクロールして変更をまとめて保存をしましょう。
これで本当に終了です。お疲れさまでした！
おわりに
お疲れさまでした！
これがブログ始めて一日目の私がそれっぽいブログデザインをつくった方法でした。
もしよければ参考にしてみてください。
ここまで読んでいただきありがとうございました！おわり！
コメント