티스토리 자동 목차 (TOC) 만드는 방법 구글 SEO

자동 목차 만들기

티스토리를 운영할 때 자동 목차 (TOC)를 이용해서 글을 쓰게 되면 구글 SEO에 조금 더 적합한 글을 쓸 수 있습니다. 초보자도 쉽게 할 수 있는 방법으로 포스팅하겠습니다. 차근차근 따라오시면 됩니다. 구글 SEO가 좋아하는 방법으로 글을 쓰게 되면 구글 상위 노출에 유리하기 때문입니다. 

 

 

티스토리 자동 목차 (TOC) 만드는 방법 

티스토리를 운영하게 되면 스킨 편집을 잘 사용할 줄 알면 도움이 많이 됩니다. html 을 잘 알지 못하더라도 필요한 기능들을 검색하면 자세하게 설명이 나오기 때문에 그대로 따라서 붙여놓기 정도만 하더라도 운영이 가능합니다. 오늘도 마찬가지로 복사하고 붙여놓기를 잘하시면 됩니다. 아래의 목차들을 잘 살펴보시고 순서대로 따라서 하시면 되겠습니다. 

 

 

 

목차

티스토리 html

두개의 부분에 아래의 코드를 삽입하면 됩니다. 

출처:티스토리

1. 스킨 편집 -> html 편집을 클릭합니다. 
2. </head> 윗부분의 아래의 파일을 복사하여 붙여 넣기 합니다.

<!--  목차 커스텀 스크립트 시작-->
<script type="text/javascript" src="./images/jquery.toc.min.js"></script>
<!--  목차 커스텀 스크립트 끝 -->

 

3. </body> 윗부분의 아래의 파일을 복사하여 붙여 넣기 합니다.

 

<!--  목차 커스텀 스크립트 시작-->
<script type="text/javascript">
$(function(){
$("#toc").toc( {content: ".entry-content", headings: "h3" , top: -90, isBlink : true, blinkColor : '#21B9DE' } )
});
</script>
<!--  목차 커스텀 스크립트 끝-->

티스토리 CSS

티스토리 스킨 편집에서 CSS 를 누릅니다. 가장 하단에 아래의 파일을 복사해서 붙여놓기 합니다.

출처:티스토리

/* 티스토리  목차 - TOC */

.book-toc {
border: 1px solid #ccc;
padding: 10px 10px 0px 15px;
background-color: #f5f5f5;
}

.book-toc ul {
list-style-type: decimal;
}

.book-toc p {
font-weight: 550;
margin-bottom: 7px;
}

#toc * {
font-size: 17px;
color: #676767;
}

#toc a:hover {
color: #f00;
}

#toc ul {
margin-bottom: 0px;
margin-top: 5px;
}

#toc > li {
margin-bottom: 15px;
}

#toc {
margin-left: 10px;
}

#toc > li > ul li {
margin-bottom: 5px !important;
}

티스토리 소스 다운로드 (파일)

아래의 파일을 다운로드 받습니다. 압축파일로 받았을 경우는 압축 파일을 풀어서 두개의 파일을 업로드하면 됩니다. 

출처:티스토리

jquery.toc.zip

0.00MB

서식 등록하기

티스토리 관리화면에서 서식관리를 클릭합니다. 서식관리에 등록을 해 놓으면 글쓰기를 할 때 쉽게 사용할 수 있습니다. html로 등록해주면 됩니다. 

출처:티스토리

서식에 아래의 파일을 html로 붙여넣기 하면 됩니다.

<p>&nbsp;</p>
<div class="book-toc">
<p>목차</p>
<ul id="toc"></ul>
</div>
<h3 data-ke-size="size23">제목1</h3>
<h3 data-ke-size="size23">제목2</h3>

 

 

집에서 돈 벌 수 있는 방법들 모음 (디지털 노마드)

집에서 돈 벌 수 있는 방법들 모음 (디지털 노마드)

[집에서 돈벌기] 티스토리로 돈벌기 키워드 검색량 조회 방법 (네이버 / 구글)

[집에서 돈벌기] 티스토리로 돈벌기 키워드 검색량 조회 방법 (네이버 / 구글)

 

2022년 네이버 키워드 검색 / 구글 키워드 검색 무료 Tool 추천 사이트 TOP 13

2022년 네이버 키워드 검색 / 구글 키워드 검색 무료 Tool 추천 사이트 TOP 13