블로그/스킨수정

티스토리 오디세이 스킨 최근글과 인기글 분리하기

사람사물상황 2020. 12. 12. 01:13

티스토리 오디세이 스킨 최근글과 인기글 분리하기

안녕하세요 사람사물상황입니다.

 

이번엔 오디세이 스킨에서는 최근글과 인기글이 합쳐서 표현되는데 이것을 분리 해보겠습니다.

먼저 이 방법을 찾아보고자, 북클럽의 최근글 인기글 분리하는 방법과 태그를 참고하여 해보려했으나 잘 되지 않았었습니다. 똑같이 하면 될 줄 알았는데, 해당 방법 글을 쓰신 분들에게 문의해보니, 두 스킨이 비슷하긴한데 id와 class라는것을 맞게 해야한다고 하더군요. 그러면 태그를 짜야하는데, 나름 혼자 짜봤지만 역시나 잘되지 않았었습니다.

그래서 마지막으로 커뮤니티에 질문글을 남겼었는데, 다행히 자고 일어나니 답변이 달려있었습니다.

그래서 감사하게 방법을 알 수 있었습니다. 출처 링크를 달아 글을 쓰고자 하였으나, 굳이 안달아도 된다고 하시고, 약간 익명성은 아니지만 블로그와 연계되는곳이 아닌 정보만을 공유하는 커뮤니티다 보니 감사하다는 말만 달고, 제 블로그에 방법을 올리려 합니다.

서론이 길었지만 감사하다는 말을 여기서 다시 드리고 시작하겠습니다.

 

1. 방법

간단하게 html 태그를 교체를 해주면 됩니다.

html 890행 즘에 있는 다음 태그를 삭제하고 교체합니다.


              <s_sidebar_element>
                <!-- 최근글과 인기글-->
                <div class="box-recent">
                  <h3 class="title-sidebar blind">최근글과 인기글</h3>
                  <ul class="tab-recent">
                    <li class="tab-button recent_button on"><a class="tab-button" href="#" onclick="return false;">최근글</a></li>
                    <li class="tab-button sidebar_button"><a class="tab-button" href="#" onclick="return false;">인기글</a></li>
                  </ul>
                  <ul class="list-recent">
                    <s_rctps_rep>
                      <li>
                        <a href="" class="link-recent">
                          <s_rctps_rep_thumbnail>
                            <p class="thumbnail" style="background-image:url('')"></p>
                          </s_rctps_rep_thumbnail>
                          <div class="box-recent">
                            <strong></strong>
                            <span></span>
                          </div>
                        </a>
                      </li>
                    </s_rctps_rep>
                  </ul>

                  <ul class="list-recent list-tab" style="display: none">
                    <s_rctps_popular_rep>
                      <li>
                        <a href="" class="link-recent">
                          <s_rctps_rep_thumbnail>
                            <p class="thumbnail" style="background-image:url('')"></p>
                          </s_rctps_rep_thumbnail>
                          <div class="box-recent">
                            <strong></strong>
                            <span></span>
                          </div>
                        </a>
                      </li>
                    </s_rctps_popular_rep>
                  </ul>
                </div>
              </s_sidebar_element>
              <!-- // 최근글과 인기글 -->

 

이걸 삭제하고 

 

 

              <s_sidebar_element>
                <!-- 최근글-->
                <div class="box-recent">
                  <h3 class="title-sidebar">최근글</h3>
                  <ul class="list-recent">
                    <s_rctps_rep>
                      <li>
                        <a href="" class="link-recent">
                          <s_rctps_rep_thumbnail>
                            <p class="thumbnail" style="background-image:url('')"></p>
                          </s_rctps_rep_thumbnail>
                          <div class="box-recent">
                            <strong></strong>
                            <span></span>
                          </div>
                        </a>
                      </li>
                    </s_rctps_rep>
                  </ul>
                </div>
              </s_sidebar_element>
              <!-- // 최근글 -->

<s_sidebar_element>
                <!-- 인기글-->
                <div class="box-recent">
                  <h3 class="title-sidebar">인기글</h3>
                    <ul class="list-recent">
                    <s_rctps_popular_rep>
                      <li>
                        <a href="" class="link-recent">
                          <s_rctps_rep_thumbnail>
                            <p class="thumbnail" style="background-image:url('')"></p>
                          </s_rctps_rep_thumbnail>
                          <div class="box-recent">
                            <strong></strong>
                            <span></span>
                          </div>
                        </a>
                      </li>
                    </s_rctps_popular_rep>
                  </ul>
                </div>
              </s_sidebar_element>
              <!-- // 인기글 -->

 

 

이걸 넣어줍니다. 관련 태그는 텍스트 파일로 해서 올렸습니다.

 

새 텍스트 문서.txt
0.00MB

 

 

그러면 이렇게 되있던것이 

이렇게 바뀝니다.

저는 굉장히 필요한 기능이라 생각되어 방법을 알아낸것에 너무 만족하고 좋습니다.

다른분들에게도 유용할거라 생각하고 글로 남겼습니다.

그럼 20000