본문 바로가기

티스토리 블로그 최근글, 인기글 분리하기 | 북클럽 스킨

by Living T 2024. 2. 1.
728x90

타이틀

 

 

목차

 

    북클럽 스킨 | 최근글, 인기글 분리하기

    이번은 티스토리 북클럽 스킨의 사이드바에 있는 '최근글과 인기글'을 분리하는 방법에 대해 알아보도록 하겠습니다.

     

    기본적으로 '최근글과 인기글'은 겹쳐서 나오기 때문에 한눈에 보이지 않는다는 단점이 있죠, 나의 글을 더 많이 노출시켜 더 오랜 시간 내 블로그에 머물며 다른 글도 볼 수 있도록 하기 위해 '최근글과 인기글'을 분리하여 사용하시는 분들이 많은 걸로 알고 있습니다.

     

    분리하는 방법을 알기 위해 검색을 해보면 여러 방법이 나오지만 제가 사용한 방법이 가장 간단하고 북클럽 스킨의 기본틀도 변형되지 않습니다.

     

    참고 블로그 : 티스토리 블로그 최근글, 인기글 분리하기 (북클럽 스킨) (steamedu123.com)

     

    최근글과 인기글의 분리 전과 후 비교

    아래 그림처럼 겹쳐 저 있는 최근글과 인기글이 아래위로 나누어집니다.

     

    최근글, 인기글 분리

    728x90

     

    스킨편집

    1. '관리자 홈'에서 꾸미기 > 스킨 편집 > html 편집 > HTML'로 들어갑니다.

    최근글, 인기글 분리하기


     

    2. Ctrl + F를 이용해 <div id="popular" class="tab-list">를 검색합니다.

     

    <div id="popular" class="tab-list">

     

    최근글&#44; 인기글 분리하기


     

    3. 아래 코드를 복사 후 이미지처럼 <div id="popular" class="tab-list">위에 붙여 넣어줍니다.

    <!-- 최근글/인기글 분리 -->
    </div><div class="post-list tab-ui">
    <!-- 최근글/인기글 분리 끝 -->

     

    최근글&#44; 인기글 분리하기


     

    4. 마지막으로 '적용'을 눌러 저장새로고침을 해보시면 변경된 모습을 확인할 수 있습니다.

    728x90

     

    추가 팁

    인기글과 최근글의 <div id="recent" class="tab-list"><h2>최근글</h2>과 <div id="popular" class="tab-list"><h2>인기글</h2>의 코드의 위치를 서로 바꿔주면 리스트 순서가 변합니다.

     

    최근글&#44; 인기글 분리하기

     

    인기글

    <div id="popular" class="tab-list">
    <h2>인기글</h2>

     

    최근글

    <div id="recent" class="tab-list">
    <h2>최근글</h2>

     

    마무리

    이렇게 최근글과 인기글 사이에  <div class="post-list tab-ui">를 추가하여 간단하게 분리하는 방법에 대해 알아봤습니다.

    방문하시는 분들의 가독성이나 머무는 시간에 도움이 되길 바라봅니다.

     

    마지막으로 이번 포스팅은 북클럽 스킨 전용으로 다른 스킨을 이용하시는 분은 적용이 불가능 합니다!

    오디세이 스킨은 티스토리 오디세이 스킨 최근글과 인기글 분리하기 (tistory.com)를 참고하세요!

     

    리빙 마감

    "쿠팡 파트너스 활동을 통해 일정액의 수수료를 제공받을 수 있습니다"

    반응형

    ▸Googie 광고


    loading
    top