티스토리 오디세이 스킨 설정 모음

오디세이로 스킨 변경 후 수정한 사항들을 모아서 올려봅니다.

혹 궁금한 사항 있으면 댓글 주시면 말씀 드리겠습니다.

1. 사이드바에 구글 광고 고정하기

스킨 CSS 가장 하단에 아래와 같은 명령어 추가

/* 사이드바 고정*/

@media screen and (min-width: 1061px)
{ .wrap-right .area-aside { align-self: flex-start; position: sticky; top: 32px; height: 100%} }
#wrap {overflow: auto; overflow-x: hidden; height: 100%; }

/* 사이드바 고정 끝*/

 

2. 인기글과 최신글이 따로 나오도록 변경하기

1) 스킨 html 중 <!-- sidebar 01 --> <s_sidebar> 또는 <!-- sidebar 02 --><s_sidebar> 있는 쪽 찾아 아래 명령어 추가

2) 꾸미기 사이드바에서 추가 및 삭제 통해 구현

             <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>
              <!-- // 인기글 -->

 

3. 새글 알림 아이콘이 회색으로 나올 때 주황색으로 변경하기

스킨 CSS 하단에 아래와 같은 명령어 추가

/* 아이콘 색상 변경 시작*/

img[src*="new_ico_1"]{filter: sepia(100%) hue-rotate(-50deg) saturate(600%) contrast(100%); padding-bottom:2px;}

/* 아이콘 색상 변경 끝*/

 

4. 본문 하단의 이전글/다음글 삭제 (플러그인의 카테고리 글 더보기 기능으로 대체)

article-page 찾아서 'display: none;' 명령어 추가하기

 

 

5. 하단의 빈 공간 footer 삭제

스킨의 html 가장 하단의 다음 부분 전부 삭제

    <!-- footer -->
      <footer id="footer">

        <div class="inner-footer">
          <div class="box-policy">
            <s_if_var_footerLink1Name>
              <a href="" class="link-footer"></a>
            </s_if_var_footerLink1Name>
            <s_if_var_footerLink2Name>
              <a href="" class="link-footer"></a>
            </s_if_var_footerLink2Name>
            <s_if_var_footerLink3Name>
              <a href="" class="link-footer"></a>
            </s_if_var_footerLink3Name>
          </div>
          <div>
            <p class="text-info"></p>
            <address></address>
          </div>

          <div class="box-site">
            <button type="button" data-toggle="xe-dropdown" aria-expanded="false">관련사이트</button>
            <ul>
              <s_link_rep>
                <li class="on"><a href="" target="_blank"></a></li>
              </s_link_rep>
            </ul>
          </div>
        </div>

      </footer>
      <!-- // footer -->

 

명령어 첨부 파일

오디세이 스킨 사이드바 광고 고정 명령어.txt

0.00MB

오디세이 스킨 최신글 인기글 입력 명령어.txt

0.00MB

티스토리 스킨 새글 발행 아이콘 수정 명령어.txt

0.00MB

 

 

 

한 줄 요약

• 오디세이 스킨으로 다시 시작해보자.