티스토리 뷰


log by 1.0

이번에 티스토리로 블로그를 시작하면서 맘에꼭드는 스킨이 없어 직접 만들게 됐습니다.


티스토리 #1 스킨을 기본으로 필요 없는 것은 제거하고 필요한 것은 추가해서 (내 입맛에)알맞게 고쳤습니다.


가장 중요한 것은 읽기 편해야 한다는 것, 독자분들께서 메뉴판에서 길을 잃는 일이 없어야 한다는 것.


이틀간 열심히 달려서 만들었는데 아직 모든 환경에서의 테스트는 안됐습니다. 혹시나 원하는 화면처럼 안보이시는 분들은 제보 부탁드릴게요.


티스토리 블로그 스킨 - 로그 바이 - 는 아무나 맘대로 고쳐서 재배포를 해도 상관 없습니다~


logby(2017-03-18).zip

▲스킨 다운로드


무료지만! 너무 맘에들어서 작가를 칭찬해주고 싶으신 분들께선


http://storefarm.naver.com/catory/products/654580677


http://catory.kr


주변에 이 두 곳을 소개해 주세요


제가 직접 손으로 만들고 있는 고양이 가죽 목걸이와,


고양이에 대한 바른 정보를 널리 알리기 위해 만든 커뮤니티 사이트입니다.



스킨 고쳐쓰기

1.설치

블로그 관리에서 [스킨]을 들어가면 우측 상단에 스킨 등록 버튼이 있습니다. 위에서 받은 압축파일을 풀고 모든 파일을 등록하면 됩니다.(하위 폴더에 있는것도 다 올리시면 자동으로 폴더 지정이 되더군요-저도 티스토리 시작한지 이틀돼서..)


등록 후 스킨 - PC보관함 탭에서 업로드 된 스킨의 [적용] 버튼을 누르면 적용!


2.헤더 배경 바꾸기

블로그 관리에서 [HTML/CSS 편집]을 들어가면 우측 코딩창에서 파일 업로드가 가능한데, 여러분께서 원하시는 배경을 bg.jpg라는 이름으로 업로드 해서 저장해주시면 적용됩니다.

배경 사진은 위에 검은 필름지가 적용돼서 자동으로 어둡게 적용되며, 좌우폭이 크고 중앙에 어필할 요소가 있는 사진이면 예쁘게 들어갈 것입니다.

(적용후 다른 창에서 컨트롤F5로 완전새로고침해서 확인하세요!)


3.헤더 로고 바꾸기

[기존 블로그 이름을 로고자리에 출력하기]


[HTML/CSS 편집]에서 우측 CSS탭을 누르시면 CSS수정이 가능한데,


여기 보시는 50번 라인에서 display:block; 을 display:none;으로 고치면 그림로고가 안보이게되고

51번 라인의 display:none; 을 display:table-cell; 로 고치면 블로그 이름이 출력됩니다.

나중에 그림로고를 쓰실경우엔 다시 돌려놓으시면 됩니다.


(적용후 다른 창에서 컨트롤F5로 완전새로고침해서 확인하세요!)



[바탕이 투명한 그림로고 적용하기]


[HTML/CSS 편집]에서 우측 파일업로드에서 logo.png를 본인의 로고로 바꾸시면 적용되는데



이렇게 동일사이즈로 바탕은 투명하게 제거해서 logo.png로 저장하셔야 기존 로고를 정확히 대체할 수 있습니다.


다른 사이즈의 로고를 사용하실 땐 CSS코드를 수정하셔야 합니다.


[바탕이 투명한 PNG로고 만들기] - 누르면 이동


(적용후 다른 창에서 컨트롤F5로 완전새로고침해서 확인하세요!)


#.기타 문의

제가 엄청나게 게으르긴 하지만 한번씩 꼭 필요한 의견들을 선정해서 수정방법을 밑에 계속 추가하겠습니다.



