demun(대문블로그)

티스토리/스킨변경제작이력2014. 5. 14. 07:00

요즘 반응형 스킨을 제작하고 있는데 시간이 너무 걸려서 근황을 소개하려고 글을 작성합니다.이번에 제작하는 반응형 스킨은 부트스트랩을 포함하지 않습니다.그래서 ie까지 모두 지원하는 스킨을 만들고 있습니다. 1단,2단3단 레이아웃 모두 만들고, 여러가지 컬러셋을 적용하는 버젼을 모두 만듭니다.거기에다가 각종 플러그인이 장착이 된 버젼까지 전부 따로 따로 만듭니다. 그러다보니 각각의 파일과 레이아웃, 컬러셋마다의 분리가 필요하고 관리가 엄청 납니다.만들다보니 거의 프로젝트 수준입니다. 여기에 Grunt 를 적용해서 좀더 완성적으로 만들려고 익히면서 만들고 있습니다.현재 그런트에 들어가는 플러그인은 7개 정도인데 targethtml, handlebars 정도가 더 들어갈수도 있을거 같네요.이제 세네개 컬러셋을..

티스토리/스킨변경제작이력2013. 1. 23. 21:17

당초에 예상했던 스킨은 작업이 90%가량이 끝난상태입니다. 하지만 계획이 변경되었습니다. 좀더 좋은 스킨을 만들고자함입니다.이전처럼 다 제작되면 어느정도 테스트하고 배포하는 형태가 아닌 이왕이면 잘 만들어서 여러분과 공유하고, 오래 사랑받는 스킨을 만들고자 함입니다. 2단 레이아웃에 여러 형태의 구글광고가 탑재하기 용이하게 제작하려 했지만 좀더 좋은쪽으로 계획을 변경했습니다.당초의 계획은 아래와 같습니다.1. 2단 레이아웃.2. 여러형태의 구글광고 탑재.3. 가볍고 심플한 스타일.4. 다양한 컬러셋.5. 티스토리 본래의 기능지원(스킨위자드,티에디션,블로그메뉴 등).6. 마크업검사에 통과할정도의 깔끔한 코드와 크로스브라우징(ie7 이상지원, ie6은 보너스 그닥 신경쓰고 싶지 않음....) 제작하려는 컬러..

티스토리/스킨변경제작이력2013. 1. 20. 15:27

이번에 에드센스 스킨을 제작했습니다.아이콘이 있는 스타일과 아이콘이 없는 스타일 크기 두가지 입니다.그런데 각각 컬러셋이 16개가 존재합니다. 물론 스타일은 같고, 컬레셋만 바꾼겁니다. 여하튼 각각의 스타일을 사용해보고, 테스트를 해줘야 합니다. 이 스킨은 스킨위자드, 티에디션, 메뉴설정 등 모두 다 지원합니다. 각각 테스트 해보시고, 무엇보다 광고를 다 삽입을 해보셔야 합니다.구글의 광고를 약 7가지 형태를 지원합니다. 각각의 구글 광고를 삽입해보고, 잘 되는지 확인 해야 합니다.제가 평일에는 시간이 안되고 주말에만 작업이 가능해서 시간이 더디네요.... 테스트를 해줄분은 아래의 사항에 맞아야 합니다.티스토리 스킨을 잘 알고 있는 분스킨을 변경하는데 있어 무리가 없는 분.html, css 를 어느정도는..

티스토리/스킨변경제작이력2013. 1. 20. 14:46

스킨을 제작하고 있는데 거의 완성되어 갑니다.한가지를 놓고 고심을 하고 있는데 아이콘이 잇는 스킨과 아이콘이 없는 스타일 입니다.두가지 스샷을 첨부하니 어떤것이 더 좋은지 댓글로 알려주세요. 아이콘이 없는 스킨. 아이콘이 있는 스킨

티스토리/스킨변경제작이력2013. 1. 15. 05:00

현재 적용하고 있는 반응형 티스토리 스킨인 Responsive 스킨은 어두운 컬러셋을 가지고 있습니다.다양한 환경과 디바이스에 맞춰서 제작은 했지만 광고가 매끄럽지 못한 단점이 있습니다.물론 수정하면 되지만 처음 기획했던 부분과 맞지 않아서 더이상의 업데이트는 없을것 같구요. 이전까지 만들었던 Adsense 스킨이 버젼 3까지 나왔습니다.이번에는 이전에 만들었던것을 전부 재코딩해서 이전의 기획의도였던 구글 애드센스 광고를 스킨에 포함할수 있는 최적화 스킨을 다시 만들고 있습니다.큰 틀은 이렇습니다. 1.배경이 흰색입니다.위에서도 잠시 이야기했지만 광고는 뭐니뭐니해도 흰색배경이 가장 잘 어울립니다.가독성부분에서도 흰바탕에 검은색글씨가 최고구요. 2. 최대한 가볍게.최대한의 기능을 뺄려고 합니다.기능이 추가..

티스토리/스킨변경제작이력2013. 1. 6. 11:00

