텍큐닷컴 간담회에서 발표했던 대로 스킨 편집기의 봉인이 오늘 풀렸다. 아침에 블로그에 들어와보니 난 아무 것도 안 했는데 레이아웃이 좀 깨져있고 사이드바의 프로필 박스가 좀 어질러져 있길래 뭔가 수상한 사건이 벌어졌다는 것을 눈치채고, 단숨에 텍큐닷컴 공식 블로그로 달려갔더니 역시나 스킨 편집의 포장 테이프가 깔끔하게 뜯어져있었다.

아니 그런데!

원래 있던 스킨도 바뀐 건가? (내가 이런 단어를 꺼내기엔 전문적인 식견이 부족한데도) 이론상으로는 내 탐욕대로 스킨에 달려들어 갈기갈기 찢을 수 있도록 유리벽이 사라지거나 말거나, 원래 꼼수로 덧입혔던 스타일을 스킨의 style.css에 그대로 이식시키면 이전과 마찬가지로 나와야 하는데(아닌...가?), 그게 아니라 여기저기 삐뚤빼뚤 어긋나고 엉뚱한 디자인이 예상치도 못하게 튀어나와 간담을 서늘하게 한 다음(절대 2등신 미니 건담을 얼음 속에 넣어 얼린 빙하기 짤방따윈 넣지 않을 거임 ㄲㄲㄲ) 자길 없애보라며 보란듯이 나를 조롱해서, 다시 스킨을 양념게장마냥 통째로 아삭아삭 씹어 발라내야할 처지가 되었다. ㅠㅠ
아놔... 귀찮은데... -_-;;; 도대체 클래스 이름을 왜 바꿔 놓은 거야... ㅡㅡ;;; 아아악!!!