저작자 표시
신고
댓글
  • 이전 댓글 더보기
  • 프로필사진 최제공 스킨 적용을했는데 메뉴가 안보이면 어떡하죠? 설명글 보면서 했는데 저는 메뉴버튼이 없어요 2017.03.22 00:55 신고
  • 프로필사진 donza 적용해주신 페이지를 주소로 보여주시면 문제파악이 가능하지만 메뉴바가 안뜬다의 단서만으로는 뭐가 문제인지 알 수가 없습니다 ㅠㅠ 2017.03.22 12:38 신고
  • 프로필사진 최제공 오 감사합니다! 추가했습니다 근데 그 버튼이 안눌리는건 왜그런거죠? 2017.03.22 19:18 신고
  • 프로필사진 donza 버튼이 작동을 안하는건 자바스크립트 오류가 있는것입니다.
    images폴더에 js파일이 제대로 업로드가 안됐거나 스킨 외에 불량한 스크립트 소스가 삽입되어서 코드가 꼬이면 그럴 수 있어요.
    2017.03.22 19:20 신고
  • 프로필사진 최제공 다시 삭제했다가 깔면 버튼 눌릴까요? 2017.03.22 19:30 신고
  • 프로필사진 donza 네 소스는 이상이 없으니까요 일단 모든파일이 제대로 업로드 됐는지 확인해보세요. 2017.03.22 19:43 신고
  • 프로필사진 최제공 크롬으로 눌렀을때 안되네요 익스플로러는 눌립니다 2017.03.22 20:09 신고
  • 프로필사진 donza 자바스크립트로 되어있는거라 브라우저를 타진 않을겁니다

    제대로 안된다면 컨트롤F5로 리소스까지 전부 새로고침 해서 다시 확인해보세요~
    2017.03.22 23:28 신고
  • 프로필사진 최제공 넵 감사합니다 2017.03.22 23:29 신고
  • 프로필사진 쉬엄쉬엄 노리터 블로그 용도는 상업용이 아닌 개인 자료를 보관할려고 사용하고 있습니다.
    개인자료는 가족사진 저장이 주 목적이라 네이버, 다음 등 모두 비공개로 운영하고 있습니다.
    사진 업로드가 목적이다 보니 사진을 크게 올릴수 있는 곳은 다음카페, 티스토리 밖에 없더군요.
    다음카페는 예전에 가입했던 카페는 크게 올릴수 있는데 최근에 가입한 카페는 제한을 두어 올리지 못하게 되었습니다.
    그래서 발견한 곳이 티스토리였습니다.

    서두가 너무 길었네요.
    티스토리에서 제공하는 스킨을 많이 적용해 보았는데 맘에 든 것이 별로 없었습니다.
    사진을 올리는 것은 배경이 깔끔하고 간단한 메뉴만 있으면 되는데
    제가 html이 초보라서 인터넷에 정보를 보고 해 보아도 잘 안되더군요.
    그래서 찾게 된 곳이 이곳입니다.
    제가 바로 원하는 스킨입니다.
    감사합니다. 잘 쓰겠습니다.
    2017.03.26 06:12 신고
  • 프로필사진 donza 잘 써주셔서 감사합니다~ 2017.03.27 12:02 신고
  • 프로필사진 쉬엄쉬엄 노리터 블로그 스킨 잘 쓰고 있습니다.
    한가지 수정을 했으며 하는 부분이 있는데 혼자 고민하고 시도해 보다가 안되어 문의 드립니다.
    바쁘실텐데 조언 부탁드립니다.

    카테고리 링크 가 모두 펼치기로 되어 있는데 모두 접는 태그를 좀 가르쳐 주십시요.
    다른 블로그님들의 속성과 다르게 되어 있는지 찾을수가 없어서요.
    이것만 수정하면 제가 사용하는데 100% 만족입니다.
    2017.03.27 18:42 신고
  • 프로필사진 donza 아.. 댓글을 지금 읽었습니다.
    접기 펼치기 기능자체를 구현하질 않았습니다.
    하위카테고리가 정말 많은 경우를 생각하지 못했네요. 이건 제가 요즘 바빠서 언젠가는 만들어 넣으면 좋을텐데 그게 언제가 될지 확답을 못드리겠습니다 ㅠㅠ
    2017.03.31 21:09 신고
  • 프로필사진 Hun E 우선 완벽한 스킨을 무료로 배포해주셔서 감사합니다.
    잘 사용하고 있네요

    한가지 질문이 있어서 댓글 남깁니다.
    타이틀 bg에서 검정색으로 어두운 필터를 없애고 싶은데 어디를 수정해야 하는지 알려주실 수있나요??

    얼마 남지않는 하루 행복하게 보내십쇼!
    다시한번 감사드립니다.
    2017.03.27 20:16 신고
  • 프로필사진 donza 제가 더 감사합니다~

    CSS 49번 줄 근처에
    .hd_visual .blog_ttl
    옵션 항목들이 있을거예요

    그 중에 background속성 안에 0.5로 돼있는 부분을 0으로 고치시면 돼요 그게 바탕 투명도거든요
    2017.03.27 22:15 신고
  • 프로필사진 Hun E 답변 감사합니다. 정말 예쁘게 잘쓰겠습니다.

    좋은 밤 되시구 내일도 좋은 하루 보내세요!! 굿밤입니다.
    2017.03.27 22:47 신고
  • 프로필사진 비밀댓글입니다 2017.03.28 01:54
  • 프로필사진 donza 써주셔서 감사합니다~~ 2017.03.28 19:16 신고
  • 프로필사진 비밀댓글입니다 2017.03.29 21:57
  • 프로필사진 donza 제가 들어가니 잘 보이는데요 ㅠㅠ 혹시 아직 안보이시면 컨트롤 F5로 소스까지 완전히 새로고침 해보세요~ 2017.03.29 23:06 신고
  • 프로필사진 몽스부인 다른분 문의한거 보고 새로고침 해서 해결했습니다! 감사합니다. 지금 이것저것 수정하고 있는데 워낙 기본 틀이 좋아서 너무 맘에 들어요. 잘쓰겠습니다. 감사합니다^^ 2017.03.30 01:01 신고
  • 프로필사진 donza 네~ 잘 써주셔서 감사합니다 2017.03.30 08:57 신고
  • 프로필사진 비밀댓글입니다 2017.03.30 10:30
  • 프로필사진 donza 작성시간은 티스토리에서 내려오는 치환자를 그대로 쓰는거라 다른 방법은 저도 모르겠습니다.

    썸네일 크기를 키울경우 우측의 내용물이 들어갈 자리가 훨씬 협소해집니다.

    썸네일을 키우고 내용까지 다 보이게하려면 썸네일을 풀사이즈로 쓰고 하단에 내용물이 뜨게 바꿔야합니다.

    그런 형식의 스킨을 사용하시길 권합니다.

    또한 제목 밑의 요약내용으로 포스팅의 내용을 알려준다기보다 호기심을 자극해서 포스팅을 읽으러 들어오는 용도라고 생각하시고 어떤게 좋은 방법일지 고민해보시기 바랍니다.

    제 스킨은 어떤식으로 바꿔서 쓰셔도 무방하지만 주문제작급의 질문은 저도 난처합니다.
    2017.03.31 21:30 신고
  • 프로필사진 비밀댓글입니다 2017.03.30 11:17
  • 프로필사진 donza 분명 덮어쓰기 하셨다면 ^^
    새로고침을 해보세요
    그냥 새로고침하시면 리소스는 캐쉬에 그대로 남습니다.
    위에 많은 댓글에 있듯 컨트롤 누른채로 F5를 누르시면 내부 모든 소스가 새로고침됩니다.

    정말로 정상적인 업로드가 됐다는 가정하에선 되실거에요~
    2017.03.31 21:13 신고
  • 프로필사진 람세스~ 예쁜 스킨 공유해주셔서 감사합니다.
    다음이 아니라 현재 이 스킨을 적용해서 사용하고 있는데요. 모바일에서 좌우로 약간씩 밀리는 경향이 있습니다.
    #1 스킨을 적용하면 좌우로 밀리지 않고 딱 고정이 된채로 보여지는데, 이 스킨을 사용했을때는 모바일에서 글의 화면을 좌우로 밀면 고정되지 않고 흔들리는 것처럼 밀어집니다. 왜 그러는지 답을 찾지 못해 문의 드립니다. 수고스럽더라도 답변 좀 부탁드립니다 ㅠㅠ
    2017.03.31 19:56 신고
  • 프로필사진 donza 밀린다는 페이지가 따로 있나요? 링크좀 부탁드릴게요
    제가 람세스님 페이지를 몇군데 봤는데 아무데도 밀리는데가 없어서요

    컨텐츠 중간에 강제적으로 좌우폭을 넘어가버리는 요소가 있었을 거예요 잘 찾아서 확인 부탁드려요
    2017.03.31 21:14 신고
  • 프로필사진 람세스~ 구글 본문 광고가 336사이즈다 보니 강제로 밀렸나 봅니다. #1를 적용했을때는 336사이즈여도 이게 잡아져서 고정이 되는데, log by 1.0에서는 그게 안되서 좌우로 밀면 약간씩 글이 흔들리듯이 밀리는 것 같습니다. 좌우 여백을 좀더 늘려야 되는 걸까요? 귀찮게 해서 죄송합니다. 그리고 답변 감사합니다 ^^ 2017.03.31 21:32 신고
  • 프로필사진 donza 댓글 확인이 늦었네요
    반응형 광고를 써보시고 336사이즈를 꼭 써야하는 이유가 있다면 가로스크롤을 막아버리는 방법도 있습니다.
    css에서 body{} 태그라던지 광고 감싸는 아무개체에나 overflow-x:hidden을 적용하면 되지 싶어요.
    2017.04.04 19:55 신고
  • 프로필사진 비밀댓글입니다 2017.04.05 11:19
  • 프로필사진 비밀댓글입니다 2017.04.05 11:26
  • 프로필사진 봄처녀 안녕하세요! 예쁜 스킨 공유해주셔서 너무 잘쓰고 있어요! 다름이아니라 카테고리?여는 아이콘 색상이 흰색인데 색을바꿀 수 있나요? ㅠ 헤드색상을 흰색으로 하려는데 잘안보여서요..ㅠㅠㅠ 2017.04.05 16:53 신고
  • 프로필사진 donza 반갑습니다~
    헤더 바탕을 완전히 흰색으로 하게 된다면 ico_skin.png 파일의 제일 좌측 위에 있는 흰 줄 세개를 색상을 넣어 고치는 게 최선일 것 같습니다. 기존에 있는 흰 버튼에 검은 바탕을 깔아주는 것도 방법이지만 깔끔하진 않겠네요. 해결점을 못찾으신다면 또 질문 주세요~
    2017.04.05 23:30 신고
  • 프로필사진 노루꿍댕이 감사히 잘쓰겠습니다! 2017.04.06 17:42 신고
  • 프로필사진 donza 반갑습니다~~ 잘쓰세요~! 2017.04.07 19:37 신고
  • 프로필사진 리메이크 코리아 답글이 늦어습니다.
    여러모로 좋은 스킨이라 여기면서
    잘 쓰도록 하겠습니다.

    멋진 봄 되세요!
    2017.04.08 02:24 신고
  • 프로필사진 donza 넵~ 잘 써주셔서 감사합니다~ 2017.04.09 12:09 신고
  • 프로필사진 비밀댓글입니다 2017.04.19 00:04
댓글쓰기 폼