コピペでOK!bloggerで記事内に目次を作る
公開日: 2015年12月28日月曜日 bloggerカスタマイズ
★読み進めると目次に戻ってジャンプできる目次を作ろう★
目次を作って記事を載せているサイトは多く見かける。
しかも、読み進めるとワンクリックで目次に戻る。
自動生成できるコードとやらも存在するが、
初心者うさどんには使いこなせるはずもなかったので、
いろんなサイトを参考に、コピペで済むようなコードを作成した。
それがこちらである。
<h2>入れたい小見出し</h2>
<h3 id="mokuji">目次タイトル</h3>
<ol>
<a href="記事のURL#title1"><li>目次内容1</li></a>
<a href="記事のURL#title2"><li>目次内容2</li></a>
<a href="記事のURL#title3"><li>目次内容3</li></a>
</ol>
<h3 id="title1">目次内容1と同じ文字</h3>
<a href="記事のURL#mokuji">目次に戻る</a>
<h3 id="title2">目次内容2と同じ文字</h3>
<a href="記事のURL#mokuji">目次に戻る</a>
<h3 id="title3">目次内容3と同じ文字</h3>
<a href="記事のURL#mokuji">目次に戻る</a>
表示するとこうなる。
入れたい小見出し
目次タイトル
目次内容1と同じ文字
目次に戻る
目次内容2と同じ文字
目次に戻る
目次内容3と同じ文字
目次に戻る
使い方
メモ帳にそのままコピーし、それを雛形として使うと便利である。
bloggerには投稿の雛形を作成できる機能があるが、
それを使用したところ記事のURLがおかしくなる怪奇現象が起きた。
なので、記事のURLをひとつづつ入力するという作業が生じる。
記事のURLは、投稿画面を開くと右にパーマリンクという項目があるので、
それを開くと出てくる。
※2016/05/06追記
注:パーマリンクの日付表示部分(20**/01)は、下書き中に月が替わると翌月に表示が変わってしまう(20**/01→20**/02)のでリンクの訂正が必要になる。※
いちいち入力するのは大変なので、
メモ帳の置き換え機能を使うとよい。
まとめ
おそらく目次に関してはもっと要領のいい方法が存在する。
しかしblogger初心者がコピペでぱっと使える方法はこれしか思いつかなかった。
とりあえずジャンプ機能が付いた目次が欲しい、という場合には十分使える。