이글은 Responsive 스킨을 만든후 하나 하나 업데이트 하는 과정과 수정 사항을 올리기 위한 글입니다.이글은 업데이트 될때마다, 그리고 문제점을 하나 하나 해결해 나갈때마다 목록을 추가합니다. 정말 많은 이슈가 있어 어려움이 많습니다.티스토리 스킨을 반응형으로 제작한다는것은 매우 어려운 일이군요.여기에 예상치못한 어려움은 배경색입니다. 어두운 컬러셋으로 작업을 했는데 티스토리에 추가되는 플러그인들이 전부 흰색 배경을 지원하고, 수정또한 어렵습니다.플러그인 자체가 외부에서 들어오느 자바스크립트라 스타일로 작업이 되는것이 있고, 안되는것은 자바스크립트로 스타일을 지정해줘야 합니다. 1. 사이드바 프로필 레이어.사이드바의 스타일과 비슷하게 작업. 2. 글박스 - 서식중에서 글박스 스타일.글색상을 #333..

티스토리/스킨변경제작이력2013. 1. 4. 16:14

이번에 부트스트랩을 사용하지 않고 반응형으로 티스토리 블로그 스킨을 만드는데는 상당이 많은 문제점이 있었습니다. 반응형 Responsive 스킨을 만들면서 어떤 신기술이 들어가고 티스토리에서 지원하지 않는 사항들은 무엇인지 알아봅니다. 1. 웹폰트 아이콘 - 티스토리 문제점. 웹폰트 아이콘 : 폰트를 이용해서 이미지대신 아이콘을 표시하는 것을 말합니다. 웹폰트 아이콘을 사용하면 이미지보다 가볍게 사용할 수 있다는것이 큰 장점입니다. 웹폰트 아이콘은 이전에 부트스트랩을 사용하면서도 있었습니다. 부트스트랩 공식? 웹폰트 아이콘은 Font Awesome 입니다. 부트스트랩 홈페이지에도 나와 있습니다. 문제는 이것이 로컬에서는 문제없이 되는데 티스토리에서 사용하면 안된다는 점입니다. 특이 문제를 일으키는 브라우..

티스토리/스킨변경제작이력2012. 12. 13. 09:00

부트스트랩 프레임워크를 활용해서 버젼3까지 제작하고 이번에는 Responsiv 라는 이름으로 반응형 티스토리 스킨을 제작해보았습니다.부트스트랩이 그리드 시스템을 지원하니 어지간하면 따로 미디어쿼리를 제작하지 않아도 반응형으로 작동합니다.허나 티스토리 자체의 요소가 있기에 전혀 손을 안되고는 안되더군요. 현제 제 블로그 스킨은 Responsive 입니다. 2012.12.10 현재. 주요 사항이 배경을 rgba 를 사용해서 보일듯 말듯 스타일을 처리했습니다.그러다보니 RGBA를 지원하지 않는 IE8 이하에서는 조금 스타일이 다릅니다. 뭐 굳이 Ie8이 지원하지 않는 RGBA 라던가 border-radius 등은 따로 처리하지 않았습니다. ie9이상에서는 무리없이 보여집니다. 중요한것은 반응형 responsi..

티스토리/스킨변경제작이력2012. 8. 2. 00:11

현재 제 블로그에 부트스트랩 버젼 3이 적용되어 있습니다. 여러가지 기능이 테스트 겸해서 끼워 넣었습니다. 여러분들이 제 블로그에 있는 기능들에 대해서 이것 저것 보시고 필요없는 부분과 꼭 필요하다고 생각되는 부분을 알려주시면 고맙겠습니다. 그러면 제가 배포할때 그 부분을 반영해서 배포하도록 하겠습니다. 기능에 대해서 논할 부분은 아래와 같습니다. 1. 사이드바 축소기능. 클릭하면 좁히고, 넓히고 하는 기능입니다. 2. 상단메뉴에서 배경 변경하는 기능. 3. 상단메뉴에서 위젯 테마 변경 기능. 4. 미디어 갤러리에서 이미지 슬라이더 기능. 5. 미디어 캘러리에서 골라보는 이미지 갤러리. 6. 사이드바 토글 기능. 이것도 해당이 될까 생각이 드는데...일단 적어봅니다. 여러분이 어떻게 생각하는지. 사이드바..

티스토리/스킨변경제작이력2012. 8. 1. 22:38

이전에 제가 블로그 메뉴와 카테고리를 메인메뉴 형식으로 사용하는 방법을 적은 적이 있습니다. 이번에 제가 부트스트랩 스킨에 블로그메뉴와 카테고리메뉴를 메인메뉴로 사용하고 상단에 배치되었던 탑메뉴를 약간 수정했습니다. 레이아웃이 이상하게 보인다면 새로고침을 한번 해주세요. 수정이 이뤄진점은 아래와 같습니다. 부트스트랩에서 지원하는 빵부스러기....현재 위치를 말하죠. 그 부분이 한줄 전체를 차지했는데, 블로그메뉴와 카테고리메뉴가 들어가면서 3가지 메뉴를 전부 한줄로 표시했습니다. 하위 메뉴는 전부 드롭다운으로 구성했구요. 제가 비밀카테로리로 비공개 메뉴를 사용하는데 그것은 감추었습니다. 아래 이미지를 참고하시기 바랍니다. 현재 위치(beadcrumb)는 제일 왼쪽으로, 블로그메뉴는 그다음으로, 우측으로는 ..