반응형 skeleton 스킨으로 변경중...

티스토리 일반스킨에서 반응형스킨(markquery님의 skeleton)으로 변경중입니다.
이렇게 저렇게 테스트 하면서 고치고 있어서 블로그가 원활하게 보이지 않을수 있음을 양해 바랍니다.
능력되는데로 최대한 빠르게 수정 하도록 하겠습니다.ㅜㅜ

(왼쪽 : 수정전 티스토리 모바일화면 / 오른쪽 : 수정후 반응형 모바일화면)

(왼쪽 : 수정전 블로그 화면 / 오른쪽 : 수정후 반응형웹 화면)

전체적으로 심플하게 되기는 했으나, 로딩시 다소 좀 오래걸리는듯한 느낌이네요.

나중에 스킨을 다르게 변경하고자 할때 필요할거 같아서, 참고한 링크나 수정했던 부분들을 정리해봤습니다.
이렇게 막 수정해도 되는지 모르겠네요.

1. 스킨설정 (반드시 백업후에 하시고, 작업 중간중간 백업도 필수)
   http://gong6587.tistory.com/1284 참고함
   나중에 필요할지 모르니 이전 블로그를 스크롤캡쳐 몇장 떠놓고, 소스도 따로 저장해두면 요긴함
   사이드바 코드들과 각종 애드온들도 별도로 다 저장해두면 편하구요.
   
   
2. 최근글에 썸네일 주소변경
   http://markquery.com/community/faq_skeleton/505
   이미지 안나오는 문제가 있었는데 RSS를 부분공개가 아닌 전체공개를 해야됬고, 적용되는데 시간이 조금 걸린다고 함
   
   
3. 상단 navbar 삭제
   유용한 기능이긴 하나 보이는 화면을 조금이라도 더 확보하자라는 생각으로 없애봄.
   어차피 제 블로그는 들어와서 한 페이지를 몇초간 훅 보고 나가시는 분들이 절대 다수라...ㅜㅜ
   
   
4. 타이틀바 여백 조정
   http://mskjh.tistory.com/419 블로그 타이틀이 나오는 부분의 상하 여백이 많이 나오던것 수정
   
   
5. 사이드바쪽의 썸네일 나오는 최근글 삭제
   썸네일 나오는 최근글이 제목이 끝까지 다 나와서 좋기는 한데 로딩이 오래걸리는거 같아서 그냥 recent article (default)를 사용
   
   
6. 여백 줄임
   사이드바 위젯들 사이, 최근글의 리스트 사이, 타이틀바, 제목 부분등.. 
   여기저기 구석구석의 여백을 조금이라도 줄여봤습니다.
   
   
7. 카테고리 폴더 모양 변경 - http://markquery.com/community/help_desk/611 
   사이드바를 접기/펼치기로 해볼까 하다가, 그냥 카테고리 모양을 리스트 모양에서 폴더 모양으로만 변경
   
   
8. 이미지 중앙정렬 문제
   http://markquery.com/community/qna_skeleton/3054
   댓글참고해서 그냥 CSS에 넣어서 이미지가 왼쪽정렬 되는걸 가운데 정렬로 수정함
   
   
9. 기존에 설치했었던 구글애널리틱스/네이버 애널리틱스/구글번역 스크립트/구글 번역기 스크립트 추가함
   http://markquery.com/community/faq_tistory/497 ,  http://jaebok.tistory.com/89  참고
   
   
10. 글제목 옆에 있던 글자크기/폰트설정 부분을 삭제
    저 기능을 이용할 사람이 많지 않을거 같아서 일단 없애봄
    
    
11. 댓글의 날짜가 '수정/리플' 나오는 아랫줄에 별도로 표시되는것을 윗줄로 올림. 역시나 공간활용 및 절약 차원에서
    
    
12. 검색창이 처음엔 윗쪽 navbar에 있던것을 사이드바쪽으로 옮김
    http://markquery.com/community/faq_tistory/774
    주의할건 위쪽의 검색폼 코드는 삭제해야 한다고 함. 주석으로 되어있어도 안되는가봄
    
    
13. 사이드바 마우스 오버시 나오는 파란색계열의 색상을 연두색(녹색 or 풀색)계열로 변경
    무빙박스 스킨때부터 제 블로그는 연두색빛 계열로 가네요...ㅋㅋ
    
    http://www.colorhexa.com/  비슷한 계열의 색상중에서 원하는걸 선택하는데 유용한 사이트였음
    
    
14. 글의 제목 색상 짙은녹색으로 변경
    http://markquery.com/community/qna_skeleton/3995
    이부분은 소스보면서 정말 찾아헤맸던 부분이었는데...
    괜히 시간 버리지말고.. 마크쿼리 커뮤니티 게시판에서 일단 검색해보는게 최고!
    
    
