目次を表示する

cocoonは目次を簡単に表示できる

　cocoonはプラグインを入れなくても、Table of Contents Plusのような、ページの見出しを一覧した上のような目次を、自動で挿入できます。
　「cocoon設定>目次」が、その設定メニューです。説明にある様に、<h2>見出しがない本文には目次は表示されません。

h1タイトル（元のページタイトル表示）の非表示

　cocconの標準の設定では、ページタイトルは<h1>になっているので、目次がページタイトルの上に入りません。
　そこで標準設定のタイトルを非表示にして、ページ最上部に<h2> </h2>で、ページのタイトルを入れると、ページタイトルの上に目次が入ります。
　標準のタイトルを非表示にするもう一つのメリットは、パンくずリストを作る際に、標準タイトルを、パンくずリストの見出しとして使い、ぺージタイトルは、それとは別に設定できるところです。

目次の囲みに丸みをつける

　目次の囲みに丸みをつけるのは、Table of Contents Plusの場合とほぼ同じです。
　ついでに、サイドメニューのリンク色と同じにしました。

/*【ページメニュー中央表示】*/
/*TOC+ 角丸*/
#toc{
  margin-left: auto;
  margin-right: auto;
  border-radius: 10px;
  border-color: #aaaaaa;
  background-color:#f9f9f9;
  padding:5px;
}
#toc a{
  color:#1967D2;
}
#toc a:hover{
  color:#E53900;
}
.toc-content ol{
  padding:0px 0px;
  margin: 0px;
}