그리고 새로운 위젯 편집 기능은 html 코드 위젯의 내용이 보이지 않아 불편한 감이 있는데, 각 위젯마다 제목을 붙일 수가 있긴 하지만 일단 모든 html 코드 위젯을 열어보고 안에 무슨 소스가 들어있는지 메모딱지를 붙이지 않으면 두고두고 뭐가 뭔지 헷갈려 털썩 주저앉게 생겼다. (알 수 없는 이유로 lunamoth님이 흐뭇한 미소를 짓는 것 같은 오싹한 느낌;;;)
텍큐닷컴이 지향하는 시장 포지셔닝을 위한 야삼찬 프로젝트 쉬운 편집 기능은 무지무지 넓은 우주에서 두 철 원자가 부딪혀 충돌할 확률만큼이나 나와는 상관 없기 때문에 이번에도 시크하게 생략. (응?) 하지만 네이버나 티스토리등의 사용자를 홀릴 수 있는 멋진 기능임에는 틀림 없다(라고 넘어가자 ㅋ).
귀차니즘, 스킨 편집, 텍스트큐브닷컴
  1. BlogIcon Bardisch 2009.04.23 18:28 신고      

    어라...?
    원래대로 나와야되는거 아닌가요?
    스킨이 바뀌지 않은 이상..?

    • BlogIcon 궁시렁 2009.04.23 19:02 신고      

      그러게요. 오늘밤 골머리 좀 싸매야겠어요 ㅡㅡㅋ
      좀 있음 중간고사죠? 셤 잘 보세요 ㅋㅋㅋ

  2. BlogIcon 띠용 2009.04.23 19:43 신고      

    스킨이 좀 이상하긴 해요;;

  3. BlogIcon 하늘바라기 2009.04.24 01:43 신고      

    클래스 이름을 바꾼 이유는 왤까요?

    • BlogIcon 궁시렁 2009.04.24 09:41 신고      

      겐도사마의 글을 보니 뭔가 우여곡절이 많았던듯 합니다.
      개발 팀 내부에서 많은 고민을 했겠죠. 저같은 초급 사용자는 그저 골머리 싸매고 쓰는 수밖에 없지 않겠어요? 굽신굽신 ㅠㅠ

  4. BlogIcon dudtn 2009.04.24 22:37 신고      

    지금은 잘 나오는 걸 보니 다 가다듬으셨나봅니다.^^

    쉬운편집 기능은,,,, 티스토리 스킨위자드랑 비슷한 것 같기도 하네요,,, 신개념의 무언가가 나올 것 같았는데,,,,

    여하튼 가장 큰게 뻥 터졌으니 텍큐닷컴 다시 생각해봐야겠습니다. ㅎㅎㅎㅎ

    • BlogIcon 궁시렁 2009.04.24 23:31 신고      

      골치 좀 썩었습니다 ㅡㅡㅋ
      간담회에서 본 쉬운편집 기능은 티스토리보다 뭔가 좀 더 복잡해 보였는데... 막판까지 소스를 마구 갈아 엎으며 고심하셨더라고요. (전 안 쓸 기능이라... ㅋㅋㅋ)
      dudtn님도 어여 컴백하세요- 텍큐닷컴 알바도 아닌데 이탈한 사용자들 다시 꼬시고 있어요. ㅋㅋㅋ

  5. BlogIcon 1월의가면 2009.04.25 00:36 신고      

    골치좀 아프시겠어요^^;;
    전 쉬운편집기능이 은근히 괜찮더군요~ ㅎㅎ

    • BlogIcon 궁시렁 2009.04.25 14:16 신고      

      머리 싸맬 필요 없이 간단히 뚝딱 만들어 내기엔 좋아 보여요.

  6. BlogIcon ShellingFord 2009.04.25 01:09 신고      

    뭔가 만들다가 지금은 거의 포기 상태...나중에 잘 만드시는 분 있으면 긁어(X) 참고해보려고요.....굽신굽신...;;;;

    • BlogIcon 궁시렁 2009.04.25 14:22 신고      

      터미널(이라고 쓰고 개발자 혹은 긱오덕이라고 읽는다) 스킨 쓰시는 분들 왜 이렇게 많나요 ㅋㅋㅋ
      빨리 테이블에서 벗어나 디비전의 세계로 들어오세요. ㅅㅅ

  7. BlogIcon Lou Rinser 2009.04.25 09:13 신고      

    드디어....드디어 열린 겁니까!!! -▽-
    이건 정말 엄청난 유혹의 손길이에요. 아내의 유혹이 문제가 아니에요ㅋㅋㅋ

    • BlogIcon 궁시렁 2009.04.25 14:25 신고      

      린저님을 덮치는 마성의 구느님... 아니 텍큐닷컴! ㅋ_ㅋ
      아내의 유혹 끝날 즈음엔 이미 넘어와 계신 거 아닙니까? ㅎㅎㅎ

  8. BlogIcon odlinuf 2009.04.25 10:05 신고      

    고생 좀 하셨는지 지금은 잘 보이네요. 암만 그래도 그다지 이곳으로 오고싶은 마음은...글쎄요..... ㅋㅋ

    • BlogIcon 궁시렁 2009.04.25 14:32 신고      

      수리는 대충 끝났고 이제 눈에 잘 안 띄는 자잘한 곳만 손보면 됩니다.
      차마 오드리님께까지 티스토리를 버리고 오시라고 하지는 않을 게요. ㅎㅎㅎ 그런데 텍큐닷컴의 서버가 훨-씬 좋다는 거- (응? ㅋㅋ)

  9. BlogIcon 아카사 2009.04.25 17:38 신고      

    네이버 블로그의 UI보다 많이 불편하던데요?(.....)
    디자인만 좀 별로면 상관 없겠는데,, 리모콘으로 생각한것 만큼의 자유로운 편집이 안되더군요;; 자유도는 거의 네이버의 리모콘과 거의 똑같은 수준이에요. 게다가 스킨저장은 왜 또 안되는지;;; 좀 많이 실망(.....)

    • BlogIcon 궁시렁 2009.04.26 02:42 신고      

      그런가요? 전 어차피 쓰지 않을 기능이라 자세히 살펴보지는 않았거든요. 쿨럭;;;

  10. BlogIcon Mitenisaki 2009.05.20 01:34 신고      

    테터툴즈 블로그만도 접한지 몇년 됬는데 개인적으로 포털이 제공하는 블로그서비스보다는
    부가기능이 있어 좋더군요. 어느정도 CSS/HTML편집 능력이 있다면... 자기 맛대로 구성할수 있다는게
    좋은거죠.

    간담회 가고 싶었는데 저도 학생인지라 여유가 없으니....ㅠㅠ
    쿠나님 말로는 아직도 제한~ ㅠ_ㅠ(?)

    • BlogIcon 궁시렁 2009.05.24 11:08 신고      

      설치형만크의 자유도는 누릴 수 없죠. 기업의 내부 정책까지 사용자가 감놔라 대추놔라 할 수도 없고.

