본문 바로가기

티스토리스킨/스킨 활용&패치

티스토리 반응형 스킨 117 심플리트3 스킨 3.2 패치 안내.

반응형

오른쪽 상단의 고정된 위치에 감춤/보이기로 고정된 검색창 위치를 사이드바로 이동할 수 있도록 옵션 항목이 추가되었습니다.

 

스킨 옵션 설정 레이아웃-"사이드바에 검색창 표시" 옵션 항목을 켜면

 

 

검색창이 사이드바 최상단웨 고정 위치로 표시됩니다.

 

 

 

 

심플리트3 v3.2 다운로드

반응형
  • 스킨을 다운로드받아서 스킨보관함에 새로등록하고 적용했는데 위와같이 검색창표시하는 항목이 안나오네요 ㅠㅠ

    • 옵션 설정에서 해당 항목이 보이지 않으면 스킨에 포함된 index.xml 파일만 스킨편집기 화면에서 재업로드를 해보시기 바랍니다.

      다운로드해서 확인해봤는데, 스킨 옵션은 정상 표시되고 적용도 됩니다.

  • 말씀대로 xml파일만 업로드하니 나오네요 감사합니다.^^

  • 익명 2021.11.23 15:52 댓글주소 수정/삭제 댓글쓰기

    비밀댓글입니다

    • 3.1 스킨에 3.2 업데이트를 적용하려면 스킨 전체를 재적용해야 합니다.

      3.2 스킨 다운로드 받으신 후 전체 스킨을 새로 적용/업로드해야 합니다.
      사이드바로 검색창을 옮기는 기능은 전체 스킨(html, css, js, xml) 에 영향을 미칩니다.

      일부 파일만 적용하면 스킨에 에러가 발생합니다.

  • 덕분에 잘 해결했습니다!
    전 패치라고 해서 기존 파일에 덮어써야 하는줄 알았거든요 ㅋㅋ
    이번 파일로 적용하니 깔끔히 잘 적용되었습니다~ 감사합니다 :)

  • 익명 2021.11.26 13:26 댓글주소 수정/삭제 댓글쓰기

    비밀댓글입니다

    • 제가 확인해서는 별 문제없이 잘 동작합니다.
      웹브라우저 캐시를 한번 소거해보시기 바랍니다.

      헤더 배경 이미지, 헤더 텍스트 대체 이미지를 스킨 옵션 설정에서 업로드해서 사용할 수 있습니다.

      헤더그룹-헤더 배경 이미지 사용
      헤더그룹-타이틀 대체 이미지

      두 옵션을 사용하면 됩니다.

  • 익명 2021.11.26 13:47 댓글주소 수정/삭제 댓글쓰기

    비밀댓글입니다

  • 오랜만이죠...?
    동창회보 <mago21.tistory.com> 에 117반응형 2단 심플리트3 스킨 사용 중입니다.

    첫 화면을 보시면 아시겠지만,
    회보 썸네일 화면 아래에 작성일자와 제목이 나오는데
    이 화면에서 등록날자를 안 보이게 하고 싶은데 도무지 감출 방법이 없군요.
    어딜 건디려야 하는지 알려주세요....^^

    • 스킨 원본 기준으로
      skin.html 내용에서

      645행 ~ 648행에 있는
      <span class="date">
      ...
      </span>

      요 부분을 그냥 지우시면 됩니다.

      skin.html을 수정해서 행수가 달라진 경우

      <div class="post-item">

      요걸 찾으면 19행쯤 밑에 있습니다.

    • 답변 감사합니다.

      그런데, 문제는
      타이틀까지 사라진다는 겁니다.
      타이틀은 살려두고 작성날자만 지우고 싶은데 맘대로 안 되는군요....;;;;

    • 날짜 표시용 4개 행 밑의 다음줄에 있는 제목 표시 행까지 삭제해서 그렇습니다.

      <span class="title">[샵샵_article_rep_title_샵샵]</span>

      날짜 표시행 밑의 이 행은 타이틀 표시 행입니다. 지우면 안됩니다.

      <span class="date">
      <s_if_var_short-date>[샵샵_article_rep_simple_date_샵샵]</s_if_var_short-date>
      <s_not_var_short-date>[샵샵_article_rep_date_샵샵]</s_not_var_short-date>
      </span>

      이 4행만 지워야 합니다.

    • <div class="article-info">

      <s_if_var_view-thumbnail-date>

      <span class="date">
      <s_if_var_short-date></s_if_var_short-date>
      <s_not_var_short-date></s_not_var_short-date>
      </span>

      </s_if_var_view-thumbnail-date>
      <span class="title"></span>
      <s_if_var_view-thumbnail-excerpt>
      <span class="excerpt"></span>

      </s_if_var_view-thumbnail-excerpt>
      </div>


      위 항목 중에서 아래부분을 삭제해도 제목까지 사라집니다.

      <span class="date">
      <s_if_var_short-date></s_if_var_short-date>
      <s_not_var_short-date></s_not_var_short-date>
      </span>

    • css를 수정하면서 목록 구조에 관련된 클래스나 속성을 삭제하신걸로 보입니다.
      어디를 수정한지까지는 일일이 다 확인할 수 없고...

      배포 상태인 스킨 원본에서는 위 4줄을 지우면 날짜만 정확하게 사라지고 타이틀은 정상 표시됩니다.

      타이틀이 출력이 안되는게 아니라 css 변경으로 목록의 썸네일 이미지 속성이 변경되면서 타이틀 위치가 밀려 썸네일 오른쪽으로 이동해서 가려져 안보이는것일 뿐입니다.

      지우거나 수정한 css 를 알 수 없어서 임시 방편으로 해결하는 방법을 알려드립니다.

      현재 적용된 CSS를 기준으로 스킨 편집기 들어가서 CSS 편집화면에서

      위에서부터
      .post-item .title
      를 검색해서 처음 나오는 클래스가

      .post-item .title {
      display: inline-block;
      display: -webkit-box;
      -webkit-line-clamp: 1;
      text-overflow: ellipsis;
      -webkit-box-orient: vertical;
      overflow: hidden;
      max-height: 1.7em;
      font-size: 1.15em;
      font-weight: ;
      line-height: 1.45;
      margin-bottom: 18px;
      }

      이 상태일겁니다.

      먼저 밑에서 3번째 font-weight 속성에 값이 없습니다.
      원본에는 font-weight: bold; 입니다.
      볼드 속성을 지우는게 의도였으면 해당 행을 모두 지워야 합니다. 값만 지우면 CSS 에러가 발생합니다.

      그리고 2번째 속성인 display: -webkit-box; 속성 행은 삭제.
      첫번 째 속성 행의
      display: block;
      속성을
      display: inline-block;
      으로 변경합니다.

      날짜 표시용 4줄을 삭제한 상태에서 css를 위처럼 수정해서 적용하면 타이틀이 썸네일 이미지 밑에 정상적으로 표시됩니다.

      임시방편입니다.
      출력 구조에 관련된 클래스나 속성을 수정해서 구조가 달라지면 다른 사이드이펙트가 날 수 있습니다.

  • 익명 2022.03.29 22:04 댓글주소 수정/삭제 댓글쓰기

    비밀댓글입니다

    • 접은글은 티스토리 시스템에서 제공하는 기능입니다.
      가능하면 임의로 변경을 하지 않는 것이 좋습니다.
      시스템 업데이트나 기타 다른 변경사항 발생시 부작용이 발생할 수 있습니다.

      style.css에 다음과 같이 버튼 배경색, 또는 속성을 추가해주면 됩니다.
      속성값은 구글 검색해서 찾아보시면 됩니다.
      미디어쿼리(@media) 바깥쪽 아무데나 적당히 붙여넣으면 됩니다.


      div[data-ke-type='moreLess'] .btn-toggle-moreless, #tt-body-page div[data-ke-type='moreLess'] .btn-toggle-moreless{
      background-color: #f0f0f0;
      /* 버튼 데코레이션 */
      padding: 5px 15px;
      border-radius: 6px;
      /*버튼과 더보기 내용 사이를 띄울 때*/
      margin-bottom: 15px;
      display: inline-block;
      }

      더보기 본문 영역 배경은 다음 클래스를 style.css 에 추가해주면 됩니다.

      /*더 보기 내용 데코레이션*/
      div[data-ke-type='moreLess'].open .moreless-content, #tt-body-page div[data-ke-type='moreLess'].open .moreless-content{
      background-color: #f8f8f8;
      padding: 15px;
      }

    • 친절한 답변 감사합니다.

      시간 나는대로 적용해 보겠습니다.^^


닫기