Darney Skin 2017 (v1.0) 블로그 스킨 배포 #심플 #반응형









Darney Skin 2017 소개






 Darney Skin 2017은 "군더더기 없는 심플한 디자인의 반응형 스킨" 입니다. 컴퓨터, 태블릿, 스마트폰 등 어느 기기에서도 읽기 쉬운 디자인을 제공합니다.

 무채색 바탕에 2가지 포인트 색상을 사용하여 강조 효과를 주었습니다. 현재 스킨에 적용된 포인트 색상은 개나리색/진한 청록색(#FFAA00/#206776)입니다. 



우측 상단의 관리자 메뉴


관리자에게만 노출되는 '수정' 버튼



 메뉴 우측상단의 을 클릭하면 관리자 페이지에 접근할 수 있습니다. 또한 본문 제목 아래 관리자에게만 노출되는 '수정' 버튼이 숨어있어 쉬운 글 관리가 가능합니다.



모바일 화면에서 메뉴를 열었을 때



 모바일 기기와 같은 작은 화면에서는 상단 메뉴를 우측 아이콘 아래로 숨겨 단순화 하였습니다.





 본문 드래그 시 글 배경으로 포인트 색상을 적용하여 독특함을 더했습니다.





 본문 이미지에 입력한 자막(설명글)은 이미지 아래 예쁘게 표시됩니다.





적용 전 유의사항





Darney Skin 2017에서 지원하지 않는 기능은 다음과 같습니다.


 - 보호 글

 - 트랙백

 - 메뉴 설정 (추후 추가 예정)


 이 외 정상 작동하지 않는 기능에 대해서는 댓글이나 방명록으로 알려주시면 수정하겠습니다.

 또한 배포용 스킨의 한계로 인하여 본 블로그 [싸돌아다님] 메인에 적용된 티에디션은 포함되어 있지 않습니다.





다운로드 및 스킨 설치 방법



[Darney Skin 2017 적용방법 바로가기]

[Darney Skin 2017 미리보기 바로가기]





Darney Skin 2017 다운로드 

DarneySkin2017 v1.0.zip

DarneySkin2017 v0.3.zip

DarneySkin2017 v0.2.zip

DarneySkin2017.zip




Darney Skin 2017은 무료 다운로드 가능합니다. 

스킨을 다운 받아 개인 취향에 맞게 수정하는 것은 가능합니다.

단, 수정 후 재배포는 금지합니다.



Darney Skin 2017이 마음에 드신다면 댓글/방명록 또는 후원으로 마음을 표현해주세요 

또한 이웃 블로그로 링크(클릭!) 후 지속적으로 방문하여 스킨 업데이트 내용을 확인해주세요.

여러분의 관심과 애정은 더 나은 스킨을 제작하는데 큰 도움이 됩니다. :)







업데이트 내역


2017.09.17 v1.0 정식 배포 

- 소소한 위치/크기 조정

- 상단 메뉴바 수정

- 사용하지 않는 코드 제거하여 최적화


2017.07.16 v0.3 

- 카테고리 더 보기 썸네일에 사진 없는 글이 나타나지 않는 오류 수정

- 본문 글자 크기 크게 조정


2017.07.16 v0.2 

- 상단 메뉴바에 관리자 메뉴 추가

- 방명록 비밀글 기능 추가





댓글 또는 방명록에 Darney Skin 2017에 대한 여러분의 의견을 남겨주세요. 

좋은 의견들은 다음 업데이트에 적극 반영하여 더 나은 스킨을 제공할 수 있도록 하겠습니다 :)

감사합니다.



더보기