15. 애드센스 설치함
    http://markquery.com/community/faq_skeleton/605
    레이아웃을 위해 데스크탑에선 예전과 같이 상단 2개로 하고, 모바일에서는 320*100 짜리 1개로 설정함
    글 하단에는 반응형 애드센스를 만들어서 붙여봤는데... 오~ 자동 조절되서 나오는군요.
    디바이스들 마다 애드센스 정책의 가이드라인에 걸릴것없게 잘 나오긴 하는데, 
    위와같은 방식이 구글 애드센스가 공식적으로 인정하는 부분인지는 잘 모르겠음
    
    
16. 줄간격을 약간 늘림
    http://markquery.com/community/qna_skeleton/1242
    
    
    
17. 하단에 footer 라이센스 부분의 여백을 조정 / 일부수정
    좀더 심플하고 간략하게 했으면 하나, 스킨을 무료로 쓰는 입장에서 마음대로 건드리면 안되는 부분이라서...
    카운터를 빼고, 방명록을 넣고, RSS주소를 피드버너로 함
    
    
18. 모바일 화면에서 특정 사이드바(링크/트랙백 등) 감추기
    http://jaebok.tistory.com/89  사이드바가 너무 길어지는 경향이 있어서...
    
    
19. 블로그 타이틀 폰트, 색상 및 여백 조정
    타이틀 폰트크기는 bootstrap.css 에서 수정해주는거였네요.
    
    
20. 일부 트랙백을 클릭했을시, 댓글쪽의 레이아웃이 다 틀어지던 문제가 있었는데, 관련한 주석부분 삭제해보니 잘됨
    
    
21. 사이드바의 link 카테고리를 이용해 '관리자'로 넘어갈수 있게함
    
    
22. 본문 가로폭 840 정도로 되있던것을 조금 줄이기위해 bootstrap 에서 전체 좌우폭이 1170으로 잡혀있는걸 100정도 줄임
    연계된 다른것들도 수정해야 할거 같은데 일단 문제가 보이면 해결하는쪽으로...
    
    
23. 카테고리명, 트랙백/댓글갯수, 댓글란... 등 영어로 되어있는 부분들 한글로 바꿈
    
    
24. 자잘한 수정 / 변경 
    타이틀 본문간 사이 :: 로 수정
    최근댓글 카테고리 출력부분 약간 수정
    본문폭 줄인후 사이드바 글자수 재조정 / 에디터 본문 폭 재설정
    
    
25. 트랙백 위치를 '트랙백:댓글 갯수' 위쪽으로 옮김
    트랙백이 달렸을시 내용은 아래쪽에 붙도록 놔두고, 트랙백 URL link 만 옮기고 싶었는데 잘 안되서 그냥 통째로 올림
    
    
26. 본문 이미지에 테두리 넣기
    테두리가 없는게 깔끔하긴 한데, 그러면 이미지와 글자가 구분이 안되는 경우가 가끔씩 있어서...
    
    
27. 방문했던 링크 색상 변경하기  http://zettaisya.tistory.com/3152
    참고> 흔히 쓰이는 색상 =  일반링크 link - 0000FF / 방문했던 링크는 자주색 visited - 800080
    

미해결

1. 여백 줄일수 있는 부분은 더 줄이고, 로딩속도 줄일수 있는 부분 찾기
2. 불필요한 코드 줄이기. 일단 되기만 하면 되는지라 코드들을 삭제하기보다 무조건 임시로 주석처리하고 그랬던 부분들 정리필요
3. 모바일에서 최근글의 글자 길이가 화면에 꽉차게 나왔으면 좋겠는데, PC용에 맞춰 설정한 그대로만 보이는듯
4. 댓글다는 부분의 텍스트 박스들 크기 줄이기
   
   
   
5. 모바일에서 제 블로그를 본 화면인데... 예를들어 하이퍼링크의 길이가 길면 레이아웃이 틀어지는 문제가 있네요. (단순하게 링크의 길이가 길어서는 아니고, 길이가 길면 다음줄로 내려가야 할텐데 그렇지 않아서 문제인듯)
   위쪽의 긴 URL을 짧은 URL로 변경했더니 가로폭이 많이 넓어졌죠. 완전 100%에 맞게 넓혀지지 않은건, 저 링크 말고 또다른 긴 URL 링크가 있어서이구요.
6. 모바일에서는 스크롤이 너무 길어지지 않도록 댓글을 닫는게 디폴트가 되었으면 좋겠네요. 혹은 최근 10개정도면 보인다거나... (가능할런지 모르겠네요)