こんにちは、さくらです。
Cocoonユーザーのブログ初心者の方、オシャレなブログを見たら「有料テーマを使っているんだ」と決めつけてしまっていませんか?
実際にはすごくオシャレなサイトをCocoonで作っているブロガーは沢山います。
今回は沢山のCocoon愛用者の方にご協力頂き、「自分のブログのカスタマイズの推しポイント」を語って頂きました。
実際にそのカスタマイズを行う方法も併せてご紹介していくので、一緒に有料テーマに負けないオシャレなブログ作りをしていきましょう!

みなさん、色んな方法を組み合わせてカスタマイズしていますが、今回は分かりやすいようにカテゴリーを分けてご紹介させて頂きました!
スキンをもとに作ったカスタマイズ
Cocoonには「スキン」というワンクリックで簡単にブログのデザインができる機能があります。
初心者の方でもスキンを使うだけで簡単にオシャレにカスタマイズができるのでお勧めです。
スキンをベースにして、さらにオシャレになるようにカスタマイズしている素敵なブログをご紹介していきます。
SILK
SILKの特徴についてはこちらをご参照ください。
ももぷーぶろぐ
~平凡アラサー女子でも楽しいブログを書きたい~
アイキャッチやブログカードをCanvaで作成して統一感を出しました♪Canva使えばcocoonでもおしゃれになります。

ミックススキン
ミックススキンの特徴はこちらをご参照ください。
ミックスブルー
ブログ となりの隣人
水族館で撮影した写真と合わせて青を基調としたシンプルなデザインにしました。タイトルはGoogleフォントから拾ってきた書体をCSSで挿入しています。

No Worries Life
~買い物依存症が配当金月額5万円を目指してみた~
『シンプル イズ ザ ベスト』で有料テーマのSANGOをモデルにデザインしました。
サイドバーのウィジェットのメニュー名をCSSコードを使って淡色ブルーにまとめています。

しょとぱぱ日記
Cocoonの基本デザインを崩さず、シンプルでオシャレなデザインのスキンなので気に入っています。特に見出しが好きです。

Season
Seasonの特徴についてはこちらをご確認ください。
Spring
ミキサクの夫婦deブログ
ヘッダーメニューにFont awesomeのアイコンを表示して、ブログのイメージを春らしくしました!

アイコンを入れる方法についてはこちらで解説しています。
ぶちぶろぐ
夫婦の暮らしと外遊び
Cocoon設定のカルーセルを付けて、クリック1つでちょっと有料感を出したところと、
スキンのH2の見出しがお気に入り!

カルーセルの入れ方についてはこちらで解説しています。
Summer
ちのblog
私はメンダコを推しているので海らしさがあるところです!色も濃い青や水色を基調としており、色合いのバランスの良さが気に入っております。

青二才ブログ
【青二才ブログ】というブログ名にちなんで水色で全体をまとめています!
オススメカードをcanvaでアイコンぽくしてます!

Winter
マネちる.com
CSSコードを使ってカスタマイズした目次、検索窓、サイドバーのカテゴリーの一覧がお気に入り!全体的にかなりカスタマイズをして、おしゃれな感じになっていると思っています。


カスタマイズ記事も複数書いていらっしゃるので、要チェック!
とりまーる。
トリマーのお悩み解決ブログ
固定ページを作成して、トップページをサイト型にしました。
海の画像に合わせてブルー系のスキンを使っています。

固定ページを使ってサイト型のトップページを作る方法はこちらをご参照ください。
イノセンス
イノセンスの特徴はこちらをご確認ください。
大人ギター女子のブログ
軽音部かあさんブログ
PCでもスマホでも変わらないスッキリした色合いが気に入ってます!
読みやすいアイキャッチ画像で簡単に記事を選んでもらえるようにしています。

今日も地球は回る
ブラック企業から眼鏡屋に転職して人生が変わった男の話
見出しやプロフ背景を追加CSSにて変更しております。シンプルで読者の方に見やすいことをモットーとして広告も記事に付けているだけにしています

nobo-blog
メインカラーを緑にして、親しみやすい雰囲気をイメージして作りました

ichiroblog.com
サイドバーはプロフィール表示とよく読まれている記事表示などをさせているのがお気に入り!

Hygiene
Hygieneの特徴についてはこちらをご参照ください。
めざめよスラッカー
ようやく頑張り始めたアラサー女が伝えたいこと
トップぺージの表示を新着順からカテゴリ別に表示されるように変更しました!


実際にこのカスタマイズをした時の記事もご提供頂きました!
アリス
アリスの特徴はこちらをご参照ください。
ゆでたまごらいふ
子育て・仕事どっちもできる人といわれたい!たまこ♪のブログ
ミントグリーンの色合いがとにかくかわいい!
ヘッダーやカテゴリー画像も色合いを統一してかわいくしました。

tecurio
tecurioの特徴はこちらをご参照ください。
tecurio mango
子育て・教育と、お金に関するお役立ち情報を発信
30代ワーママよし子の子育てライフ
9種類から好きな色(グラデーション)を選べるところです。 私は気持ちが明るくなれるテクリオ・マンゴーが気に入っています♪ 不明点があるときはスキン開発者の風塵さんに相談すると、丁寧に答えてくださいます。