댓글을 쓰고 무한 불가능확률 추진기 작동 버튼을 누르면 불안정한 시공간을 뚫고 댓글이 어딘가에 등록됩니다.
텍스트큐브닷컴을 포함한 TNC가 통째로 구글코리아에 인수되면서 수많은(사실 세어보면 얼마 많지는 않음) 사용자들이 앞으로 텍큐닷컴이 어떤 모습으로 바뀔지 알 수 없어 공황장애 및 다른 서비스로 이탈 내지는 이거 뭐야... 무서워... 라는 반응을 보이는 가운데 지금 이런 내용을 알려봤자 앞으로 텍큐닷컴이 어떻게 바뀔지 알 수 없으므로 며칠 지나지 않아 아무 소용 없는 게 되버릴지도 모르는 정보를 하나 소개하려고 합니다.

ZDNet에 기사가 떴다 -ㅁ-;;;
구글코리아의 정김경숙 상무는 "빠른 시일 내 구글 연구센터에 TNC 엔지니어들을 앉힐 것이다. TNC 인력 흡수 목적은 어디까지나 검색 연구 능력 강화에 있을 뿐 콘텐츠 늘리기와는 큰 연관이 없다. TNC로 인해 블로그 사업을 새로 시작할 지 여부도 아직 정하지 않았다"고 말했다.
쳇... 이게 뭐야... 역시 이 궁시렁은 쓸모 없는 헛삽질이 되는 건가... OTL
아니, 그것보다 텍큐닷컴이 블로그스팟닷컴 꼴이 나게 생겼잖아! (버럭!)

지금껏 텍큐닷컴이 폐쇄시범단계(이게 뭐야... 그냥 CBT)를 거치면서 받은 제일 큰 불평불만은 "스킨은 도대체 언제 편집할 수 있나요?"일텐데, 일단 텍큐닷컴의 포지셔닝이 "일반인들도 부담없이 쓸 수 있는 강력한 블로그"인 만큼(여기서 '일반인'이란 스스로를 고급 사용자라고 여기지 않는 모든 사람을 지칭하는 것처럼 보이는데, 어떻게 보면 연예인/일반인 류의 어처구니 없는 흑백논리에 휩싸일 여지가 있다), CBT에서는 아직 스킨을 떡반죽 주무르듯 내 마음대로 바꿀 수 있는 단계는 아닙니다.

구조와 디자인의 (철저한) 분리를 추구하는 트렌드(웹표준과 연관이 있나? 아님 말고- 응?)에 따라 티스토리나 설치형 텍스트큐브는 html과 css가 칼로 두부 썰듯 나뉘어져 있습니다. 텍큐닷컴 역시 블로그의 뼈대를 이루는 skin.html은 아직 사용자가 톱질을 못 하지만, 블로그에 옷을 입히는 css 파일은 html 코드 위젯으로 대체가 가능하기 때문에, 어느 정도까지는 (이 블로그처럼/저는 css에 능수능란한 개발자 레벨이 아니지만) 내 입맛대로 블로그의 디자인을 바꿀 수 있어요.

이 방법은 (제가 보기로는) 여담님이 처음 뚫은 루트입니다.

먼저 HTML 코드 위젯을 추가합니다. (이미 쓰고 있더라도 몇 개든 추가할 수 있음)


실제로는 잘 보이지도 않는 회색 글자로 써집니다.

각 위젯은 div으로 싸여있기 때문에, 먼저 이 div를 닫아줍니다.
그리고 이 뒤로 적용할 css 내용을 집어 넣으면 끝!나는, 사실 팁이랄 것도 없이 굉장히 단순한 방법이죠.

이 얍삽(?)한 코드가 먹히는 이유는 간단합니다. 각 스킨은 link rel을 통해 css 파일을 읽어서 디자인을 뿌리는데, css의 내용을 이렇게 위젯으로 변장한 상태로 들여보내면 이 내용이 html 본문에 들어가서 따로 css 파일로 읽어들인 내용은 적용 순서에서 뒤로 밀리기 때문입니다. 그렇기 때문에 일단 위젯에 집어넣은 css를 적용하고 나면, 나머지는 해당 스킨이 지정한 css 파일의 내용으로 블로그 디자인이 꾸며집니다.
하지만 문제는 어떻게 css를 만들어 넣느냐- 겠죠?

