![見出し画像](https://assets.st-note.com/production/uploads/images/79149701/rectangle_large_type_2_bafd9f7f1c3244d2c29d0c5845b3b84e.jpeg?width=1200)
Cocoonのデザインをおしゃれにする簡単カスタマイズ小技集
無料テーマとして人気の高いCocoon。
高機能なブログが作れますが、さらにひと手間加えることで、おしゃれでクールなデザインにすることができます。
そこで、Cocoonのデザインをおしゃれにする簡単カスタマイズ法をご紹介したいと思います。
ブログのナビメニューにアイコンと説明を入れておしゃれにする方法
ブログの顔となるトップメニュー。
以下のメニューは通常のものです。
![](https://assets.st-note.com/img/1653292167151-yd4mrzPU9T.jpg?width=1200)
これにアイコンと説明を加えると、こんな風におしゃれに変わります。
![](https://assets.st-note.com/img/1653292343959-3itCWD9NOV.jpg?width=1200)
やり方は以下のページを参考にしてください。
キャッチフレーズの文字を太字にしてサイズと色を変える方法
Cocoonは標準だとキャッチフレーズの文字が小さくて見づらいです。
そこで、このキャッチフレーズの文字サイズや色、太字に変更する方法をご紹介したいと思います。
![](https://assets.st-note.com/img/1653292666407-H4caUTN5Tw.jpg?width=1200)
![](https://assets.st-note.com/img/1653292738951-K9dggSfOqv.jpg?width=1200)
やり方は以下のページを参考にしてください。
グローバルナビメニューに縦の区切り線を入れる方法
Cocoonの通常はグローバルメニューはシンプルです。
これに区切り線を入れるとおしゃれに変身します。
その方法をご紹介したいと思います。
![](https://assets.st-note.com/img/1653293002385-jqxAdQ37Zz.jpg?width=1200)
![](https://assets.st-note.com/img/1653293065375-tiOVJmIDVc.jpg?width=1200)
やり方は以下のページを参考にしてください。
Cocoonでタイムラインを使って記事を見やすくする方法
文字だけで伝わらないこともがタイムラインを使うと、一気に読みやすい記事になります。
そんなタイムラインを作る方法をご紹介したいと思います。
![](https://assets.st-note.com/img/1653293444469-3LQOIlEVOM.jpg?width=1200)
やり方は以下のページを参考にしてください。
TwitterやLINEでトップページの画像が表示されない時の対処法
TwitterにブログのURLをツイートしたときに、Cocoonのデフォルト画像が表示されることがあります。
そこで、好みの画像を表示させる方法をご紹介したいと思います。
![](https://assets.st-note.com/img/1653293822059-KKhmA5Qnru.jpg?width=1200)
![](https://assets.st-note.com/img/1653293868011-vO9Dw5JaDI.jpg?width=1200)
やり方は以下のページを参考にしてください。
Cocoonでランディングページ(LP)を作る方法
1カラムで細長い1ページのランディングページ(LP)。
作るには有料のサービスやテーマを使うのが一般的ですが、Cocoonで作ることもできます。
そこで、LPを作成する方法をご紹介したいと思います。
![](https://assets.st-note.com/img/1653294218978-RLRHUXSfX0.jpg?width=1200)
![](https://assets.st-note.com/img/1653294267462-EMcpKGy4J8.jpg?width=1200)
やり方は以下のページを参考にしてください。
まとめ
ということで、Cocoonのデザインをおしゃれにする簡単なカスタマイズ小技をご紹介しました。
カスタマイズ小技は随時更新しますので、ご期待ください。
ブログがうまく作れないという人のためにココナラで作成代行サービスも行っています。詳しくは以下のページをご覧ください。
この記事が気に入ったらサポートをしてみませんか?