demun(대문블로그)

티스토리스킨수정/메인메뉴2012. 8. 4. 06:00

제가 스킨을 제작하면서 조금 불만아닌 불만인 점이 블로그 메뉴와 카테고리 메뉴 입니다. 티스토리는 치환자라는 개념이 있어서 html 을 업로드하면 서버에서 치환자가 html 로 변환되어서 보여집니다. 이 부분에서 불필요하게 추가되는 부분이 있습니다. 그래서 기존과는 조금 다른 마크업이 되어서 사용하는데 어려움이 없지않아 좀 있습니다. 이 부분을 해결해보고자 합니다. 평소 블로그메뉴는 홈, 태그로그, 미디어로그, 지역로그, 방명록....등으로 나뉘고, 추가적으로 공지사항이나 관리자, 글쓰기 등을 만들기도 합니다. 근데 문제는 홈이나 방명록을 제외하고는 거의 사용하지 않습니다. 추가적으로 만드는 관리자나 글쓰기등은 그래도 종종 사용합니다. 그래서 제가 생각한것은 블로그 메뉴라고 하고 그 하위로 모든 메뉴가 ..

티스토리스킨수정/스킨수정팁2012. 6. 16. 17:25

html5로 마크업한 티스토리 스킨 그레이보더입니다. 제가 배포한 스킨인데, 사용하신분이 수정사항을 여쭤보셔서 제가 좋다고 판단되어 스킨에 반영하기로 하였습니다. 수정사항은 이미지가 첨부되오니 참고하시고 코드도 같이 쓰니까 먼저 받으신분은 수정하시기 바랍니다. 수정사항과 방법을 아래에 나열합니다. 수정 사항. 1. 카테고리 새글 표시 아이콘 관리자 화면의 카테고리 수정에서 새글표시 아이콘을 설정할 수 있습니다. 이전에는 아래처럼 나왔습니다. 사이드바의 블로그 이미지를 설정하는코드가 카테고리에도 적용이 된 것이였습니다. /* 수정전 */ .boxList img { width:170px; overflow:hidden; } /* 수정후 */ .blogImage img { width:170px; overflow..

티스토리스킨수정/기타2012. 6. 9. 06:00

스킨을 이것 저것 사용하다보니 티스토리에서 제공하는 로그인바가 때로는 잘 안보일때가 있습니다. 그것은 스타일이 겹쳐서 생기는 현상입니다. 만약 사용하고 계신는 스킨중에서 저와 같은 증상이 있는 분은 수정을 해주시면 됩니다. 일단 저의 경우를 한번 예제로 보시죠. 상단에 보니 회색으로 로그인바가 가려져 있습니다. 이것은 티스토리에서 기본적으로 아래와 같은 코드로 배경이미지가 되어 있습니다. .tt_menubar_blackSemiBar .tt_menubar_bg_toolbar { background: url("http://i1.daumcdn.net/cfs.tistory/static/admin/new/box_d02.png") no-repeat scroll 0 0 transparent; } 회색의 배경이 지정 ..

티스토리스킨수정/댓글2012. 5. 30. 06:00

간혹 댓글이 엄청 많은 블로거 분들을 봅니다. 저의경우 댓글이 별로 없어서 해당 사항이 없지만 댓글이 많으면 설정에서 댓글 감추기를 설정해놓으면 되지만 보이기를 원하는분이 있을겁니다. 근데 댓글 보이기를 하면 엄청 많은 댓글까지 스크롤을 해서 맨 아래에 있는 댓글창까지 가서 댓글을 쓰기에는 방문자들이 귀찮아 하겟죠. 그럴때는 댓글창을 위로 올리는 방법을 택하면 됩니다. 이건 방문자를 위한 배려입니다. 스킨을 제작할때 저는 그렇게 합니다만 만약 그렇지 않은 스킨을 사용하는 분이라면 변경을 해보세요. 댓글창을 아예 스킨 맨 위로 올릴수도 잇지만 그건 디자인쪽으로 아니라고 봅니다.ㅎㅎㅎ 단지 댓글 리스트와 댓글쓰기창의 위치만 바꿔줘도 댓글이 많은 분들은 좋다고 생각합니다. 방법은 매우 간단합니다. css를 손..

티스토리스킨수정/검색2012. 5. 29. 06:00

티스토리 스킨에는 검색 기능이 있습니다. 많은 블로거분들이 구글 광고를 사용하고 또한 구글 맞춤검색(이하 cse 라고 부릅니다.)을 사용할겁니다. 여기서는 구글 맞춤검색을 사용한다고 가정하고 진행해보겠습니다. 즉 구글 맞춤검색을 생성하는 과정은 아닙니다. 아주 간단하게 티스토리의 검색을 사용하지 않고 구글 cse 를 사용하는 방법을 알아보겠습니다. 일단 티스토리에서 제공하는 검색을 대략 알아보겠습니다. 아래 이미지를 보시면 input 가 두개가 있고, 밑에 확인버튼에 해당하는곳에는 클래스 submit 가 있습니다. 즉 여기서 필요없는 부분은 바로 input 두개입니다. 이 부분을 주석처리합니다. 그럼 아래와 같은 형식이 될겁니다. 만약 사이드바가 아닌 다른곳이라면 아래와 같은 형식입니다. 그럼 구글 cs..

티스토리스킨수정/댓글2012. 5. 24. 13:33

티스토리의 라이브 댓글 방식인 라이브리라는 댓글이 있습니다. jquery를 포함한 방식인데. 여하튼 이 댓글이 티스토리의 댓글과 라이브리 댓글과 같이 보여지는 방식이기 때문에 좀 귀찮은 부분이 있습니다. 방문하는 모든 방문자가 전부 라이브리 댓글을 사용하는것은 아니니 평상시에는 감쳐져있고 클릭을하면 보여지는 형식을 선택했습니다. 티스토리에서는 그런 방식이 없지만 라이브리를 사용하면 jquery 가 자동으로 삽입이 되니 간단한 jquery를 사용하면 됩니다. 자 보여지고 감쳐지는 라이브리 댓글창을 만들어봅시다. 먼저 완성이 되면 어떻게 보여지는지 한번 보겠습니다. 평상시에는 닫쳐있다가 클릭하면 이미지의 색깔이 변하면서 댓글창이 보입니다. 첫번째. 먼저 준비물인 이미지가 있어야겟지요. 아래의 이미지를 스킨편..

티스토리스킨수정/검색2012. 5. 21. 10:14

검색창을 다는 방법은 이전에 적은것이 있습니다. 아는것을 쉽게 풀어쓴다는것이 정말 힘듭니다. 그와 관련해서 더욱 보강하는 글이 되겠습니다. 이전에는 사이드바에 검색창을 다는 방법이였지만 이글은 사이드바가 아닌곳 특히 상단 제목 있는 부분에 다는 방법입니다. 이는 다른곳에도 적용이 가능합니다. 검색창 사이드바에 다는 방법 => http://demun.tistory.com/1992 주로 스타일을 입히는 방법은 제각각 이므로 좀 제외하고 위치를 잡는 방법을 알아보겠습니다. 일단 목표는 상단의 제목부분을 두개로 나누어서 하나는 기존의 제목을 사용하고 다른 한 공간에 검색창을 다는것입니다. 원하는 사이트이 디자인을 한번 볼까요? 보시다시피 제목 하나만 존재합니다. 그러다보니 두개로 나누어서 우측에 빈공간에 검색창..

티스토리스킨수정/스킨수정팁2012. 4. 15. 22:43

개인적인 부탁으로 특정 사이트의 워드프레스 스킨을 티스토리용으로 변환해달라고해서 이틀동안 시간을 내서 마무리를 지었습니다.만든사람은 잘 알지만 사용상의 편의를 위해서 변경해야할 부분을 사이드바에서 수정할 수 있도록 하였습니다.변경할 부분은 아래 이미지를 클릭해서 보시면 됩니다. 사진이 너무 커서 더보기를 사용합니다. 위의 이미지를 보시면 1번~5번까지 표시를 한것이 보일겁니다.사이드바에서 수정할수 있도록 한것이며 관리자화면에서 사이드바 수정화면을 보겠습니다. 정확하게 사이드바 1 에는 사이드바 1-topnav 라고 적힌 것을 넣어줘야 합니다. 앞에 사이드바 1~사이드바 5까지 번호를 넣어놔서 사용하는데는 무리가 없습니다. 사이드바 4번이 우리가 알고 있는 사이드바입니다. 이부분은 넣을것은 넣고 뺄것은 빼..

티스토리스킨수정/메인메뉴2012. 4. 8. 14:24

블로그를 통해 메인 메뉴를 변경하는 방법을 문의한 분이 있어 간단하게 말하려 했으나 워낙 양이 길어 포스팅으로 합니다.기존의 한줄로 나오는 메뉴를 jQuery 를 사용한 megamenu 로 사용하는 방법입니다.스킨을 변경하기전에 반드시 스킨을 저장을 하고 시작하세요. 즉 백업을 먼저 하라는 말입니다. 수정하다가 잘못되면 언제는 다시 되돌려야하니까요.먼저 아래의 파일을 다운로드 받아 스킨편집에서 모두 업로드합니다. 그런다음 위에 아래의 코드를 붙여넣기 합니다. 그런다음 티스토리 블로그 치환자부분을 변경합니다.예제로 삼은 블로그의 코드를 보니 아래처럼 나옵니다. 노랑색으로 칠한 부분을 아래의 코드로 변경합니다. 홈 리스트 1 리스트 1.1 리스트 1.2 리스트 1.3 리스트 2 리스트 2.1 리스트 2.2 ..

티스토리스킨수정/스킨수정팁2012. 2. 1. 06:00

Stripe_Default 스킨은 제가 미리 코드를 넣어 놓은것이 몇군데 있습니다. 그래서 사용할 때는 반드시 본인것으로 수정해서 사용해야 합니다. 스프라이프 스킨이 필요하시면 배포글을 참고하세요. 수정 할 부분을 하나 하나 알려드리겠습니다. 1. 구글 메타 태그. 안에 구글 메타태그를 본인것으로 수정하세요. 구글 광고를 안하시는분은 아래 이미지의 한 줄을 그냥 삭제하시면 됩니다. 2. 소셜 링크. 아래 이미지처럼 저의 주소로 모두 되어 있으니 본인것으로 수정하시면 됩니다. 한가지 기본 RSS 주소를 사용한다면 RSS 주소는 그냥 두셔도 됩니다. 만약 피드버너등을 사용한다면 해당 주소로 변경하시면 됩니다. 3. 본문 구글 광고. 본문 위에 보여지는 구글 광고를 본인것으로 수정하세요. 아래 이미지를 보시면