여기서 몇가지 부류로 나눌 수 있습니다.
  1. 뭐야... 무슨 소린지 도무지 모르겠어... 난 그냥 기본 스킨만 써도 돼.
    -> 그냥 '뒤로'를 누르세요.
  2. 뭐야... 무슨 소린지 도무지 모르겠어... 바꾸고 싶긴 한데 뭘 알아야 바꾸지...
    -> css를 굴리는 법을 배우지 않으시려면 역시 '뒤로'를 누르세요.
  3. 누군가 때가 되면 멋진 스킨을 올려 주겠지. 난 그냥 기다릴래.
    -> 티스토리로 이주하시거나 '뒤로'를 누르세요.
  4. 그런데 그 각 스킨의 css를 어떻게 바꿔?
    -> 지금 알려드린대로 해 보세요.
  5. 아, 그렇군. 이제 네 도움따윈 필요 없다. 내가 알아서 해 보지.
    -> 네, 그러세요. (댓글로 자랑질 하셔도 괜찮습니다 ㄲ)

일단 내 블로그의 스킨이 불러오는 css 파일을 잡아야 합니다. 소스 보기를 통해 css 파일의 경로를 훔쳐오세요.
불러오는 css 파일은 4개입니다. 우리가 바꿀 것은 위에서 6번째 줄에 있습니다. 제 경우에는 http://fs.textcube.com/service/blog/skin/TC_SimpleGray/style.css 입니다. 스킨별로 진하게 된 부분의 이름이 다르겠죠? 이 파일을 저장(그냥 브라우저에서 보셔도 뭐라고 하는 사람은 없어요)합니다.
뭐라고 뭐라고 스타일이 좌라락 나열되어 있습니다. 각각 스타일이 어디에 어떤 이름으로 지정되어 있는지 알기 위해서 스킨의 html 파일을 따로 저장해서 대조하거나, 다시 블로그의 소스보기를 이용해 찾을 수 있습니다. html 파일의 주소는 물론 style.css 대신에 skin.html을 넣으면 됩니다.

AcroEdit 같은 편집기를 이용해(위젯의 설정 대화창은 너무 작은데다가 글씨도 보일락 말락 하는 어정쩡한 회색이잖아요. (텍큐닷컴은 html을 직접 수정하는 것을 싫어하는 모양입니다. 에디터도 제가 건의하기 전까지는 글자가 죄다 어정쩡한 회색으로 나와서 도무지 뭐가 어디에 있는지 분간할 수 없었어요) 메모장을 이용해도 상관은 없지만, 계속 내용을 바꾸고 만일을 위해 저장해 가며 수정에 수정을 거듭할테니 이왕이면 편하게 가죠-) css 파일의 내용을 바꾸고 싶은 대로 새로 만들어서 복사한 다음 html 위젯의 콩알만한 대화창에 붙여 넣고 저장하면 css 바꿔치기 완료! 중간에 뭔가 잘못되어 블로그가 뒤틀렸다면 위젯을 제거만 하면 원상복귀!(조금 무책임함)

네, 단순 노동입니다. 그래서 스킨을 만드시는 분들은 굉장한 시간과 정성을 투자해 스킨 하나를 토해내는 겁니다. 우리는 그 노력의 결과물을 낼름 따먹기만 하죠. 저는 이미 설치형 텍스트큐브에서 쓰고 있는 디자인과 컬러셋을 비슷하게 적용했기 때문에 따로 시간이 들지는 않았습니다. 하지만 html의 구조와 스타일을 지정하는 이름이 다른 만큼 css와 html을 번갈아가며 내가 적용하고 싶은 스타일이 어느 이름으로 되어 있는지 찾는 데 시간이 좀 걸렸어요.

여기까지 읽으셨다면 지금껏 스타일을 바꾸고 싶어 손이 근질근질 하셨던 분일테니 css 강좌는 따로 안 하겠습니다. (사실 그럴 처지도 안 됨 ㅋ_ㅋ) 검색해 보시면 강좌는 많아요.
그래도 혹시나 이러저러한 걸 바꾸고 싶은데 그게 어디 있는지 잘 모르겠으니 알려줄테냐? 같은 댓글이 달린다면(설레발 치기는... 이런 글에 무플 안습!) 제가 아는 한도 안에서 성의껏(?) 답댓글 달게요.