tecurio moon
レイトンのインフォブログ
全体的に落ち着いた色合いで あんまり派手ではないけど 格好良く見える ところがお気に入りです。

tecuhio soil
いつものローズ
いつものローズの特徴はこちらをご参照ください。
ズボラハック
可愛らしすぎない大人ピンクとカルーセル!アラフォー主婦向けに落ち着いたピンク色を!カルーセルは簡単なのに一気にブログが華やかになるのでオススメです。

カルーセルの入れ方はこちらの記事で解説しています。
COLORS
COLORSの特徴はこちらをご参照ください。
ブルー
FIREへの道
トップページに印象の残る画像を設置しています。

グリーン
知って得する買って得するブログ
自分の名前の”クロコダイル”に合わせて緑色のスキンを使っています。

絵本の森
全体的に緑で森感がでるように作りました またたくさんの絵本に出会えるようにカルーセルを設置しています。

Fuwari和色
Fuwari和色の特徴はこちらをご参照ください。
海老茶
ゆうみのノウハウブログ
スキンの柔らかい配色がお気に入りです。
トップページの画像もベージュやピンクと、柔らかい色に仕上げました!

Bizarre-food
Bizarre-foodの特徴はこちらをご参照ください。
ピンクワイン
沖縄にいる普通の主婦・ハルママのブログ
ヘッダーとおすすめカードをCanvaで作って、息子の大好きなフルーツで揃えてカラフルに仕上げています。

おすすめカードの作り方はこちらの記事をご参照ください。
プラグインを使ったカスタマイズ
「プラグイン」という拡張機能を使ったカスタマイズのご紹介です。
ガクチリ!
灘・東大卒 ガっくんの学知利行(がくちりこう)
「Simple Author Box」というプラグインを入れて、読んで頂いた方に自分のことを覚えて頂けるように記事の最下部にプロフィールを入れるカスタマイズをしました。

失敗から学ぼう!
スキン設定なし、妻が好きな黄色をキーカラーにして「シンプルで分かりやすい」を目指しています。記事も「なかじ」さんから頂いた「SIMPLE BLOG DESIGN」で黄色メインに仕上げてます!

Cocoon設定を使ったカスタマイズ
クリック一つでオシャレなカスタマイズができるCocoon設定を駆使したブログをご紹介していきます。
Cocoon設定についてはこちらの記事で解説をしています。
ツースブログ
「カラム」タブの「コンテンツ枠線色」を設定して、くっきり見せている所が推しです。

ラテミルブログ
カルーセルとおすすめカードを設定して、読みたい記事を探しやすくしています。
最近アイキャッチ画像を作り直したこともあって、華やかになりました。

おえかき内科医のキャンプ沼
おすすめカードがお気に入りです。

笑顔を贈る出産祝い
トップページを見やすさを重視してカテゴリーごとに整理しました。特にモバイルで見やすいように、カテゴリーごとの掲載記事数は少なめに設定してます。

カメラと暮らすととぽんblog
カルーセルを設定しただけで格段にページレベルが上がりました。
これがあるだけで初心者でも完成されたページに見せることが出来るのでポイントです!

くずな自分を好きになりたい
~くいしん坊ITエンジニアの雑記ブログ~
ファビコンの設定がお気に入りです。 大好きなスイカのモチーフでなんとなく顔に見えるような?小さいことだけれど大満足。

真面目すぎる大学生がWebと文章でFIREする物語
シェアボタンの上にメッセージつけたのがお気に入りです!

えるさんが執筆された、ブログでよく使う「色付きボックス」 「かわいいリスト」「クリックされやすいぷるぷるボタン」などのコピペコード記事も要チェックです!
Our comfy home
ブログ全体の色味を合わせてシンプルに、且つアイキャッチは少しデザインで遊んで「全体をデザインする」ことを意識しました。
サイトアイコンとトップへ戻るボタンは赤でワンポイントを入れています。

のじ日記
サイトカラーを3つに絞り記事やアイキャッチもカラーを統一することでまとまりのあるサイトにしています。

コードを使ったカスタマイズ
「コード」と聞くと難しいイメージを持つ方も多いとは思いますが、自分にプログラミングの知識がなくてもコピペOKなコードを公開しているサイトは沢山あります。
コードのコピペの仕方についてはこちらの記事で解説をしています。
さかナースLog
モバイルで見た場合のグローバルメニューをCSSでスライドできるようにしました♪またヘッダーとフッターのボタンのアイコンを浮き輪や魚にして海感を出すようにしました。

とととんぐ
ヘッダーメニュー、フッターメニュー共にFont Awesomeでアイコンを入れて分かりやすくしました。 おすすめカードをアイキャッチと同じカラーで作り全体の統一感を出しました。

アイコンの入れ方はこちらの記事をご参照ください。
ハイレグブログ
サイドバーのプロフィールに表示しているSNSアイコンがお気に入り!スタイルシートの編集だけで、見やすくすることができました!

