▶이동
  • Studio 8를 방문하신 여러분을 환영합니다 :)
  • 스팸 정책에 의해 일부 덧글·방명록차단될 수 있습니다.




* 본 스틸컷은 적용예이므로, 사용자 환경에 따라 실제 표시되는 화면과는 다를 수 있습니다.



소개

Cynical Dark(이하 "씨닭")은 부트스트랩(Bootstrap)과 jQuery기반의 티스토리용 반응형 스킨입니다. 반응형 웹이란 별도의 전용 레이아웃 제작 없이 그 페이지의 컨텐츠를 각각 다른 크기의 화면을 가진 기기에서도 동일하게 이용할 수 있게끔 제작된 웹을 일컫습니다.


이번 씨닭은 스킨 제작 프로젝트의 네번째 프로젝트로써, 기존의 다른 스킨을 수정해서 사용했던 1~3번째와는 달리 직접 A부터 (.. 는 부트스트랩 예제를 썼으니 양심상) 는 아니고 한... C쯤부터 Z까지 직접 제작한 점이 차별화되었습니다.


주요 기능

하나. 상단 카테고리가 자동으로 적용됩니다.

카테고리 관련 치환자와 그에 해당하는 스타일시트 구성으로 카테고리를 변경했을 때, 별도의 수정 없이 기존 사이드바와 동일하게 적용됩니다.

또한 상단 카테고리는 스마트기기에서도 쉽게 이용할 수 있도록 하였습니다.




둘. 직관적인 UI

직관적인 UI와 아이콘 등의 사용으로 조금 더 깔끔한 디자인을 사용하였으며, 각각의 아이콘은 부트스트랩 內 툴팁 기능을 사용하여 마우스를 올릴 경우, 그 아이콘에 해당되는 기능을 설명하도록 구성되어 있습니다.







업데이트 내역

The Begins at 2014.09.26 ~  

- 0.0.1 ~ 0.9.9

