SAVE THE DEVELOPERS <!> Upgrade IE 6 Now!

이 배너는 IE6 사용자에게만 보여집니다. 브라우저 업데이트로 보다 편리한 웹세상을 만나보세요!

«   2024/03   »
          1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31            

표지 style.css for whiteBoard

스킨 공개한지 2주 정도 지났습니다. 부족하고, 보잘껏 없는 스킨에 많은 분들의 관심과 칭찬(?)에 몸둘바를 모르겠습니다. 이 바닥에서는 이름만 말해도 알만한 유명 블로그에 걸리기도 하고.. 스킨이 저보다 더 출세했습니다. :) 사실 공개할때만 해도, 제 취향에나 맞지, 다른 분들 보시기엔 별 볼일 없을 거라 생각했었습니다. 그런데, 세상엔 제 취향과 비슷하신 분들도 알게 모르게 많은가 봅니다! (__)

아무튼, 텍스트큐브의 플러그인 중 하나인 커버페이지 혹은 표지(MT_Meta_RecentPS_Default) 플러그인 에서 사용하는 스타일시트를 간단히 만들어 봤습니다. (예정 업데이트에 적어 두었던 걸 하게 될 줄은 며느리도 몰랐는데~)

모든 블로그의 최근글 보기 플러그인

텍스트큐브 플러그인계의 대부 J.Parker 님의 '모든 블로그의 최근 글 보기' 플러그인 입니다. (아~ 이름이 참 길군요. 앞으로는 그냥 '표지' 라고 하지요.) 암튼, 텍스트큐브 확장패키지를 설치하신 분이라면, 기본으로 포함되어 있는 플러그인 입니다. 표지 플러그인을 활성화 하시고, 환경설정하고, 꾸미기 - 위젯 - 표지 위젯 에서 표지에 나타낼 것들을 설정합니다.

표지를 첫 페이지로 설정 체크

표지로의 접근은 http://블로그 주소/cover 입니다. 따로 접근할 링크를 만들어 두시거나, 표지 위젯 설정에서 표지를 블로그의 첫 화면으로 설정합니다 에 체크하면 블로그의 첫 페이지가 표지가 됩니다.

표지에서 사용할 수 있는 위젯을 제공하는 플러그인들은 텍스트큐브 표지 플러그인 페이지에서.. :)

whiteBoard coverPage style.css

표지 플러그인에서 다른 건 하나도 수정하지 않았습니다. 아마 하라고 해도 못할 겁니다. :)

포함된 파일은 두개세개로..

  • style.css 는 텍스트 큐브가 설치된 폴더/plugins/MT_Meta_RecentPS_Default 에 덮어 씌우시고.
  • tag.gif 이미지는 위 플러그인 이미지 폴더에 넣어 주시면 옥헤이~
  • 누락되었던 bg_coverPost.gif를 추가해서 다시 올려둡니다. tag.gif 와 함께 플러그인 이미지 폴더에 넣어주시면 됩니다.

약간 특별한 기능

CSS만을 이용해서 부린 약간의 기교(?)입니다. :) 이미 읽었던(방문했던) 기록이 있는 글은 회색 제목+visited 표시, 아직 읽은 적이 없는 글은 검정색 제목 + 노란 NEW 표시로 나타냅니다.

visited 와 new 예시 그림

visited 와 new 예시 그림

그저 a:link 와 a:visited 의 스타일을 다르게 적용한 것 뿐입니다. 때문에 사용하시는 브라우저의 캐시 정보에 따라 new 가 될 수도 visited 가 될 수도 있습니다. 브라우저 캐쉬를 모두 삭제하면 모두 new 가 되버리는 거죠.. :)

.coverpost h2 a:after {
    font-size: 10px;
    letter-spacing: 0;
    color: #fc0;
    content: " - NEW."; /* IE의 경우 IE8부터 이해 가능 */
}
.coverpost h2 a:visited:after {
    font-size: 10px;
    letter-spacing: 0;
    color: #888;
    content: " - Visited."; /* IE의 경우 IE8부터 이해 가능 */
}

물론 이것은 :after 라는 유사 클래스pseudo-classescontent: 라는 프로퍼티를 이해하지 못하는 못난이 브라우저(IE6 ~ IE7) 에서는 지원되지 않습니다. :(

기타

  • IE6 에서는... 모양은 똑같습니다. :)
  • 커버페이지에 넣을 수 있는 것들 중 오직 본문 글에 관한 디자인만 되어 있습니다. 다른 것들에 대한 디자인은 차차 생각해 보겠습니다만, 전 표지 페이지를 별로 좋아하지 않습니다.. :)