いぬねこブログ
ブログカードです。スニペット表示を無くしたり、見た目のデザインをシンプルにしました。

20代東京ミニマリスト
スマホで見た時に、画面下に目次ボタンを使えるようにしたこと

出張おじさんブログ
カテゴリーのアイコン表記がお気に入りです!

カテゴリーのアイコン表記の方法はこちらの記事をご参照ください。
まんもすばなな
投稿のマーカー線を自分のブログのテーマカラーにしている所がお気に入りです。

たらまよログ
カラフル=花をイメージしてカスタマイズしています。CSSコードを使って、エントリーカードの角を丸くして、柔らかい雰囲気にマッチするようにしたのがお気に入りポイントです!

ジュネーブ磯六の秘密の勉強会議事録
背景のカラーコードとアイコンを合わせた統一感あるページが拘りです。

初心者のWebサイト勉強
記事を読んでいる時に画面の上部に見出しバーが出るようにしました!スクロールに合わせて切り替わるので、自分が今記事中のどこを読んでいるのか見失いにくいのがお気に入りです!

あなたのCocoon(繭)を羽化させるブログパーツを作成!!
ブログセンターそらしど
インデックスページの新着記事一覧にリボンを付けました!

リボンの付け方についてはこちらで解説頂いています!
なおらんの小部屋
¥100ショップ店員アラカン主婦の雑記ブログ
目次とサイドバーのカテゴリーを頑張ってみました。50代にはなかなか大変でしたが、見栄えが良くなり気に入ってます!

目次のカスタマイズ方法はこちら!
サイドバーのカテゴリーのアイコン表記の方法はこちら!
「余白」を意識したカスタマイズ
Cocoonのカスタマイズ記事を書いているSayuさん(@ulovenglish)が書いたこちらの記事を参考にして、ブログ全体に「余白」を取り入れたのが推しポイントと語ってくれた方々をご紹介していきます。
最初はこの記事を書いたSayuさんのブログです。
U Love English
あなたももっと英語がスキになる
オシャレなサイトHPの様な雰囲気にしてます。スキンは使っていませんが、逆にスキンなしでここまでできる!って所が推しです。おすすめカード、ヘッダーの色を統一して作った余白がポイントです!

『保健師にっき』
トップ画と背景の色を同じにして、余白を意識しました
トップ画は色味に統一感をもたせて、優しい雰囲気がでるように目指しました!

レモンの読み物。
大人のやり直し英語。
カフェのようにくつろいでもらいたくて、ゆったりした雰囲気にしました。
ヘッダーメニューとサイドバーのカテゴリーのアイコンと、ヘッダー・おすすめカード・ロゴの背景色の統一がお気に入り!

ヘッダーやサイドバーのメニューにアイコンを入れる方法についてはこちらで解説をしています。
アイキャッチに拘ったカスタマイズ
いいねこ。blog
薄い色と濃い色でメリハリをつけつつ、柔らかい印象に仕上げたアイキャッチがとてもお気に入りです! ブログ全体の色もCSSで同じ色に統一してアイキャッチがハッキリ見えるようにしました!

とあblog
スキンを使わずに地中海をイメージして、theシンプルオシャレを目指しています。
アイキャッチやカテゴリーの一覧のデザインに拘っています。

いろはにおかね
アイキャッチに力を入れているので、全体的にシンプルにしてアイキャッチを目立つようにしています。

元NICU看護師の暴露部屋
カテゴリー毎にテーマカラーを決めて、アイキャッチのカラーを統一、記事毎のカテゴリーが分かりやすいようにしてます。カルーセル設定と人気記事ランキングを載せて、人気の記事を探しやすくしてます!

カルーセルの設定方法はこちらの記事をご参照ください。
フリーアイコンを使ったカスタマイズ
オリジナルのイラストを使ったカスタマイズ
NYALA
お金・仕事の悩みを減らす
自分でイラストを描いて、自分だけのサイトを作っています!
他の人と絶対に被らないので、気に入っています。


このかわいい猫の「らむねこちゃん」(@kuruneko_cat)も要チェック!
まとめ:Cocoon愛用者のカスタマイズの推しポイント
有料テーマはとても素晴らしいものだと思いますし、私も次にブログを立ち上げる時は有料テーマにする予定です。
でも、本当はCocoonでも出来ることを「無料テーマだからできないんだ」と思い込んでしまうのはすごくもったいないです。
ブログを始めた当初の私が「有料テーマにしないとできない」と思っていたことは全てCocoonで出来ることでした。
それをもっと知ってもらいたい!!!
そんな気持ちに共感をして今回の記事にご協力してくださったCocoon愛用者の皆さま、本当にありがとうございました。
Cocoonのカスタマイズ方法をまとめた記事も書いているので、一緒にオシャレなブログ作りをしていきましょう!!
Cocoonの良さをよく分かった上で、やっぱり有料テーマが欲しい!という方には、各テーマのユーザーに「購入の決め手」と「お気に入りポイント」を聞いたこちらの記事がおすすめです。
最後まで読んで頂き、ありがとうございました!
コメント