프로젝트 개시 (Project #4)

부트스트랩 예제를 이용한 스타일링.

스킨 명칭 변경 "Cynical Dark"

기본 스타일링 및 레이아웃 구성 완료

Section.G에서 오픈베타 테스트 시작


- 1.0.0

검색창에 음성 검색 기능 추가.

시스템 안정화 및 버그 수정.


- 1.0.2

부분 디자인 변경.

프린트용 스타일 정의 구문 추가.

버그 수정.


- 1.0.3

사이드바에 카테고리 영역 추가


- 1.0.5

사이드바 요소 추가 / 제거 기능 추가. 

* 블로그 관리 > 꾸미기 > 사이드바에서 조절 가능

덧글 · 방명록 쓰기 영역 편의성 강화.

일부 디자인 수정.


- 1.0.6

스킨 설치가 안되던 오류 수정.

하단 푸터 부분 사이즈 조절 (최대 가로값 1280px으로 하향 조정)

비밀글 해제가 안되던 문제 수정.

플러그인 관련 스타일 구문 추가.

가. '파비콘 표시'와 '덧글 프로필' 관련 이미지 위치 소폭 조정.


- 1.0.7

좌·우 외곽선 사이즈를 반영한 최대 가로폭 사이즈 수정 (1280px ▶ 1282px)

사이드바 스타일 변경

가. 관리자 메뉴와 태그 리스트 스타일 변경

나. 사이드바 기본 서체 크기 변경 (13px ▶ 12px)

다. 상 · 하위 카테고리 별로 스타일 차등화

티스토리 제공 기본 플러그인 관련 스타일 구문 추가

가. '카테고리의 다른 글' 플러그인 관련 스타일 정의

나. '프로필' 플러그인 관련 스타일 정의 


- 1.0.9

상단 내비게이션 바에 카테고리 기능 적용.

상단 슬라이더 추가 (Nivo Slider)

전체적인 디자인 개선.

사이드바 구글 반응형 애드센스란 추가

비밀글 체크박스 스타일 개선


- 1.0.10

일부 브라우저 (IE)에서 네비게이션 바가 중앙 정렬되지 않은 문제 수정.


내려받기

씨닭은 아래의 링크를 통해서 내려받으실 수 있습니다.


Cynical Dark.zip



저작자 표시 비영리 동일 조건 변경 허락
신고
  • 공지사항
    중요한 개인정보필요한 경우가 아닌 경우 적지 마시고, 적으셨다면 비밀글 설정을 꼭 해주시기 바랍니다.
    스팸 필터 정책에 의해 영문만으로 작성된 글이나 무의미한 내용의 글은 등록이 되지 않을 수도 있습니다.
  • 감사합니다. 2015.01.03 06:48 신고
    xenox가 마음에 들어서 설치는 했는데 cynical dark 가 더 마음에 들어서 갈아탔습니다.
    상단 네비게이션이 일정수치가 커지면 본문과 다르게 왼쪽으로 쏠림이 있거든요.. 이부분수정을 어떻게 해야하는지 알고 싶습니다..
    네비게이션의 사이즈를 높이면 된다고는 알고 있는데, 사이즈를 늘리는것보다 가운데에 오게 하고 싶거든요^^.
    좋은 스킨 만들어 주셔서 감사합니다.
  • @Eruis 2015.01.05 16:07 신고
    안녕하세요? 먼저 답변이 늦은 점 사과드립니다.
    말씀하신대로는 정확히 어떤 상황이 연출되는지를 확인할 수 없습니다. 스킨을 등록하신 블로그의 URL이나 해당 현상이 보이는 부분을 캡쳐해서 문의해주시면 확인 후 처리해드리겠습니다.
  • 2015.01.06 02:18
    비밀댓글입니다
  • 감사합니다 2015.01.06 02:23 신고
    사진은 이거구요.. 기본 스킨에서도 넓게하면 위 네비게이션이 영역을 조금 벗어나는부분이에요.. 1단 반응형으로 한번 수정해봤는데.. 이렇게 되어서 문의드려본거에요. 감기조심하시고, 시간나실때 한번 봐주세요. 감사합니다. imgur.com/hAcpsZq,d1AjCdr
  • 감사합니다 2015.01.06 02:27 신고
    캡쳐사진 주소를 올릴려고 하니 차단이라고 나와서 네이버 이메일로 문의드렸습니다^^..

    시간나실때 천천히 봐주시구요. 감기조심하세요~
  • @Eruis 2015.01.06 08:48 신고
    사진 말고도 웹에서도 보았으면 좋겠는데, 전전긍긍하고 있었는데 무커스텀 스킨에서도 동일한 현상이 발견되었네요. 지금 그 문제를 수정한 버전이 업데이트되었습니다.

    혹시, 커스텀 요소가 많아서 새로 깔기 어려우시다면, CSS 파일에서 .navbar, .Jumbotron을 찾으신 뒤, [ .navbar, .Jumbotron {max-width:1280px;width:100%;margin:0 auto;} ] 를 붙여넣기하신 후, 저장하시면 될 겁니다.
  • @Eruis 2015.01.06 08:57 신고
    그리고, 너비를 수정하시려면 .CSS 파일 내용 중 1280px이라고 지정된 부분을 '전부' 원하시는 너비로 수정하시면 되고, 사이드바를 밑으로 내린 1단형 스킨으로 변형을 원하신다면 .Entry와 .Sidebar의 width 값을 100%로 수정해주시면 됩니다.
  • 감사합니다 2015.01.07 03:29 신고
    홈페이지를 이메일로 보내드릴껄.. 너무너무 감사합니다.. 피드백이 너무 빠르시고, 잘해주셔서 정말 몸둘바를 모르겠네요. 정말 감사합니다.
  • 드문달 2015.02.02 00:04 신고
    정말 이쁜 블로그 스킨 만들어 주셔서 감사합니다 다만 제가 티스토리 블로그가 처음인지라 스킨 적용까지는 했는데 그다음 세부사항을 어떻게 수정해야할지 모르겠네요 Xenox는 설명서를 정말 잘 만들어 놓으셨던데 혹시 cynical dark도 그런 설명좀 들을수 있을까요 ㅠ
  • Studio 8 2015.02.02 09:40 신고
    조만간 준비하도록 하겠습니다 :)
  • white_tiger 2015.12.05 06:27 신고
    아 그리고 상단 카테고리 같은 경우에 색깔을 눈에 띄게 좀 바꾸고 싶은데 그부분도 여쭤보고 싶습니다. 어떻게 하는지 모르겠어요 다른거는 색깔 제가 맘대로 바꿨는데 ㅠ
  • @Eruis 2015.12.05 21:05 신고
    상단 카테고리라는 게 어떤 것을 말씀하시는건지요
  • 스킨 정말 잘 쓰고 있습니다. 일단 감사의 인사를 전하구요.

    유튜브영상 같은게 자동 리사이즈가 안될려나 해서 문의드리고 싶은데 업데이트가 좀 안될런지요.
    그것만 되면 정말 완벽할거 같습니다.
  • 티스토리 툴바