bskyvision$

개발자를 위한 티스토리 스킨, 리눅스킨 v1.1 (2020-11-20) 배포합니다

코딩/티스토리 스킨
@2020-11-20 16:17:55

안녕하세요. 비스카이비전입니다 :D

 

티스토리 블로그를 운영하다보니, 언젠가부터 나에게 딱 맞는 스킨을 직접 만들어 보고 싶다는 생각이 들더라고요. 특히 개발자를 위한 스킨을 만들어보고 싶었습니다. 누군가 만들어 놓은 스킨을 저의 필요에 맞게 커스터마이징해서 사용하는데는 분명 한계가 있었습니다. 그래서 최근 웹 개발에 어느 정도 지식이 생긴 참에, 제가 한번 직접 만들어봤습니다. 

 

저는 이 스킨에게 리눅스킨(LinuXkin)이라는 이름을 붙여주었습니다. 지금 제 블로그에 설치되어 있는 것이 바로 리눅스킨입니다. 

 

리눅스킨을 만들면서 저는 세가지에 초점을 두었습니다.

 

1. 리눅스 터미널의 느낌을 살리자.

2. 최대한 심플하게 만들자. 

3. 방문자분들이 글 읽기에 집중할 수 있게 하자.  

 

그러면 지금부터 리눅스킨의 주요특징을 하나하나 소개해드리겠습니다.

 

리눅스킨(LinuXkin) 주요특징

1. 헤더를 상단에 고정시키고 검색 기능을 넣어서 언제든 쉽게 블로그 내 검색이 가능하게 했습니다. 

스크롤을 내리더라도 헤더는 항상 화면의 최상단에 고정되어 있게 했습니다. 독자가 글을 읽다가 언제든 쉽게 블로그 내 검색을 할 수 있기 때문에, 방문자가 블로그에 체류하는 시간이 길어집니다. 

 

 

2. 전체적으로 검정색을 배경색으로 주고 본문 영역에만 흰색을 배경으로 줘서, 독자들이 본문에 집중할 수 있게 했습니다. 

가장 중요한 영역인 본문 영역에만 흰색 배경을 적용함으로 다른 영역과 완전히 분리된 느낌을 줬습니다. 또한 검정 배경을 본문에도 적용하면, 포스팅에 이미지들을 첨부했을때 대개 어색합니다. 그래서 본문 영역에는 흰 배경을 주는 것이 좋습니다. 또한 본문 영역의 최대 너비를 700px로 줘서, 화면 크기에 관계없이 가장 읽기 편한 너비로 글을 읽을 수 있게 했습니다.  

 

 

3. 댓글 입력창과 방명록 입력창을 DOS창 또는 터미널 느낌으로 레트로하게 만들었습니다. 

 

4. 카테고리 리스트, 댓글 리스트, 방명록 리스트에는 트리 느낌이 나도록 구성했습니다.

 

5. 흑백을 제외하고는 단 3가지의 색상(연두색, 파란색, 자주색)만을 사용했습니다. 

 

 

예외적으로 링크에 마우스를 올려놨을 때는 하늘색이 적용됩니다. 

 

 

나머지 세부특징은 제 블로그의 이곳 저곳을 살펴보시면서 확인하시면 되겠습니다.

 

리눅스킨 v1.1에서 업그레이드된 점(2020-11-20)

1. RSS, 태그, 관리, 글쓰기, 방명록과 같은 메뉴를 모두 흰색으로 통일하고 테두리를 씌워서 좀 더 레트로한 느낌을 줬습니다.

 

2. 방문자 통계도 컬러에서 모두 흰색으로 변경했습니다. 

 

 

3. 사이드바에 최근 댓글리스트가 뜨게 했습니다. 

 

 

4. 사이드바가 살짝 가려지는 문제를 해결했습니다.

 

리눅스킨 v1.1 설치방법

 

리눅스킨 v1.1.zip
0.16MB

 

위 압축파일을 다운로드 받으신 후에 압축을 풉니다. 그리고 티스토리 관리페이지에서 [꾸미기]-[스킨변경]에 들어가신 후 [스킨등록+] 버튼을 클릭합니다. 그 다음에 다음과 같이 5개의 파일들을 업로드합니다. index.xml, preview.gif, skin.html, style.css, images/list.png가 모두 잘 업로드 되었는지 확인합니다. 잘 업로드되었으면 아래 [저장] 버튼을 클릭합니다. 

 

 

저장하실때 스킨이름을 리눅스킨 v1.1으로 입력해주세요. 스킨 보관함에서 리눅스킨 v1.1을 선택하신 후 [적용] 버튼을 누르시면 설치가 완료됩니다. 

 

 

 

주의사항

1. 마음껏 수정해서 쓰세요.

리눅스킨은 설치 후 각자의 필요에 따라 마음껏 수정하셔도 됩니다. 

 

2. 배포는 리눅스킨 제작자의 블로그, bskyvision에서만 합니다.

대단한 스킨은 아니지만, 요며칠간 밤잠을 줄여가며 만들었습니다. 리눅스킨을 마치 자신이 직접 만든 것처럼 배포하지 마세요. 

 

3. 푸터는 수정하시면 안됩니다. 

푸터 좌측에는 copyleft@bskyvision (리눅스킨 v1.1)이 있고, 푸터 우측에는 copyright@여러분의블로그명 이 나옵니다. 이 부분은 절대 수정하지 마세요. 그래야 좌측의 제 블로그 링크를 통해서, 리눅스킨에 관심 있는 분들과 제가 연결되기 때문입니다. 

 

4. 리눅스킨을 설치하신 분들은 댓글로 설치하셨다고 알려주세요.

다른 분들의 블로그에는 어떻게 리눅스킨이 적용되었는지 궁금해서요.^^ 

 

마무리 인사

리눅스킨 v1.1이 마음에 드신다면, 한번 설치해서 사용해보세요. 사용 중에 문제가 있거나, 개선할 점이 있다면 댓글이나 방명록 또는 이메일(kyohoonsim@gmail.com)로 피드백을 주시면 감사하겠습니다. 더 나은 스킨이 되도록 꾸준히 업그레이드시키겠습니다.  

 

또한 이 스킨을 제작하는데 지속적으로 피드백을 준 친구 문땡땡 개발자님에게도 감사의 마음을 표합니다. ㅋㅋ 

댓글

  1. 입력잘안됨 @2020.11.18 11:17   댓글주소   수정/삭제   댓글쓰기

    댓글 입력을 위한 이름/비밀번호/홈페이지 항목에 클리해도 활성화가 안되네요
    댓글 본문창도 한가운데를 클릭해야 활성화되고 아니면 선택이 안됩니다.

    그리고 이거 스킨 만드는데 도움준 사람 있는걸로 알고있는데 이름 언급을 안하시네요?
    혼자 다 생각한줄 알겠어요

    출근도장 2020 11 18 11 20

  2. 아까 안됐었음 @2020.11.18 15:18   댓글주소   수정/삭제   댓글쓰기

    지금은 잘되네? ㅋㅋ

    https://jwprogramming.tistory.com/54

    여기처럼 맨 위에 방문자수 보이게 하면 이쁠듯

  3. BlogIcon 신규 블로그 생성 @2020.11.25 13:05   댓글주소   수정/삭제   댓글쓰기

    신규로 블로그 구축하면서 스킨 적용했습니다! 추후에 설정 변경해서 사용할께요 좋은 스킨 감사합니다.

[1] [···] [11] [12] [13] [14] [15] [16] [17] [18] [19] [···] [546]