본문 바로가기

티스토리스킨/반응형2단 스킨

티스토리 스킨 - 반응형 다크라인 2단 티스토리 스킨 배포합니다.

스킨명: 반응형 다크라인 2단 티스토리 스킨




* 카테고리 갯수가 많아 탑메뉴가 넘치는 분들은 아래에 사이드바로 카테고리를 옮긴 버전을 별도로 올렸습니다.

두가지중 하나를 골라 다운받아 쓰면 됩니다.


- 어두운 배경을 가진 차분한 느낌의 2단 반응형 스킨입니다.

- 레이아웃 전체 너비가 넓고(1220px) 어두운 배경색에 특화된 스킨입니다.

- 사이드바 배치를 스킨 추가설정에서 왼쪽/오른쪽으로 변경할 수 있습니다. 

- 스킨 추가 설정에서 배경 색상과 블로그 타이틀 색상을 지정할 수 있습니다.




- 커버 기능 지원합니다.

- 반응형 스킨으로 모바일 및 타블렛 대응 됩니다.

- 레이아웃 전체 너비는 1220px, 글 내용 너비는 810px 입니다.


-------------------------------------------

2019.06.01 ver 1.0.1 patch - 모바일 화면 검색폼 클릭시 사이드메뉴 닫히는 버그 패치

-------------------------------------------








* 웹브라우저 너비를 변경하면 반응형으로 변하는 화면을 확인할 수 있습니다.



_설치안내


1. index.xml 파일을 반드시 업로드해야 합니다. 티스토리 신스킨은 스킨 옵션 설정을 위해 반드시 이 파일이 필요합니다.


2. script.js 파일 업로드 후에는 웹브라우저 캐시 소거를 한번 해주시기 바랍니다. 브라우저 환경에 따라 구 사용 스킨의 자바스크립트 파일이 캐시에 남아 자바스크립트가 정상 동작하지 않는 경우가 있습니다.

사이드바 메뉴가 펼쳐지지 않는다거나 할 경우 캐시 소거를 하면 됩니다.


3. 레이아웃 전체 너비를 변경하려면 style.css 파일의 "1160px" 를 원하는 너비 값으로 전체 변경하면 됩니다. (5개) 레이아웃 좌우여백으로 30px씩 총 60px 를 더한 너비(1220px)가 실제 전체 레이아웃 크기가 됩니다.


4. 스킨 하이라이트 컬러(마우스 오버 색상 등)를 변경하려면 style.css 에서 "#ec5621" 을 다른 웹컬러값으로 전체 변경을 하면 됩니다.


042_darkline.zip


* 카테고리가 탑메뉴로 붙어있는 버전입니다.


스킨 설치 방법





042_darkline_sidebar.zip