예제 페이지는 여기서 보실수 있습니다.

해마다 찾아오는 감기님이 또 찾아 오시려나 봅니다. "안녕~ 감기야~ 왔구나, 안 오는줄 알고 서운했잖아~" :)

Trackback

Trackback Address :: http://hi8ar.godohosting.com/oldlog/trackback/581

Comments

Go to write form
  1. Joseph 2008/11/15 07:56

    난...이 모든게 외계어로 들릴뿐이고, 그래서 하이바 옵하가 부러울 뿐이고...

    Ps. 환절기(?)이니만큼 감기 조심해야겠더군요. 늘 강건하시길~ 고치기 Reply

    • hi8ar~ 2008/11/15 23:49

      역쉬.. 은근한 개그 센스~! ;p
      건강이나 강건이나 똑같은 말인데.. 왠지 강건이라 뒤집어 적으니 건강보다 더더더더더더 건강해져야 할것 같은 느낌이에요~ 깔깔.. 그치만.. 감기.. 이젠 뭐 익숙한걸요. 감기따위.. 아니 친숙합니다. 해마다 찾아오는 오랜 벗.. 감기.. 겨울이 오고 있음을 알려 주려나 봐요~ 아~ 감기가 찾아오니 오히려 바짝 긴장되는게, 일이 더 잘 되는것도 같고~~ (감기님 덕에 횡설수설중.... @_@') 고치기

  2. 해맑은탱쟈 2008/11/15 13:01

    이건 텍스트큐브 사용자만 설치하는거죠?ㅎㅎ
    저는 티스토리 유저니깐 흐음~~

    근데 그거 때문인건 아닌거 같은데 더 이뻐졌네요?
    댓글 입력창도 더 이뻐지고~
    파일 다운로드 링크 걸린 곳도 그렇고......
    와...나날이 발전하는군요!! 고치기 Reply

    • hi8ar~ 2008/11/15 23:51

      넵. 아쉽지만, 티스토리에선 무용지물입죠. :)
      몇가지 스크립트도 공부해 보고, 더 예쁘게도 만들어 보고.. 뭐 그러고 있습니다. :) 고치기

  3. Fallen Angel 2008/11/18 03:34

    아 스킨교체의 욕구가 이전 모노크롬 800px 사용자입니다..ㅎ.ㅎ...
    본문 크기가 안맞아 티스토리에서 쓸려면 또 대대적인 공사가 필요할거 같군여...ㅡ.ㅡ;;;;
    하이바님 이건 본문을 750정도로 늘려서 사용할려면 배경 이미지와 본문 width만 750으로 바꾸면 될란가요..
    모노크롬에서 이걸로 바꾸고 싶은 욕구가... 고치기 Reply

    • hi8ar~ 2008/11/18 13:42

      옙.. 기억하고 있습니다.^^
      모노크롬은 이제 기억의 저편에 묻혀진 스킨입죠. 여기저기 부족한 부분이 많은...
      bg_header.gif bg_content.gif bg_contentTop.gif bg_footer.gif bg_h3.gif 이정도의 이미지를 수정하셔야 할것 같습니다.
      layout.css 의 width와 position들을 적절히 수정하시면 750px 로 사용하시는 것도 불가능한 것만은 아닙니다.. :) 고치기

    • Fallen Angel 2008/11/19 01:38

      이미지 수정해서 스킨 바꿨네요...^^. 모노크롬도 좋앗는데...
      하이바스킨 애용자가 될거같군요...감기조심하세요. 고치기

  4. 민노씨 2008/11/18 06:27

    표지에 대해선 큰 관심을 갖고 있지 못했는데, 이 글을 읽으니 한번 설정해봐야겠다는 생각이 드네요.
    늘 고맙습니다. : ) 고치기 Reply

    • hi8ar~ 2008/11/18 13:43

      네. 저 역시 표지엔 별 관심이 없었습니다. 블로그에 표지 라니.. 좀 어울리는 조합은 아닌것 같아서요. :) 고치기

    • 민노씨 2008/11/18 16:03

      다행(?)입니다.
      저도 역시 다시 그런 판단을 하게 되었거든요. ㅎㅎ
      새벽에 시도하려고 알려주신 링크타고 좀 살펴보다 급포기해버렸다능...;;; 고치기

  5. 사과벌뢰 2008/11/19 03:03

    제 테스트 블로그도 이 스킨으로 바꿧어욤 너무 이뿐 스킨 공개 해주셔서 너무 감사해욤 알라븅 고치기 Reply

    • hi8ar~ 2008/11/19 16:59

      아.. 알라..븅... *_* 사랑해 주시는 겁니..까? 발그레... :p 고치기

    • 사과벌뢰 2008/11/19 20:53

      이룬 예뿐 스킨 공개해주셧는데 당연히 사랑해드려야죵 오호호호 사과가 포토샵 브로쉬까지 다운받았기에 한번 만들어 볼려다가 css 이런걸 너무 몰라서 그냥 포기하구 있었거든요 고치기

  6. 사과벌뢰 2008/11/19 21:09

    움 하이바루님앙 음악이 자꾸 삑사리가 나욤 ㅠㅠ
    현재 플래쉬9버전을 쓰고있는데 음악이 삑사리 나길래 10버전으로 다시 깔았거든요 ㅠㅠ 어뜨케욤 왜 음악이 자꾸 삑사리가 날까욤??? 고치기 Reply

  7. LieBe 2008/11/19 23:19

    어헉........테터데스크는 너무 맘에 안드는데.....세부 설정이 아예 접근조차 불가능해서....
    이럴땐 택큐가 너무 부럽네요...

    저도 예전엔 테터툴즈 유저였는데 어쩌다 티스토리에 가 있는거지...

    아....호스팅 신경 안쓰는구나.....OTL

    덧 : 나날이 럭셔리해지십니다......최고세요.....lol 고치기 Reply

    • hi8ar~ 2008/11/20 17:49

      뭐 태터데스크가 더 좋은점도 있는 것 같습니다. !important 를 주면 태터데스크 영역도 전혀 건드릴수 없는 건 아닐겁니다.. :) 다만 IE6 에서는 소용 없을 지도.... 고치기

  8. 비밀방문자 2008/11/20 16:02

    관리자만 볼 수 있는 댓글입니다. 고치기 Reply

  9. 하트비트 2008/11/21 09:51

    궁금한 점이 있어서 이렇게 댓글을 남깁니다~
    스킨을 적용하였는데요...
    이상하게 헤더부분이 막혀서 나오네요 ㅠㅠ투명하게 나와야 하는데.. ㅠㅠ
    도와주세요! 고치기 Reply

    • hi8ar~ 2008/11/21 19:30

      죄송하지만, 헤더부분이 막혀서 나오다는 말씀이 무슨 말씀이신지 모르겠습니다. 현재 적용되어 있지 않아서 블로그에 방문해 봐도 모르겠습니다. 고치기

  10. 미프 2008/12/04 04:23

    스킨을 늘 잘 사용하고 있습니다.
    감사합니다.
    첨부파일에 bg_coverPost.gif 이 들어 있지 않는 것 같습니다. ^^ 고치기 Reply

    • hi8ar~ 2008/12/04 16:08

      앗! 정말 그렇군요. 게다가 mt 를 mp로 적었네요..@_@'' 더해서 다시 올려두었습니다. 알려주셔서 감사합니다! :) 고치기

  11. 모꼬지 2009/01/18 10:02

    안녕하세요?
    뒤늦게 whiteBoard 스킨을 발견해서 적용해 보았습니다.
    표지 style.css도 아주 맘에 듭니다.
    그런데 제가 사이드바를 넓게 쓰는 걸 좋아해서 '사이드바 250px 변신 킷'으로 250px로 늘렸더니 그렇게 하면 이 표지 style.css가 적용되지 않더군요.
    소스 들여다 보기 귀찮아서 ^^;; 만드신 분께 문의합니다. 고치기 Reply

    • hi8ar~ 2009/01/18 21:07

      글쎄요. 왜 적용되지 않을까요? 딱히 문제가 될만한 부분이 없을것 같습니다. 아예 적용이 안되는 건가요? 아니면, 레이아웃이 틀어진다는 건가요? 저 역시 소스 들여다 보기 귀찮아서 ^^;; 고치기

What's on your mind?

댓글 입력 폼

:) ;) :D :p 8D 8| 8) :( :o --;) ㅡㅡ;)