ここでアフィリエイターデビューしませんか?
このサイトで学べることは?

【Cocoonカスタマイズ】コピペOK!サイト内のデザインをカスタマイズする方法まとめ!

サイトの作り方
この記事は 約2 分で読めます。

Cocoonは初期状態でもデザインが整っていますがカスタマイズすることでさらに綺麗なデザインのサイトを作ることができます。

いずれもコピペで実装できますので、
自分の必要な箇所だけカスタマイズ

スポンサーリンク

目次

【Cocoonカスタマイズ】目次にプラグインは不要!Cocoonの目次をカスタマイズする方法紹介
Cocoonではプラグインを利用することなく記事ごとの目次を表示させることができます。今回は当サイトで利用しているデザインにカスタマイズする方法を紹介します。

見出しh1~h6

【Cocoonカスタマイズ】見出しh1~h6をコピペでカスタマイズしよう!
Cocoonの見出し(h1~h6)についての装飾CSSを掲載しています。デフォルトのデザインでも問題ないですが、余裕があればサイトコンセプトに合わせたカスタマイズをしてみましょう。

グローバルナビ

【Cocoonカスタマイズ】コピペで楽々!グローバルナビをおしゃれにカスタマイズしませんか?
本記事では、「Cocoon」を使用したサイトのグローバルナビのカスタマイズ方法を紹介しています。 初心者でHTML&CSSの知識がなくてもコピペのみで簡単にカスタマイズできます。

サイドバー

【Cocoonカスタマイズ】サイドバーをカスタマイズして回遊率UPを目指そう!
サイドバーはユーザビリティを高めて、回遊率を高めることができます。今回はCocoonを利用したサイトのサイドバーの見出しデザイン、配置するべきコンテンツを紹介します。

固定ページ

【Cocoonカスタマイズ】TOPページをコピペカスタマイズでおしゃれにしよう!
Cocoonを利用したサイト、ブログのTOPページのカスタマイズ方法を紹介しています。初期状態のままの人は、コピペカスタマイズでおしゃれにしてみましょう。

エディタ風表示

【Cocoonカスタマイズ】ソースコードをエディタ風に表示するカスタマイズ方法を紹介!
Cocoonではソースコードをサイト上でエディタ風に表示させることができます。ユーザーにとってわかりやすい表示方法となるため、ソースコードを掲載しているサイトの人は参考にして下さい。

行間

行間、段落の幅で一気に見やすくなる!?カスタマイズするCSSを紹介!
行間や段落の幅を調整すれば、文章を読みやすくすることができます。今回は、行間、段落のカスタマイズするCSSを紹介します。

アピールエリア

【Cocoonカスタマイズ】アピールエリアを使って読んでほしい記事は目立たせよう!
wordpressのテーマ「Cocoon」ではアピールエリアを使うことで、読んでほしい記事を目立たせることができます。今回はアピールエリアの表示、カスタマイズ方法を解説します。

コメント