Page URL: https://blog.webjeda.com/jekyll-toc/
Why Table of Contents? I always liked the Wikipedia Table of Contents section which is present in almost every article. It gives a good insight to the whole article with headlines. Imagine, if that was not there; how hard it would be to find things that we are specifically looking for. Things like someone’s career, early life etc., Here is a sample page wikipedia page.
Page Headers
0 | HTTP/1.1 200 OK |
Date | Fri, 06 Nov 2020 02:50:28 GMT |
Content-Type | text/html; charset=utf-8 |
Connection | close |
Set-Cookie | __cfduid=d01d097da217fb33a813b9f9b1d5a05041604631028; expires=Sun, 06-Dec-20 02:50:28 GMT; path=/; domain=.webjeda.com; HttpOnly; SameSite=Lax; Secure |
cache-control | max-age=31536000 |
expires | Fri, 06 Nov 2020 03:00:28 GMT |
vary | Origin |
CF-Cache-Status | HIT |
Age | 0 |
Accept-Ranges | bytes |
cf-request-id | 063d0f7b56000000c134a64000000001 |
Expect-CT | max-age=604800, report-uri=”https://report-uri.cloudflare.com/cdn-cgi/beacon/expect-ct” |
Report-To | {“endpoints”:[{“url”:”https:\/\/a.nel.cloudflare.com\/report?s=uGOAsxrjLRBGodkP%2B4hssFB9R4YHUBZwTMTQCPoBAod8mEliCWDPIRlv3el7vpK1NNV7Q2ETCz8JRLnuO5d9zWsHCSw9IgrOiGJOgQPbaHVV”}],”group”:”cf-nel”,”max_age”:604800} |
NEL | {“report_to”:”cf-nel”,”max_age”:604800} |
Server | cloudflare |
CF-RAY | 5edb81d8793800c1-IAD |
Keyword Frequency
span | 470 |
class | 244 |
nt | 61 |
toc | 50 |
gt | 39 |
lt | 39 |
na | 30 |
it | 30 |
you | 27 |
contents | 20 |
Keyword Cloud
Jekyll Table of Contents – Wikipedia Look Webjeda UPI Apr Views nbsp Mins read Why I always liked the section which is present in almost every article It gives a good insight to whole with headlines Imagine if that was not there how hard it would be find things we are specifically looking for Things like someone s career early life etc Here sample page wikipedia have used similar kind TOC on my blog at least looks So here this post How add posts Step Download necessary filesStep Install script repositoryStep Call layout Initiate TOCStep Configuration or any matter really very short But long detailed provides and helps skipping desired topic There plugins generate but stayed away from them one reason want complete control website When using WordPress simple plugin called worked charm also had some color schemes available when dealing new can unstable m against something just waiting use Now let dive install If you kramdown as your markdown processor then following lines anywhere Which pretty do JavaScript span class p Do remove line will displayed toc You make look by adding style o nt Adding ‘Contents’ headline nf markdown-toc nd before nl content font-weight nb bold Using numbers instead bullets listing ul list-style decimal border px solid aaa padding em display n inline-block For work should preprocessor Mention congif yml file restart server na pi doesn t follow procedure below files zip jekyll-table-of-contents Thanks Alex Ghiculescu repository Don forget give star works downloaded has single js enough creating Place inside somewhere Maybe folder where all scripts placed call show up Usually require shown pages And everywhere wise default Add code appear lt src path gt only calling This like— — h post-title title time datetime date xmlschema post-date string personally particular places articles go into paste certain does belong fixed place first paragraph second so tedious task lot better itself than individual Use load div id above note info Before initiating logical wait till contents loaded Because uses headers initiation snippet waits completely type text javascript nx document ready kd function ‘ toc’ once DOM After rendering repo may same set styling cp important word actually Jump change between i tag nv assumes block cover wanted side added different handlers process differently create an anchor supported processors Kramdown redcarpet rdiscount changes config suggest engine github extensions data consider What don ‘h ensure mentioned considered other know configurations please visit through instructions given hope helped Ask doubts comments reading Also built free e Data Steps To Migrate F Site Scoring Snippets Ju Redirect Please enable view powered Disqus WebJeda company oriented towards building modern websites apps Quick LinksAboutContactSitemapThemesContact us Get email address Visit our All rights reserved updates JOIN US Blog best enabled