ブログ初心者がWordPress無料テーマ「Cocoon」でカンタンにそれっぽいデザインのサイトを構築する

blog-log-eye-002 ブログ運用

こんにちは、じあです!

今回は定番WordPressテーマ「Cocoon」を使用して、このブログで実際に使用しているカスタマイズをご紹介していきます。

右も左もわからない私のような初心者の方へ、なにか参考になれば幸いです。

スキン設定

Cocoonにはたくさんのスキンが存在しています。

このブログでは「凸凹」「ふわっと追加」を併用しています。

この設定も初心者の私にはつまづきポイントだったので解説していきます。

WordPressダッシュボードから「Cocoon設定」を選択します。

「スキン」の中から「ふわっと追加」を選択します。

ここがつまづきポイントなのですが、「表示スキン(ベース)」にて「凸凹」を選択します。

じあ
じあ

本当に初心者なので「ふわっと追加」と表示スキンの併用の設定がわからなかった…

「ふわっとタイプ」は4番を選択することで、基本的にはJIALOOMと同じ設定になります。

スキンのカスタマイズ

続いてスキンのカスタマイズです。「凸凹」ではカラーと角の丸さをカスタマイズできます。

WordPressダッシュボードから「外観」→「カスタマイズ」を選択します。

開いたページの中から「Neumophism」を選択します。

開いたページの中から色を白にします。

このままだと検索ボタンの文字が白塗りになってしまうので、変更します。

「追加CSS」を選択します.

上記画像のように追記します。

これでJIALOOMと同じ設定になりました!

続いてサイドバーの設定をしていきます。

サイドバーにプロフィールを表示

サイドバーにプロフィールを表示させます。

そのためにまずはプロフィールページの作り方を紹介します。

WordPressダッシュボードから「固定ページ」→「新規固定ページを追加」を選択し、プロフィールページを作成します。

プロフィールページを作成したら、ダッシュボードにもどり「ユーザー」→「プロフィール」を選択します。

色々設定できますが、そのなかから「プロフィール情報」を設定します。

続いて、「プロフィール画像」を設定し、先ほど作成したプロフィールページのURLを「プロフィールページURL」に入力します。

最後に必ず「プロフィールを更新」を押しましょう。

じあ
じあ

私は押し忘れて何度やり直したことか…みなさんはお気をつけて。

これでひとまずプロフィールは作成できました。続いてサイドバーに表示させましょう。

WordPressダッシュボードから「外観」→「ウィジェット」を選択します。

開いたページの左半分のエリアから「プロフィール」を探します。

探した「プロフィール」を右半分のエリアの「サイドバー」の中にドラッグ&ドロップします。

これで設定は完了です。お疲れ様でした!

おわりに

ここまでお読みいただきありがとうございました!

無事設定はできたでしょうか?

私もブログを初めて間もないので、つまづいたポイントは共有していければと思います。

この記事を参考に、ぜひご自身にあったデザインをカスタマイズしてみてください。

それではまた次の記事でお会いしましょう。

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