티스토리 블로그 프로그레스바, 스크롤 진행률 적용시키면 블로그 글을 읽을 때 글 상단에 진행률이 표시 된다. 해당 페이지를 읽어내려가면서 글 상단을 보자.
위 글은 오기세이 스킨에 브레드크럼(이동경로)에 대한 글이다. 글을 읽어 내려 갈수록 주소창 아래 프로그레스바(Progress Bar)를 볼 수 있다.
프로그레스바를 적용하기 위해서는 먼저 스킨 편집에 있는 html편집에 들어가서 HTML 탭에서 아래 코드를 <body> 태그 안에 넣어주면 된다.
<!-- toc script end-->
<!-- start progress bar --> <script type="text/javascript" src="https://rawcdn.githack.com/mburakerman/prognroll/0feda211643153bce2c69de32ea1b39cdc64ffbe/src/prognroll.js"></script> <script type="text/javascript"> $(function() { $("body").prognroll( {color:"#FF9800"} ); $(".content").prognroll({ custom:true}); }); </script> <!-- end progress bar -->
prognroll({color:"#FF9800"}); 태그에서 바의 색을 변경할 수 있다.
'블로그' 카테고리의 다른 글
티스토리 블로그 접속 시 페이지 로딩 화면 나오게 하는 방법 (0) | 2023.02.15 |
---|---|
블로그 본문 상단 광고 2개 - 오디세이 스킨 - 티스토리 블로그 (0) | 2023.02.07 |
티스토리 이동경로·카테고리 경로(Breadcrumb navigation) 적용 (0) | 2023.01.12 |
티스토리 블로그 모바일 이미지 사진 확대 축소가 안될 때 (10) | 2022.02.25 |
티스토리 블로그 글 작성 시 '중간 광고' 삽입 방법 (0) | 2021.08.03 |