2014-12-22 1 views
6

웹 페이지의 메뉴에 페이지의 제목에 대한 해시 링크를 추가하고 싶습니다. 웹 페이지는 지킬으로 생성되고 그것은 다음과 같이 기본 레이아웃이 보이는입니다 :지킬 : 해시 탐색을 위해 _include에 kramdown 목차를 배치하십시오.

<!DOCTYPE html> 
<html> 

    {% include head.html %} 

    <body> 

    {% include header.html %} 

    <div id="BigFatContainer"> 
     {{ content }} 
     {% include footer.html %} 
    </div> 
    </body> 
</html> 

그것은 다른 페이지로 이동을위한 메뉴가있는 헤더입니다. 나는 다음과 같은 Kramdown 명령의 도움으로 {{ content }}에 내용의 테이블을 추가 할 수있었습니다 :

* Point at which the TOC is attached 
{:toc} 

하나는 {{ content }}에서와 header.html로 내용이 테이블을 이동합니다 못생긴 자바 스크립트를 해킹 사용할 수 있지만, 그게 나쁜 해결책이 될거야. {:toc} 매크로는 header.html 안에 넣을 수 없으므로 Kramdown에서 구문 분석하지 않습니다. 예를 들어 this 플러그 인을 사용하여 Kramdown에서 구문 분석 했더라도 내용의 목차 대신 TOCheader.md을 출력합니다.

답변

0

@의 미로슬라프-nedyalkov 여기 궤도에 있었다. Bootstrap 문서를 보았을 때의 제안에 따라 Ruby Gem (jekyll-toc)을 사용하여 레이아웃 파일의 아무 곳에 나 TOC를 배치 할 수있었습니다. 당신은 전면 문제에서 그것을 가능하게합니다. 이제는 성공적으로 사용하고 있습니다 :

-3

toc 블록을 이동하는 이유는 무엇입니까?

이 내용은 toc이 페이지 콘텐츠의 일부라고 말하는 것이 맞습니다. 의미 론적으로 말하기.

여기의 문제는 문서 구조 수준이 아니라 발표상의 문제입니다.

이 경우 문제를 해결하려면 CSS를 사용하는 것이 좋습니다.

+0

긴 문서 또는 [this] (http://jcdesign.se/) 디자인을 보면 "TOC" 귀하의 문서의 메뉴 구조에. – Rovanion

+0

정보 아키텍처에 대한 저의 입장을 유지합니다. 언급 한 사이트는 페이지 탐색에 기본 탐색을 혼합하지 않습니다. 단일 페이지 사이트입니다. –

+0

downvote을 가져 주셔서 감사합니다. 정말 건설적입니다. –

0

Bootstrap website (아래로 스크롤하고 오른쪽 탐색 영역을 관찰하십시오)을 사용하는 것이 좋습니다. - 목차를 컨텐트 영역의 일부로 만들고 기본 탐색처럼 옆에 스타일을 지정하십시오. 이 접근 방법을 제안하는 주된 이유는 하나 이상의 페이지가있을 수 있다는 것입니다. 이 경우 모든 페이지마다 다른 페이지 탐색을 표시하고 페이지 간 탐색을 표시해야합니다. 더 당신이이 문서를 참조 할 수 있습니다 정보

-http://idratherbewriting.com/2015/01/20/implementing-scrollspy-with-jekyll-to-auto-build-a-table-of-contents/

+1

동의합니다. TOC는 기본 탐색이 아닌 페이지 내용의 일부입니다. –

+0

TOC를'{{content}} '외부로 이동시키는 OP 기본 목적을 다루지 않습니다. –

관련 문제