スキナモノート

SEOやマーケティング、WEB系に役立つ情報を発信しています。好きな事を中心に、文房具の記事もたまに。

そうだ、目次を小見出しまで対応させてみよう。

このエントリーをはてなブックマークに追加

↑が目次。PC記事ページのみに表示されます。

f:id:tubamenote:20150331102639j:plain

今はフリーのJQUERYをちょこっと拾ってきて目次を試作しています。
最初に、はてなブログ仕様にするのに少し戸惑いましたが、一応小見出しまで対応出来るみたいですね。
下の大見出しから小見出し迄を目次で表示しています。

大見出し

H3の大見出し

中見出し1

H4の中見出し。

中見出し2

H4の中見出し。

小見出し

H5の小見出し。

大見出し2

H3の大見出し。

中見出し

H4の中見出し。

 

ただ、色々問題がありまして。

bulldra.hatenablog.com

いつも楽しく読ませていただいています。


『太陽がまぶしかったから』より利用させていただいている、関連記事を表示出来る【あわせて読みたいG】というプログパーツがあるのですが、【あわせて読みたい】と言う部分迄を目次で拾ってしまいます。ここにH4かH5が使われているのでしょうか。

合わせて読みたいGは、今は一度表示させないようにしているのですが、便利なので今後も使っていきたいと思っています。
目次の方で上手く拾わないように出来るかなというところ。後はスムージングもかけないといけないですね。

現在は記事上に表示させています。でも本当は、記事中の出だしの文章の下辺りに入れたいんですよね。一応記事中にも目次を表示する事は出来るのですが、トップページの記事一覧画面になると、表示されている記事全てのH3からH5を読み込んでしまうんです。続きを読む。を表示させればこの問題も解決出来るのですが、どうしたものでしょうか。


もう少しいじってみよう!っと一人言のような記事でしたが、お読みいただきありがとうございます。感謝

関連記事