댓글, 96

  • 이전 댓글 더보기
  •  댓글  수정/삭제
    2017.10.26 17:05

    비밀댓글입니다

    •  수정/삭제 Darney
      2017.11.06 03:07 신고

      안녕하세요.
      해당 블로그로 들어가서 확인해보았는데.. 정사각형으로 제대로 출력이 되고 있는 것 같네요.
      문제가 해결이 된건가요? 아니면 제가 발견하지 못한건지..
      아직 문제가 있는거라면 조금 더 자세하게 알려주시면 확인해보도록 하겠습니다.

      제가 내용을 잘 이해하지 못한 것 같아 죄송하네요 ㅜㅜ..

  •  댓글  수정/삭제 azumma09247
    2017.10.28 07:53 신고

    블로그 관리에 보면 링크라는 부분이 나오는데요..그 부분을 이웃+ 옆에 에드할 수 있는 방법이 있울까요???

    •  수정/삭제 Darney
      2017.11.06 03:04 신고

      네 물론 등록할 수 있습니다.
      자세히 알려드리기엔 조금 복잡하여 관련 링크 알려드릴게요.
      http://www.tistory.com/guide/skin/
      티스토리 스킨 가이드인데요, 여기서 링크 부분 참고하여 수정하시면 됩니다 :)

  •  댓글  수정/삭제 블로그인마마
    2017.11.09 12:05 신고

    감사합니다. 제가 티스토리는 처음이라 다운로드받아도 어떻게 설치해야 할지 막막하지만 열심히 공부해서 공유해주신 소중한 자료 빛날 수 있도록 예쁘게 잘 설치해볼게요.^^ 정말 감사드립니다.

  •  댓글  수정/삭제
    2017.11.13 01:13

    비밀댓글입니다

    •  수정/삭제 Darney
      2017.11.13 01:24 신고

      안녕하세요.

      카테고리 선택 시 글이 나타나지 않는 현상은 아직까지 확인된 바가 없는데..
      혹시 어느 부분인지 링크나 캡쳐 보내주실 수 있으신가요?
      offnow님 블로그에 들어가보면 아직 글이 없어서 확인이 되지가 않네요.
      작성하신 글이 비밀글이라 나타나지 않는 것일 수도 있으니 공개글로 설정이 되어있는지도 한 번 확인해주세요~

      감사합니다 :)

    •  수정/삭제
      2017.11.13 19:44

      비밀댓글입니다

    •  수정/삭제 Darney
      2017.11.16 10:45 신고

      문제가 해결되었다니 다행이네요 ㅎㅎ
      좋은 말씀 감사드립니다! 블로그 번창하시길 바랄게요~

  •  댓글  수정/삭제 날고싶은 긍정
    2017.11.15 11:16 신고

    스킨이 이뻐요.. 잘쓰겠습니다 . 배포 감사드립니다^^

  •  댓글  수정/삭제 nobless76
    2017.11.22 12:53 신고

    감사해요^^~
    잘 사용하겠습니다.~

  •  댓글  수정/삭제
    2017.11.25 03:20

    비밀댓글입니다

    •  수정/삭제 Darney
      2017.11.27 00:58 신고

      안녕하세요!

      싸돌아다님 블로그는 네이버 웹마스터도구에서 문제 되는것이 없습니다. (사이트맵 제외)
      배포한 스킨 코드와 다른건 메인(티에디션) 뿐인데.. 혹시 코드를 수정하셨다면 태그를 닫지 않은 부분이 있는지 확인해보시면 좋을 것 같아요~

      저도 웹마스터도구에 대해 자세히 아는 건 없어서 해결 방법은 ㅜㅜ 더 말씀드릴게 없네요.. 죄송합니다 ㅜㅜ

  •  댓글  수정/삭제 백유성
    2017.11.26 23:49 신고

    정말 유용하게 쓰일 스킨인듯 합니다. 제가 원하는 디자인입니다.
    유용하게 사용하도록 하겠습니다.

  •  댓글  수정/삭제
    2017.11.27 13:30

    비밀댓글입니다

  •  댓글  수정/삭제 눈곰이
    2017.12.16 14:13 신고

    안녕하세요. Darney 스킨 정말 좋네요!! ㅎㅎ. 이런 스킨을 무료로 받을 수 있게 되어 정말 감사하 마음에 글을 남깁니다. 하나 여쭈어 봐도 될까요? 메뉴는 혹시 언제 수정하실 계획인지 궁금합니다! 메뉴가 상단에 올라가다 보니 메뉴를 고칠 수 있으면 좋을 것 같은데, 못 고쳐서 아쉽네요 ㅠㅠ skin.html 파일을 살펴보았는데, css랑 달리 고치는게 훨씬 어려운 것 같네요. 지금즈음 시기면 기말고사 중이시라 바쁘시겠지만 혹 기말고사 끝난 후에 봐주실 수 있을까 부탁드려 봅니다. 감사합니다.

  •  댓글  수정/삭제 눈곰이
    2017.12.20 21:37 신고

    안녕하세요. 하나 더 여쭈어 보고 싶은게 있어서요. 티스토리 html/css 수정을 클릭한 뒤 아무리 찾아보아도 font-family가 안보이는데요. 어떻게 하면 font 를 변경할 수 있을지 궁금합니다! ㅠㅠ

    •  수정/삭제 Darney
      2017.12.23 02:56 신고

      안녕하세요!
      기말고사까지 고려해주셔서 감사합니다 ㅋㅋ 시험 과제 때문에 한동안 신경을 못 썼네요 ㅜㅜ
      늦은 답변 죄송합니다..

      메뉴 수정은 하단에 있는 카테고리를 위 메뉴바로 올리는걸 말씀하시는 건가요?
      아직까지는 준비된 게 없어서 직접 수정을 해주셔야 하는데.. 설명 드리기가 조금 복잡하네요.
      혹시 수정하시다가 막히는 부분 있으시면 최대한 도움 드릴게요!
      메뉴 수정도 빨리 진행해서 스킨 업데이트 하도록 하겠습니다.

      font-family의 경우 css 파일이 아니라 image 폴더 안에 bootstrap.min.css에 설정 되어있습니다.
      직접 파일을 수정하시는 것 보다는 style.css 파일 상단에 body{} 태그 안에 새로 넣으시길 추천드려요. 기존에 있는 것과 겹칠 수 있으니,
      body{font-family:(폰트 이름)!important;} 와 같이 설정해주시면 될 것 같습니다.

      늦은 답변 다시 한 번 사과드리고 따뜻한 연말 보내시기 바랄게요 :)
      감사합니다~

  •  댓글  수정/삭제 5thBeatles
    2017.12.30 17:36 신고

    오랜만에 블로그를 다시 시작하려 하면서 스킨을 검색하다가 취저 당해선 가져다 쓰고 있습니다.
    너무 이쁜 스킨 감사드립니다.

    세 가지 정도 질문하려 하는데요,
    1) 아래 sidebar에 해당하는 것들에 나오는 것들을 수정할 수는 없나요? Tag는 html에서 그냥 강제로 삭제했는데, 기타 티스토리 관리자에서 sidebar로 추가한 것들을 쓰고 싶은데 어떻게 해야 하는지요?
    2) Page는 사용할 수가 없나요? 확인이 어렵네요
    3) 카테고리가 위로 올라갔으면 해서 일단은 Level 1의 카테고리만 상단에 방명록 링크 걸듯이 처리했는데요... 하단에 나오는 카테고리가 초기값이 펼쳐짐이 아니라 접힘은 안되나요? Level 1의 카테고리 항목만 보이게요..

    혹시 어떤 상황인지 궁금하시면 5thbeatles.com으로 와서 한 번 봐 주세요.

    미리 조언 주심에 감사드립니다.

    •  수정/삭제 Darney
      2018.01.01 19:49 신고

      안녕하세요.
      스킨 예쁘게 사용해주셔서 감사합니다.

      질문에 답변드리자면,
      1) 사이드바로 어떤 기능을 사용하려 하시나요? 삭제하는 것은 비교적 간단하나, 다른 기능을 넣는 것은 아무래도 조금 복잡할거에요.
      http://tistory.com/guide/skin/step3
      스킨 제작가이드 보시면서 한 번 수정해보시고 어려움이 있다면 다시 질문 주세요 :)

      2) 페이지의 경우 스킨 배포 이후에 추가된 티스토리 기능입니다.
      페이지는 기존의 포스트와 동일하게 표시되며 페이지 리스트의 경우 아직 티스토리에서 지원하지 않아 메뉴바나 카테고리에 직접 등록해주셔야 합니다.
      스킨 가이드가 업데이트 되는대로 스킨도 업데이트 할 예정이니 추후에 다시 확인해주세요~

      3) 포함된 파일 중 index.html에서
      showListOnCategory 부분을 수정해주셔야 합니다.
      <showListOnCategory>1</showListOnCategory> 에서 1을 0으로 변경해주시고 파일 저장 후 다시 업로드 해주시면 됩니다.

      답변이 도움이 되었는지 모르겠네요.
      추가로 궁금한 내용 있으시면 댓글이나 방명록 남겨주세요 :)
      감사합니다!

  •  댓글  수정/삭제
    2018.01.01 13:27

    비밀댓글입니다

  •  댓글  수정/삭제
    2018.01.03 09:27

    비밀댓글입니다

    •  수정/삭제 Darney
      2018.01.03 18:01 신고

      안녕하세요.
      스킨 예쁘게 사용해주셔서 감사합니다 ㅎㅎ

      방명록에 카테고리를 추가하고 싶다는 문의를 주셨는데 정확하게 어떤 의미인지 잘 이해가 되지 않네요.
      상단바에 있는 [ : > 관리자/글쓰기] 처럼 열고 닫을 수 있도록 설정하시려는건가요?
      그게 맞다면, 해당 코드와 비슷하게 구현하시면 되는데 정확히 어떤 부분에서 막히셨는지 알려주셔야 답변 드릴 수 있을 것 같습니다. ㅠㅠ

      빠른 도움 드리지 못해 죄송합니다.
      문제가 되는 부분에 대해 정확히 알려주시면 자세히 설명드리도록 하겠습니다!

      감사합니다.
      새해 복 많이 받으세요 :)

    •  수정/삭제
      2018.01.03 18:13

      비밀댓글입니다

    •  수정/삭제 Darney
      2018.01.05 13:49 신고

      빠른 시일내로 업데이트 하도록 노력해보겠습니다! ㅋㅋ
      스킨 예쁘게 사용해주셔서 감사드려요~ :)

  •  댓글  수정/삭제 눈곰이
    2018.01.04 23:33 신고

    12월 20일에 질문 여쭈어봤던 '눈곰이'입니다. 답장 주셔서 감사합니다. 하나만 더 질문을 드려도 될까요?
    Q. 티스토리 제일 상단에 위치한 '티스토리 로고'와 '방명록'같은 메뉴의 font-size를 어떻게 증가시키고, bold 로 만들 수 있을까요?
    현재 제 티스토리 http://mysnowbear.tistory.com 을 보시면 제 티스토리 로고(Snow Bear & Data Science) 와 메뉴 Grad school, Work, Slices of life 가 있는데요. 이들의 사이즈를 어떻게 http://5thbeatles.tistory.com 이 분 티스토리처럼 크게 확대할 수 있는지 궁금합니다!!
    저는 블로그관리 페이지의 [html/css 편집]으로 들어가 html 부분에서 현재 제 티스토리 처럼 수정한 상태인데요. html 이나 css부분에서 어떻게 이 로고와 메뉴의 font-size를 어떻게 크게 하고 bold를 증가시켜야 할 줄 모르겠습니다. 바쁘시겠지만 다시 한번만 답변해주신다면 정말 감사드리겠습니다. ㅠㅠ

    •  수정/삭제 Darney
      2018.01.05 13:58 신고

      안녕하세요~

      예시로 현재 눈곰이님 블로그와 예시 블로그를 비교해보면 글자 크기와 굵기 모두 동일하게 적용이 되어있네요.
      답변이 늦어져서 그 사이에 수정을 하신것 같네요 ㅜㅜ

      메뉴바의 글자 크기/굵기 조정은 css 파일에 다음과 같은 코드를 추가하시면 됩니다.
      .navbar {
      font-size: (16 이상의 숫자)px;
      font-weight: 700;
      }

      블로그 제목(로고)의 글자 크기 조정은 다음과 같습니다. 굵기의 경우 현재 최대 굵기가 적용되어 있네요.
      a.navbar-brand {
      font-size: (19 이상의 숫자)px;
      }

      블로그 운영에 도움이 되었으면 좋겠네요 :)
      감사합니다~

    •  수정/삭제 눈곰이
      2018.01.05 15:03 신고

      우와 빠른 답장 정말로 감사드립니다. [html/css 수정] 부분의 제일 위에다가 말씀해주신 코딩을 복붙하니 금방 고쳐지네요! 저는 크롬 F12 눌러서 나오는 Developer's tool에서 숫자 일일이 변경해가면서 어느걸 고쳐야 하나...살펴보기만 했었는데 이렇게 쉽게 고칠수도 있다니 신세계입니다! 감사합니다!!

  •  댓글  수정/삭제 눈곰이
    2018.01.05 15:08 신고

    그렇다면 하나만 더 여쭈어봐도 될까요? 스킨 메인 화면의 하단 부분에는 '카테고리', '새로운 이야기', '새로운 댓글' 이것들이 위치하잖아요. 혹시 여기의 font-size들도 조정이 가능할까요? css에서 어떤 코딩을 치면 좋을지 여기서도 정답을 알려주시면 정말 감사하겠습니다!!!!!

    •  수정/삭제 Darney
      2018.01.07 00:23 신고

      하단의 작은 제목들은
      .side_title { font-size: ~px; }
      위 코드를 추가함으로써 조정이 가능합니다.
      현재 글자 크기가 15px로 설정되어 있기 때문에 이를 중심으로 수정해주시면 될 것 같네요 :)

    •  수정/삭제 눈곰이
      2018.01.08 02:00 신고

      답장 정말 감사드립니다! :D 즐거운 방학 보내시는데 제가 방해를 하는 건 아닌지 모르겠네요 ㅠㅠ

      아 그리고 하나 더 여쭈어 보고 싶은데요. Darney님 티스토리처럼 모바일 화면에서 볼 때 "글을 쓴 날짜", "하트 받은 갯수"와 "댓글 갯수"가 보이게 하려면 어떻게 해야 할지도 여쭈어 봐도 될까요? 이건 Darney님의 특급 노하우 같은데... 부탁드려봅니다 ^^

  •  댓글  수정/삭제
    2018.01.06 11:47

    비밀댓글입니다

    •  수정/삭제 Darney
      2018.01.07 00:29 신고

      안녕하세요 :)

      문의주신 스크롤 버튼의 경우 자바스크립트로 구현이 되어있는데요,
      이 부분은 제가 댓글로 알려드릴 수 있을만큼 간단하지가 않네요..
      한 부분만 수정해서 되는게 아니라 모든 파일을 다 손봐야 하기 때문에 도움을 드리기 어려울 것 같습니다. 죄송합니다 ㅠㅠ

      프로필 아이콘의 경우 스킨의 문제가 아니라 관리 페이지의 설정 때문인 것으로 보입니다.
      블로그 관리 > 플러그인 > 블로그 아이콘 표시를 해제하시거나 원하시는 모양으로 수정해주시면 문제 해결이 될 것 같네요.

      도움을 드리지 못한 것 같아 죄송합니다. ㅠㅠ

      스킨 사용해주셔서 감사드리며 좋은 하루 보내시기 바랄게요~

    •  수정/삭제
      2018.01.07 01:43

      비밀댓글입니다

  •  댓글  수정/삭제
    2018.01.08 17:46

    비밀댓글입니다

    •  수정/삭제 Darney
      2018.01.17 16:04 신고

      안녕하세요.

      방명록 및 발자국 삭제는 첨부된 index.html 파일에서
      <li class="tab_guestbook"><a href="/guestbook">방명록</a></li>
      위 부분을 지워주시면 됩니다. (발자국도 동일)

      또한 말씀해주신 네이버 이웃 위젯의 경우 사용해보지 않아서 어떤 문제인지 잘 모르겠네요..
      현재 Darney Skin의 경우 티스토리 기본 기능 및 플러그인만 제공하며 나머지 기능의 경우에는 직접 수정 후 사용해주셔야 합니다.

      스킨 사용해주셔서 감사합니다 :)
      좋은 하루 되세요~

  •  댓글  수정/삭제
    2018.01.12 05:55

    비밀댓글입니다

    •  수정/삭제 Darney
      2018.01.17 16:08 신고

      안녕하세요.
      썸네일 크기 및 비율은 말씀해주신 것처럼 R0X400 부분을 수정해주시면 됩니다.
      티스토리에서 제공하는 썸네일 치환자인데, 자세한 사용법은 '티스토리 썸네일 치환자'로 검색하시면 쉽게 확인하실 수 있습니다.
      움짤의 재생시간은 티스토리 자체의 이미지 저장 방식/처리 방식과 관계가 있기 때문에 스킨과는 관계가 없어 답을 드리기 힘들 것 같네요.

      스킨 사용해주셔서 감사드리며 오늘도 좋은 하루 보내시기 바랍니다 :)
      감사합니다~

  •  댓글  수정/삭제 눈곰이
    2018.01.13 00:24 신고

    안녕하세요 Darney님. 너무 많은 질문을 여쭈어 봐서 염치가 없지만 하나만 더 여쭈어 보아도 될까요?

    Q. 인터넷 익스플로러로 제 티스토리 메인화면을 보면 사진박스 밑 글들이 넘쳐서 다음 사진 박스 밑으로 들어가버리고, 숫자와 글이 겹쳐버립니다...어떻게 해결할 수 있을까요?

    크롬이나 웨일브라우저에서는 word-wrap: break-word 가 잘 작동하여서 본문내용이 일정 내용을 넘으면 .... 으로 바뀌는데요. 인터넷 익스플로러에서는 박스를 넘어서도 계속 글들이 튀어나와서 사진 밑으로 가버리네요. 특히 제일 왼쪽 줄의 맨 밑 글을 인터넷 익스플로러로 보시면 ( 1월 12일 현재는 '한국고등교육재단 장학금 시험 및 면접 후기') 아예 글 박스를 넘어섰음을 확인하실 수 있습니다.

    제가 이 메인 부분의 font-size를 변경한 것 때문에 그런 것 같은데요. 어떻게 하면 인터넷 익스플로러에서도 '사진 박스 밑에 있는 글들'이 박스 안에서 얌전히 있게 보일 수 있을까요? 바쁘신 줄 알지만 고견 부탁드리겠습니다 ㅠㅠ

    •  수정/삭제 Darney
      2018.01.17 16:01 신고

      안녕하세요.

      익스플로러는 그 버전에 따라서 호환이 되지 않는 경우가 있습니다.
      현재 최신 버전(11)으로 확인하였을 때는 모든 페이지가 정상적으로 보여지네요.

      아마 10 버전 밑으로는 문제가 있을 것으로 예상됩니다.
      모든 버전에 잘 보여지면 좋겠지만 지금으로써는 하위 버전에 대한 지원은 제공하지 않고 있습니다..
      도움이 되어드리지 못해 죄송합니다 ㅜㅜ

    •  수정/삭제 눈곰이
      2018.01.18 09:50 신고

      webkit-line-clamp가 코딩으로 사용되어 있다보니 non-webkit-engine을 사용하는 firefox나 IE에서 작동이 되지 않는 거였더라구요. Darney님께서 IE 11로 보셨을 때는 이미 제가 CSS를 고쳐놓은 후였습니다! ㅎㅎ 답장 감사드립니다 ^^

Darney

그만 좀 싸돌아다녀 이것아

여행스타그램