* 카테고리가 사이드바에 붙어있는 버전입니다.




  • 좋은 스킨 잘 쓰겠습니다. 감사합니다 ㅠㅠ

  • 드디어 이쁜 2단반응형 dark 테마를 찾았네요.. 제작 감사합니다.
    다만 카테고리 메뉴가 상단에 가로배열로 위치해있는데요.
    이게 카테고리 수가 많아지면 애매하더라구요.. (라인이 내려간다던지)
    혹시 카테고리를 사이드바에 트리 형태로(default: 접힌상태) 되어있게 수정된 버전은 없을까요??

  • 티스토리 시스템 댓글 장애로 인해 별도로 달아드립니다.
    -------------------------
    만들어드릴께요. 쫌만 기달려 보셈.
    스킨 수정은 하지 마시기 바랍니다. 구조상 카테고리를 사이드바쪽으로 옮기면 호환성이 없어질겁니다.

  • 사이드바에 카테고리가 붙은 버전이 별도로 올라갔습니다.
    위에 보시면 다운로드 링크 있으니까 다운로드 받아서 스킨 세팅 다시 하면 됩니다.

  • 개발자 분이어서 알아서 잘 고치고 계신거 같기는 하지만..
    #header height 와
    #header>.title 의 padding
    값을 적절히 줄여주면 상단 공간을 조절할 수 있습니다.

  • 비밀댓글입니다

  • 아.. ui 쪽은 아니어서 검색하면서 보고있었습니다. 피드백 감사합니다 ^^

  • 티스토리 일 안하네요... 대댓글 에러가 며칠째 계속되는데 안고치네요.
    보통은 스킨에 글쓰기라는걸 따로 붙이지는 않습니다.
    로그인되어있으면
    https://블로그주소/manage/post
    이걸 링크로 달면 바로 글쓰기 폼이 뜨기 때문에 구지 원하시면 이럴 링크를 달아서 쓰시면 됩니다.

  • 아.. 대댓 안달아지는게 티스토리 에러였군요..
    답변 감사합니다 ^^

  • 좋은 자료 정말 감사합니다. 다름이 아니라, sns에 유튜브를 추가하고 싶은데 어떻게 하면 될까요?!!

    • 스킨 원본 기준
      skin.html
      71~72행 사이에
      <a href="본인유튜브URL" class="youtube"><div>Youtube</div></a>
      요걸 붙여넣고
      (순서는 윗줄로 올려서 바꾸면 됩니다.)

      style.css
      198행에

      .social-link .youtube:before {
      content: "\f167";
      font-family: "Font Awesome 5 Brands";
      }

      요걸 붙여넣으면
      됩니다.

      SNS 아이콘이 1줄에 4개에 맞춰져 있어서 아랫줄로 밀릴텐데

      166행
      15px -> 10px
      로 바꿔주면 한줄에 붙어 보일겁니다.

  • 항상 좋은 글과 테마 감사합니다. 다름이 아니라, 이 테마를 사용하고 있는데 댓글 기능이 보이지 않아서 문의드립니다. 혹시 적용할 수 있는 방법이 있을까요?

    • 스킨 커스터마이징을 하면서 태그를 잘못 붙이셔서 레이아웃이 깨지고 있습니다.

      글보기 페이지 태그 밑에 부분이 관련글과 댓글 영역인데 태그 밑에 라이브리 소셜 댓글 코드를 대체해서 붙여넣으시면서 태그 찌꺼기가 잘못 붙으면서 그 아래로 다 깨지고 있습니다.

      검은 배경이라 잘 안보이는데 본문영역 아래 끝 부분을 보면 검정색 꺽쇠가 보일겁니다.

      해당 부분을 수정해서 레이아웃 깨짐을 해결하면 라이브리 댓글이 보일 겁니다.

  • 사용 여부는 아직 고민을 해봐야 하는데 테스트용도로 받아 갑니다.
    멋진 스킨 만들어 주셔서 감사합니다. ^^

  • 좋은 스킨 배포해주셔서 감사드립니다. 다름이 아니라

    https://ogeoseo.tistory.com/category/%E2%96%B6%E2%96%B6%204.%20%EC%8A%A4%ED%81%AC%EB%9E%A9/%EC%
    96%B8%EB%A1%A0

    이런 식으로 이미지가 없는 글은 목록에서 이미지 없음 아이콘이 좀 보기 싫게 제목을 가리는 것 같은데, 저 아이콘을 없애고 글만 보이게 하거나 제목을 가리지 않도록 옮길 수 없을까요?

    • 스킨 원본 기준 style.css
      724행
      또는 #content 를 검색해서

      클래스 속성으로
      width: 100%;
      추가

      잘 모르시면 727 라인 위 아래 행을 하나 더 만들고
      width: 100%;
      추가하면 됩니다.

      살짝 버그성? 이라고 봐야할 것 같아서 스킨은 패치를 했습니다.
      다시 다운받아 style.css 를 덮어쓰셔도 됩니다.

    • 음...... 제가 말씀드렸던 부분과는 다른 쪽이 수정된 것 같아 다시 문의 드립니다. 이미지로 보여드려야 할 것 같아 임시로 블로그에 스크린샷을 올려 놓았으니, 번거로우시더라도 한 번만 더 확인 부탁드려요.
      https://ogeoseo.tistory.com/538

    • 스킨 원본 기준으로 확인을 해서 질문하신 의도를 이해를 못했습니다.

      스킨 원본 기준 style.css 1353행
      또는 .post-item .thum:before
      를 검색해서
      해당 클래스를 지우시면 됩니다.
      아니면
      클래스 속성중
      content: "\f302";
      행만 지워도 됩니다.

    • 잘 해결된 것 같습니다. 다시 한 번 감사드립니다~!