css, 스킨 편집, 텍스트큐브닷컴
  1. BlogIcon 두아쓰 2008.09.16 10:23 신고      

    멋지네요;;

  2. BlogIcon hardboil 2008.09.16 15:20 신고      

    이런 방법이..!

  3. BlogIcon 띠용 2008.09.16 20:04 신고      

    이런 해킹 방법이 있었군요! 디게 신기하긴 해요.ㅋ

    • BlogIcon 궁시렁 2008.09.16 20:49 신고      

      하지만 이제 쓸 기회가 사라지게 생겼네요. ㅠㅠ

  4. BlogIcon krang 2008.09.16 20:23 신고      

    구글이 텍스트큐브를 버리기야 하겠습니까마는
    정 서비스가 형편 아우편이 없다 싶으시면
    언제든지 말씀하세요. 티스토리 초대장 바로 쏴드립니다. :) ㅎㅎ
    완벽 포장이사 정리정돈 서비스~ㅎ

    • BlogIcon 궁시렁 2008.09.16 20:53 신고      

      블로그스팟처럼 버리지도 챙기지도 않는 어정쩡한 포지셔닝에 처박아버릴 것 같은 의구심이 들어요. ㅠ_ㅠ
      요즘 티스토리에 글을 5개 정도 쌓아두고 찔끔찔끔 고치다가 다 쓰고 나면 여기로 옮기고 있어요. 새 관리자모드 생기고 나서 스킨도 여기랑 비슷하게 미리 바꿔놓았습니다. ㅋㅋㅋ
      언제든 짐싸서 이사갈 수 있으니 데이터 호환성은 이래서 중요하지요-

  5. BlogIcon 쿠나 2008.09.17 20:20 신고      

    헛. 뜯으셨던 거군요! 어쩐지 그 많은 css 명칭을 알고 있었던 것들이 수상했어! ㅋ

    어쨌거나 대단하십니다. 굿!

  6. BlogIcon 알렉스 2008.09.19 23:02 신고      

    이해가 안되니 <뒤로> 버튼을 눌러야 하지만..ㅠㅠ 왠지 해보고 싶네요 감사합니다..:)

  7. BlogIcon 아카사 2008.12.08 00:26 신고      

    CSS요? 그거 먹는건가요?
    라는 상태에서 님 블로그 스킨 참고하면서 어떻게 만들기는 했었는데,, 어떻게 만들었는지 기억이 안나서 못써먹겠네요....-_-;;

    도대체 어디에 뭐가 있는지 모르겠습니다....

    강좌좀 열어주시면 안되겠습니까;; 아니면,, 주석이라도(......)

    • BlogIcon 궁시렁 2008.12.08 03:47 신고      

      강좌 쓸만한 시간(및 초보자들도 쉽게 이해할 수 있게 조분조분 설명하는 능력)은 없네요;;;
      본문 글자 색깔을 바꾸려면 body {color:#16진수색깔코드;} 를 넣으세요. (참고로 이 블로그의 본문 글자 색깔은 #caddf0 고요)

  8. BlogIcon BLUE'nLIVE 2008.12.20 09:05 신고      

    그저 감사드릴 뿐입니다.
    한번 좀 고민해봐야겠네요. ^^;;

    • BlogIcon 궁시렁 2008.12.20 10:52 신고      

      http://www.webmini.net/420
      여기에도 친절하게 설명이 되어 있네요.

  9. BlogIcon Bardisch 2009.02.26 12:14 신고      

    정보 감사~
    삽질의 부활인가..;;

    • BlogIcon 궁시렁 2009.02.26 21:47 신고      

      파이어폭스 부가기능중에 삽질에 도움이 될 만한 게 있는데... 이름이 뭔지 잊어버렸네요. ㅠㅠ

  10. BlogIcon Kimhojung43200115 2010.05.02 19:06 신고      

    성지순례 왔습니다;;;. 정확하게 예측하셨군요 -_-...

댓글을 쓰고 무한 불가능확률 추진기 작동 버튼을 누르면 불안정한 시공간을 뚫고 댓글이 어딘가에 등록됩니다.
1