생일 선물 받았네요 ㅋㅋ 하루땡겨서 =ㅅ=생일 선물 받았네요 ㅋㅋ 하루땡겨서 =ㅅ=
Posted at 2010. 5. 18. 16:38 | Posted in 잡다한 이야기/하고싶은이야기생일 미리 축하드려요 ㅊㅋㅊㅋㅊㅋ~ 워낙 포스팅거리가 없다보니.. 하루 먼저 드립니다 ㅋㅋ
degi 님
주로 웹 관련 포스팅을 하시는 분입니다.
To degi 님
생일 진심으로 축하드려요 ㅎㅎ
그나저나 제가 거지인지라 이런 것밖에 선물을 못드리네요 죄송할 따름 꾸벅..
앞으로도 좋은 인연 계속해서 만들어 나가요 ^^
그보다 이 케릭터 누구지..
위는 우시오님 블로그에서 그냥 다 뺴온거라능 ㅇㅅㅇ...
뭐........ 원문까지 다 빼온건 그냥 ㅋㅋㅋ 귀차니즘이랄카?? ㅋㅋ
우시오닝 감사합니다 ㅋㅋ
확인시간 약 3시경으로 추정하며
12시경에는 자고 있었음을 밝히는 바입니다.
뭐 하이튼간에 생일선물로 요런거 받아보긴 처음이네요 ㅎㅎ
'잡다한 이야기 > 하고싶은이야기' 카테고리의 다른 글
난 범죄자란 소린가?! (26) | 2010.05.23 |
---|---|
체이티님 마히로님 감사합니다 ㅎㅎ (생일 선물 감사요~) (17) | 2010.05.19 |
지금까지 보았던 애니 목록(추가 수정중 10.5.18) (17) | 2010.05.18 |
숙제중인 뻘뻘뻘뻘뻘.... 도와주실분 ㅠㅠ... (22) | 2010.05.11 |
시험 끝났습니다 ㅠㅠ... (24) | 2010.05.01 |
블로그 본문에 트위터 RT 버튼 삽입하기블로그 본문에 트위터 RT 버튼 삽입하기
Posted at 2010. 5. 18. 11:37 | Posted in 저장용/티스토리 설정제 글들이 뭐 그닥 유익하지는 않지만..
그래도 RT(retweet) 해줬으면 하는 바램이 없지는 않아요..ㅎㅎ
그래서 오른쪽에 있는 저 녀석을 삽입해봤어요..
RT를 유도하는 버튼은 Tweetmeme, Backtype 크게 2가지 종류가 있어요..
jwmx님의 블로그에 그 차이점은 잘 설명이 되어있구요~
물론 이쁘면 좋겠지만..그래도 다른 분들이 RT하기 편했음 해서 전 Backtype을 선택했어요^^
http://www.backtype.com 에서는 트위터에 대한 여러 위젯을 지원하고 있구요..
아래 이미지처럼 본인 블로그의 URL을 검색하면..
이렇게 블로그의 글이 얼마나 트위터에 옮겨졌는지 나온답니다
(RT 모두 감사드려요^^)
이번 포스팅에서는 몇가지 위젯 중에서 RT버튼 활용하는 방법을 알려드릴게요..
기본 소스는 http://www.backtype.com/widgets/tweetcount 에서 제공됩니다..!
|
이 소스는 말그대로 기본소스여서 원하시는 블로그에 맞게 수정해주셔야해요~
또한 본인 트윗 아이디로 RT가 되게끔 수정해주셔야하구요^^
▶ 수정 <table align="right" border="0" cellpadding="0" cellpacing="0"><te><td> <!-- RT버튼을 본문 글 안에 정렬 / left or right 선택 --> <script type="text/javascript"> tweetcount_url = 'http://annt.co.kr[$$_article_rep_link_##]'; <!-- 본인 블로그 주소로 변경 / $을 #로 바꿔서 적용 --> tweetcount_title = 'Tweetcount Widget'; tweetcount_src = 'RT @thewinii:'; <!-- 본인 트윗 아이디 --> tweetcount_via = false; tweetcount_links = true; tweetcount_size = 'small'; tweetcount_background = 'FFFFFF'; tweetcount_border = 'CCCCCC'; tweetcount_api_key = '5c3bba3f5d77a46a13453091e36dc1cde4335e9299a1edeeaa3c31d193b33fda'; <!-- 삭제 --> </script> <script type="text/javascript" src="http://widgets.backtype.com/tweetcount.js"></script> </td></tr></table> |
이 소스를
<div class="article">과 </div> 사이에 삽입해주면 끝!!
색상은 원하시는대로 바꿔주세요..저는 기본제공되는 색상이 맘에 들어서 그냥 사용할래요~
도움이 많이 되셨다면 본문 상단 오른쪽에 RT 한번 눌러주세요^^ㅎㅎ
'저장용 > 티스토리 설정' 카테고리의 다른 글
티스토리에서 음악 주소 대량으로 가져오는 쉬운 방법 (2) | 2011.06.28 |
---|---|
티스토리에서 음악 업로드 + 주소 알아내는 2가지 방법 (0) | 2011.06.28 |
라이트박스 테스트 뷁 (4) | 2011.05.28 |
jwplayer 설치 및 사용하기 (0) | 2010.07.19 |
다음 뷰 애드 (view AD) 위치를 내 마음대로 옮겨보자 (0) | 2010.07.09 |
지금까지 보았던 애니 목록(추가 수정중 10.5.18)지금까지 보았던 애니 목록(추가 수정중 10.5.18)
Posted at 2010. 5. 18. 11:22 | Posted in 잡다한 이야기/하고싶은이야기#
B
E
G
- GO! GO! 다섯쌍둥이 완료
- GTO 완료
T
W
- working 7화
가
- 가난 자매 이야기 3화
- 건담 UC 1화
- 건담더블오 세컨드시즌 완료
- 공의 경계 제6장 망각녹음 완료
- 공중그네 5화
- 광란 가족 일기 완료
- 괭이갈매기 울적에 7화
- 괴짜가족 완료
- 근육맨 2세 완료
- 꾸러기 수비대 완료
나
- 나루토 포기
- 나츠메 우인장 1기 완료
- 나츠메 우인장 2기 완료
- 날아라 슈퍼보드 완료
- 냥코이 완료
- 노기자카 하루카의 비밀 완료
- 노기자카 하루카의 비밀 퓨어레차♪ 완료
- 뇨룡 츠루야상 완료
- 늑대와 향신료 1기 완료
- 늑대와 향신료 2기 완료
- 니노미야군에게 애도를 완료
다
- 다카포 완료
- 다카포 S.S 완료
- 다카포2 완료
- 다카포2 S.S 완료
- 닥터 슬럼프 완료
- 대니팬텀 완료
- 도라미&도라에몽즈 2112년 도라에몽 탄생 완료
- 도라미&도라에몽즈 로봇학교의 일곱가지 수수께끼 완료
- 도라에몽 1기 (국내 더빙) 완료
- 도라에몽 2기 (국내 더빙) 완료
- 도라에몽 3기 (국내 더빙) 완료
- 도라에몽 4기 (국내 더빙) 완료
- 도라에몽 5기 (국내 더빙) 완료
- 도라에몽 노비타와 로봇왕국 완료
- 도라에몽 노비타와 은하초특급 완료
- 도라에몽 노비타와 초록의 거인전 완료
- 도라에몽 노비타의 공룡 완료
- 도라에몽 노비타의 도라비안나이트 완료
- 도라에몽 노비타의 마계대모험 완료
- 도라에몽 노비타의 신 마계대모험 ~7인의 마법사~ 완료
- 도라에몽 노비타의 우주소전쟁 완료
- 도라에몽 노비타의 우주표류기 완료
- 도라에몽 노비타의 태엽도시 모험기 완료
- 도쿄 매그니튜드 8.0 완료
- 드래곤볼 완료
- 드래곤볼Z 완료
- 디지몬 어드벤쳐 완료
- 디지몬 어드벤쳐 02 극장판 - 디아블로몬의 역습 완료
- 디지몬 어드벤쳐 02 극장판 - 디지몬 허리케인 상륙 초절진화! 황금의 디지멘탈 완료
- 디지몬 어드벤쳐 극장판 - 우리들의 워 게임 완료
- 디지몬 테이머즈 완료
- 디지몬 테이머즈 극장판 - 모험자들의 싸움 완료
- 디지몬 테이머즈 극장판 - 폭주 디지몬 특급 완료
- 디지몬 프론티어 완료
- 디지몬 프론티어 극장판 - 고대 디지몬 부활 완료
- 디지캐럿 포기
- 디지캐럿 뇨 포기
- 따끈따끈 베이커리 완료
- 딸기 마시마로 완료
라
- 란마 1/2 완료
- 러키 스타 완료
- 레디x바토 3화
- 레이브 완료
- 레터비 완료
- 로봇수사대 K-캅스 완료
- 로젠 메이든 완료
- 로젠메이든 2기 트로이먼트 완료
- 로젠메이든 3기 오베르튜레 완료
- 록맨 에그제 완료
- 록맨 에그제 스트림 완료
- 록맨 에그제 엑세스 완료
마
- 마다가스카의 펭귄 완료
- 마모루군에게 여신의 축복을! 완료
- 마법진 구루구루 완료
- 마크로스 프론티어 완료
- 만월을 찾아서(滿月をさがして) 완료
- 망가지기 시작한 오르골 1화
- 모노노케 히메 완료
- 모에땅 완료
- 몬타나존스 완료
- 못말리는 비버형제 완료
- 문학소녀 - 오늘의 간식 ~첫사랑~ 완료
- 므네모슈네의 딸들 완료
- 미나미가 완료
- 미나미가 ~어서 와~ 완료
- 미나미가 ~한 그릇 더~ 완료
- 미도리의 나날 완료
- 미래소년 코난 완료
- 미아 고양이 오버 런 6화
바
- 바다이야기 ~당신이 있어 주었기에~ 1화
- 바람계곡의 나우시카 완료
- 바보와 시험과 소환수 3화
- 바우와우 완료
- 바이스 서바이브 완료
- 바이스 서바이브 R 완료
- 바케모노 가타리 완료
- 박살천사 도쿠로쨩 완료
- 박살천사 도쿠로쨩 세컨드 완료
- 방가방가 햄토리 완료
- 벚꽃 사중주 완료
- 별의 목소리 완료
- 보노보노 완료
- 보노보노 극장판 ~쿠모모 나무 이야기~ 완료
- 빅뱅 이론 시즌1 완료
사
- 사신의 발라드 완료
- 샤먼킹 완료
- 섬머 워즈 완료
- 성흔의 퀘이사 17화
- 세일러문 완료
- 세키레이 완료
- 센과 치히로의 행방불명 완료
- 센코롤 완료
- 소녀왕국 표류기 완료
- 소년탐정 김전일 완료
- 스모모모모모모 ~지상 최강의 신부~ 완료
- 스즈미야 하루히의 우울 1기 완료
- 스즈미야 하루히의 우울 2기 완료
- 스즈미야 하루히쨩의 우울 완료
- 스피드왕 번개 완료
- 슬레이어즈 완료
- 슬레이어즈 Evolution-R 완료
- 슬레이어즈 Next 완료
- 슬레이어즈 Return 완료
- 슬레이어즈 Revolution 완료
- 슬레이어즈 Try 완료
- 시간을 달리는 소녀 완료
- 심슨 가족 포기
- 심슨 가족, 더 무비 완료
- 쓰르라미 울 적에 례 완료
- 쓰르라미 울적에 완료
- 쓰르라미 울적에 해답편 완료
아
- 아기 공룡 둘리 완료
- 아기 공룡 둘리 - 얼음별 대모험 완료
- 아기와 나 완료
- 아라카와 언더 더 브릿지 7화
- 아이들의 시간 완료
- 아이들의 시간 ~당신이 내게 준 것~ 완료
- 아즈망가 대왕 완료
- 아키소라 (OVA) 완료
- 알기쉬운 현대마법 11화
- 어떤 과학의 초전자포 완료
- 어떤 마술의 금서목록 완료
- 에어(air) 완료
- 엔젤 비츠! 7화
- 엔젤릭 레이어 완료
- 엘펜리트 완료
- 여름의 폭풍! 완료
- 여름의 폭풍! ~춘하동중~ 완료
- 연희무쌍 완료
- 오나의여신님 완료
- 오나의여신님 - 작다는건편리해 완료
- 오늘의 5학년 2반 완료
- 오오카미카쿠시 완료
- 왕도둑 징 완료
- 요랑아 요랑아 완료
- 우에키의 법칙 포기
- 우주를 달리는 소녀 완료
- 우주소년 아톰 완료
- 우주스파이 짐 완료
- 원령공주 완료
- 원피스 포기
- 원피스 극장판 : 스트롱월드 완료
- 유유백서 완료
- 유희왕 5d's 7화
- 유희왕 gx 완료
- 유희왕 듀얼몬스터즈 완료
- 은하철도999 완료
- 이누야샤 완료
- 이누야샤 -완결편- 완료
- 이누야샤 네번째 극장판 : 홍련의 봉래도 완료
- 이누야샤 두번째 극장판 : 거울 속의 몽환성 완료
- 이누야샤 세번째 극장판 : 천하패도의 검 완료
- 이누야샤 첫번째 극장판 : 시대를 초월하는 마음 완료
- 이리야의 하늘, UFO의 여름 완료
자
- 작안의 샤나 II 완료
- 작안의 샤냐 완료
- 전파적그녀 완료
- 절대가련 칠드런 완료
- 정글은 언제나 하레와 구우 완료
- 정글은 언제나 하레와 구우 DELUXE 완료
- 정글은 언제나 하레와 구우 FINAL 완료
- 제로의 사역마 완료
- 제로의 사역마 ~삼미희의 윤무~ 완료
- 제로의 사역마 ~쌍월의 기사~ 완료
- 짱구는 못말려 포기
차
카
- 카나메모 완료
- 카노콘 완료
- 카노콘 OVA ~한여름의 대사육제~ 완료
- 카논 완료
- 카논 리메이크 완료
- 카라스 완료
- 카레이도 스타 완료
- 카오스 헤드 완료
- 카타나가타리 4화
- 칸나기 완료
- 캠퍼 완료
- 캣독 완료
- 케이온! 완료
- 케이온! 2기 6화
- 코드 기어스 완료
- 코드 기어스 R2 완료
- 코바토 4화
- 쾌걸 조로 완료
- 쿵야쿵야 완료
- 클라나드 완료
- 클라나드 (후코!) 완료
- 클라나드 ~AFTER STORY~ 완료
- 클라나드 극장판 완료
- 클라나드 쿄편 완료
- 클라나드 토모요편 완료
타
- 타유타마 ~Kiss on my Deity~ 완료
- 탐정학원Q 완료
- 탱구와 울라숑 완료
- 토라도라 완료
파
- 파워퍼프걸 완료
- 파워퍼프걸Z 완료
- 페이트 스테이 나이트 완료
- 펭귄 아가씨 하트 완료
- 포켓몬스터 완료
- 포켓몬스터 AG 완료
- 포켓몬스터 DP 완료
- 포켓몬스터 극장판 1기 : 뮤츠의 역습 완료
- 포켓몬스터 극장판 2기 : 루기아의 탄생 완료
- 포켓몬스터 극장판 3기 : 결정탑의 제왕 완료
- 포켓몬스터 극장판 4기 : 세레비 시간을 초월한 만남 완료
- 포켓몬스터 극장판 5기 : 물의 도시의 수호신 완료
- 퓨처라마 완료
하
제목 클릭하시면 애니메타로 넘어감......
그냥 확인용도로 보신분이라면 클릭하지 마셔요 ㅎㄷㄷ....
'잡다한 이야기 > 하고싶은이야기' 카테고리의 다른 글
체이티님 마히로님 감사합니다 ㅎㅎ (생일 선물 감사요~) (17) | 2010.05.19 |
---|---|
생일 선물 받았네요 ㅋㅋ 하루땡겨서 =ㅅ= (22) | 2010.05.18 |
숙제중인 뻘뻘뻘뻘뻘.... 도와주실분 ㅠㅠ... (22) | 2010.05.11 |
시험 끝났습니다 ㅠㅠ... (24) | 2010.05.01 |
ip 알아내기 (0) | 2010.04.23 |
티스토리 블로그의 포스트 폭과 사이드 바 폭 조정하기티스토리 블로그의 포스트 폭과 사이드 바 폭 조정하기
Posted at 2010. 5. 18. 09:50 | Posted in 카테고리 없음티스토리 블로그 스킨 중 'Life in Mono'의 포스트 폭과 사이드 바 폭을 조정하여 좀 더 유연하게 블로그 레이아웃을 다룰 수 있는 방법에 대해 알아보도록 하겠습니다.
블로그를 오래 사용하다보면 아무래도 자신이 원하는 포스트 영역의 넓이가 제공하는 스킨의 것과 차이가 있어서 불편한 경우가 종종 생기게 됩니다. 폰트나 스킨 등은 마음에 드는데 포스트 폭이 너무 좁다든지, 사이드 바의 폭을 더 키우고 싶은데 방법을 잘 모르겠다든지...
이런 불만을 해소하기 위해서는 직접 블로그 레이아웃의 설정을 변경해주어야 하는데요. 일반적으로 설치형 블로그의 환경설정은 skin.html과 style.css에서 이루어지게 됩니다. 관리자메뉴의 스킨 메뉴에서 HTML/CSS 편집으로 들어갑니다.
포스트의 폭 조정은 style.css에서 할 수 있습니다. 여기서 조금 번거로운 작업이 필요한데, 우선 수정해야할 부분이 한 곳이 아니라는 점과 늘어나는 만큼 줄어드는 부분을 감안해야 하는 등, 살짝 머리를 써줘야 하는 일이 생기게 됩니다. 머리 운동 하는 셈치고 조금만 신경쓰시면 됩니다.
일단, 수정해야할 부분은 크게 네 가지로 나뉘어지게 됩니다.
1) 블로그 레이아웃
2) 박스 레이아웃
3) 헤더 레이아웃
4) 포스트 레이아웃
1)에서는 전체 블로그 레이아웃의 폭과 그에 비례하여 포스트 부분의 레이아웃, 그리고 사이드 바의 레이아웃 폭을 조정할 수 있습니다.
2)에서는 포스트와 사이드 바의 코너 부분을 조정하게 됩니다. 여기를 건드리지 않으면 포스트 박스나 사이드 박스의 코너가 어긋나거나 잘려서 출력됩니다.
3)에서는 헤더, 즉 메뉴 바의 폭을 조정하게 됩니다. 이곳이 같이 수정되지 않을 경우, 포스트 폭을 늘리면 타이틀 바가 그보다 좁게 표시되며, 폭을 줄일 경우에는 메뉴 바 영역이 깨지게 됩니다.
4)에서는 포스트의 안쪽 영역을 조정하게 됩니다. 이곳을 같이 수정하지 않을 경우, 여백과 정렬이 맞지 않아 보기가 좋지 않습니다.
블로그를 오래 사용하다보면 아무래도 자신이 원하는 포스트 영역의 넓이가 제공하는 스킨의 것과 차이가 있어서 불편한 경우가 종종 생기게 됩니다. 폰트나 스킨 등은 마음에 드는데 포스트 폭이 너무 좁다든지, 사이드 바의 폭을 더 키우고 싶은데 방법을 잘 모르겠다든지...
이런 불만을 해소하기 위해서는 직접 블로그 레이아웃의 설정을 변경해주어야 하는데요. 일반적으로 설치형 블로그의 환경설정은 skin.html과 style.css에서 이루어지게 됩니다. 관리자메뉴의 스킨 메뉴에서 HTML/CSS 편집으로 들어갑니다.
포스트의 폭 조정은 style.css에서 할 수 있습니다. 여기서 조금 번거로운 작업이 필요한데, 우선 수정해야할 부분이 한 곳이 아니라는 점과 늘어나는 만큼 줄어드는 부분을 감안해야 하는 등, 살짝 머리를 써줘야 하는 일이 생기게 됩니다. 머리 운동 하는 셈치고 조금만 신경쓰시면 됩니다.
일단, 수정해야할 부분은 크게 네 가지로 나뉘어지게 됩니다.
1) 블로그 레이아웃
2) 박스 레이아웃
3) 헤더 레이아웃
4) 포스트 레이아웃
1)에서는 전체 블로그 레이아웃의 폭과 그에 비례하여 포스트 부분의 레이아웃, 그리고 사이드 바의 레이아웃 폭을 조정할 수 있습니다.
2)에서는 포스트와 사이드 바의 코너 부분을 조정하게 됩니다. 여기를 건드리지 않으면 포스트 박스나 사이드 박스의 코너가 어긋나거나 잘려서 출력됩니다.
3)에서는 헤더, 즉 메뉴 바의 폭을 조정하게 됩니다. 이곳이 같이 수정되지 않을 경우, 포스트 폭을 늘리면 타이틀 바가 그보다 좁게 표시되며, 폭을 줄일 경우에는 메뉴 바 영역이 깨지게 됩니다.
4)에서는 포스트의 안쪽 영역을 조정하게 됩니다. 이곳을 같이 수정하지 않을 경우, 여백과 정렬이 맞지 않아 보기가 좋지 않습니다.
먼저, 예제로 사용할 블로그의 레이아웃은 일단 다음과 같습니다.
1) 블로그 레이아웃 조정하기
style.css에서 다음 부분을 찾습니다.
/* 블로그 레이아웃 */
#header .head-container {width:/*@post-width:267=*/947px/*@*/; margin:0px auto; } /* 타이틀 바 레이아웃 폭 */
#body { clear: both; width:/*@post-width:257=*/937px/*@*/; margin:0px auto; } /* body 레이아웃 폭 */
#content {
float:left;
width:/*@post-width:35=*/722px/*@*/; /* 포스트 레이아웃 폭 */
overflow:hidden;
word-break:break-all;
}
#sidebar {
float:right;
width:200px; /* 사이드바 레이아웃 폭 */
overflow:hidden;
}
#header .head-container {width:/*@post-width:267=*/947px/*@*/; margin:0px auto; } /* 타이틀 바 레이아웃 폭 */
#body { clear: both; width:/*@post-width:257=*/937px/*@*/; margin:0px auto; } /* body 레이아웃 폭 */
#content {
float:left;
width:/*@post-width:35=*/722px/*@*/; /* 포스트 레이아웃 폭 */
overflow:hidden;
word-break:break-all;
}
#sidebar {
float:right;
width:200px; /* 사이드바 레이아웃 폭 */
overflow:hidden;
}
녹색 글씨로 표현된 부분이 수정해야할 부분입니다(위의 레이아웃 값은 제 블로그의 고유의 값입니다.). 먼저 가장 위의 두 부분은 블로그의 전체 영역을 지정하는 부분이라 하겠습니다. (CSS를 완벽하게 이해하고 있는 것은 아니지만) header의 post-width는 타이틀 바와 메뉴 바 등을 포함 블로그 상단 레이아웃의 폭을 지정하는 듯 하고, body 부분의 post-width는 포스트와 사이드 바를 포함하는 레이아웃의 폭을 지정하는 영역인 듯 하군요. 실제 이 두 부분은 꽤 밀접한 관계를 갖고 있는 것 같은데요. 어느 한 부분만을 수정할 경우에는 그 수정 사항이 레이아웃에 반영되지 않습니다. 두 부분을 같이 수정해줘야 합니다.
content의 post-width는 포스트 레이아웃의 폭입니다. 주로 이 부분이 수정대상이 되겠군요. 이 부분을 늘리기 전에는 먼저 header부와 body부의 레이아웃(이하 전체 레이아웃)을 그에 맞춰 늘려줘야 합니다. 전체 레이아웃을 수정하지 않고 늘리길 원할 경우에는 사이드 바 레이아웃 폭을 줄여줘야 합니다. 단, 사이드바는 너무 폭이 좁아지면 보기 안좋기 때문에 이것을 감안하여 세 부분의 레이아웃을 유기적으로 조정해 줍니다. 포스트 레이아웃과 사이드 바 레이아웃의 합이 전체 레이아웃을 넘어가면 안됩니다. 또한, 여백을 감안하여 그 합은 전체 레이아웃보다 더 작은 값이어야 합니다.
Life in Mono 스킨의 전체 레이아웃 상관 관계는 아래와 같습니다.
content의 post-width는 포스트 레이아웃의 폭입니다. 주로 이 부분이 수정대상이 되겠군요. 이 부분을 늘리기 전에는 먼저 header부와 body부의 레이아웃(이하 전체 레이아웃)을 그에 맞춰 늘려줘야 합니다. 전체 레이아웃을 수정하지 않고 늘리길 원할 경우에는 사이드 바 레이아웃 폭을 줄여줘야 합니다. 단, 사이드바는 너무 폭이 좁아지면 보기 안좋기 때문에 이것을 감안하여 세 부분의 레이아웃을 유기적으로 조정해 줍니다. 포스트 레이아웃과 사이드 바 레이아웃의 합이 전체 레이아웃을 넘어가면 안됩니다. 또한, 여백을 감안하여 그 합은 전체 레이아웃보다 더 작은 값이어야 합니다.
Life in Mono 스킨의 전체 레이아웃 상관 관계는 아래와 같습니다.
937px(body 레이아웃) = 947px(헤더 레이아웃) - 10px
= 722px(포스트 레이아웃 폭) + 200px(사이드바 레이아웃 폭) + 15px(사이 여백)
= 722px(포스트 레이아웃 폭) + 200px(사이드바 레이아웃 폭) + 15px(사이 여백)
2) 박스 레이아웃 조정하기
기본적인 레이아웃을 종료한 후에는 실제 포스트를 구성하는 박스와 사이드 바를 구성하는 박스 레이아웃을 조정해줘야 합니다. style.css에서 다음 부분을 찾아갑니다.
/* BOX */
.boxTop, .boxMid, .boxBtm, .boxTopR, .boxMidR, .boxBtmR {clear:both; }
.boxTop-left, .boxTop-right, .boxBtm-left, .boxBtm-right {float:left; width:4px; height:4px; background-color:#transperant; }
.boxTopR, .boxBtmR { height: 4px; }
.boxBtmR { padding-bottom: 9px; }
.boxTop, .boxMid, .boxBtm, .boxTopR, .boxMidR, .boxBtmR {clear:both; }
.boxTop-left, .boxTop-right, .boxBtm-left, .boxBtm-right {float:left; width:4px; height:4px; background-color:#transperant; }
.boxTopR, .boxBtmR { height: 4px; }
.boxBtmR { padding-bottom: 9px; }
.boxTop-mid, .boxBtm-mid, .boxTopR-mid, .boxBtmR-mid {float:left; height:4px; }
.boxTop .boxTop-mid, .boxBtm .boxBtm-mid {width:/*@post-width:34=*/714px/*@*/; } /* 포스트 박스 상·하부분 폭 */
.boxTopR .boxTop-mid, .boxBtmR .boxBtm-mid {width:192px; } /* 사이드바 박스 상·하부분 폭 */
...(중략)
.boxMid, .boxMidR {border-left:1px solid #D0D0D0; border-right:1px solid #D0D0D0; background-color:#fff; }
.boxMid {width:/*@post-width:40=*/720px/*@*/; overflow:hidden; } /* 포스트 박스 좌우 폭 */
.boxMidR {width:198px; overflow:hidden; } /* 사이드 박스 좌우 폭 */
.boxTop .boxTop-mid, .boxBtm .boxBtm-mid {width:/*@post-width:34=*/714px/*@*/; } /* 포스트 박스 상·하부분 폭 */
.boxTopR .boxTop-mid, .boxBtmR .boxBtm-mid {width:192px; } /* 사이드바 박스 상·하부분 폭 */
...(중략)
.boxMid, .boxMidR {border-left:1px solid #D0D0D0; border-right:1px solid #D0D0D0; background-color:#fff; }
.boxMid {width:/*@post-width:40=*/720px/*@*/; overflow:hidden; } /* 포스트 박스 좌우 폭 */
.boxMidR {width:198px; overflow:hidden; } /* 사이드 박스 좌우 폭 */
수정해야할 부분은 녹색 글씨로 표현된 부분입니다. 이 부분은 먼저 설명된 포스트, 사이드바 레이아웃과 밀접한 관계를 갖는데요. boxTop, boxTop-mid boxBtm, boxBtm-mid 부분은 포스트 박스의 상단 부분과 하단 부분을 의미합니다. 이 부분이 수정되지 않으면 포스트 박스의 상단과 하단이 깨져버리게 되지요. boxTopR, boxTop-mid boxBtmR, boxBtm-mid은 사이드바 박스의 상하단 부분입니다.
아래로 내려가 boxMid 부분은 포스트 박스에서 외곽선을 제외한 포스트 박스에 대한 내용입니다. boxMidR은 사이드 바에 대한 내용이구요. 각각의 상관관계는 아래와 같습니다.
아래로 내려가 boxMid 부분은 포스트 박스에서 외곽선을 제외한 포스트 박스에 대한 내용입니다. boxMidR은 사이드 바에 대한 내용이구요. 각각의 상관관계는 아래와 같습니다.
714px(포스트 박스 상하단 부분의 폭) = 722px(포스트 레이아웃 폭) - 8px
192px(사이드바 박스 상하단 부분의 폭) = 200px(사이드바 레이아웃 폭) - 8px
720px(포스트 박스 폭) = 722px(포스트 레이아웃 폭) - 2px(박스의 좌, 우 외곽선 폭의 합)
198px(사이드바 박스 폭) = 200px(사이드바 레이아웃 폭) - 2px(박스의 좌, 우 외곽선 폭의 합)
192px(사이드바 박스 상하단 부분의 폭) = 200px(사이드바 레이아웃 폭) - 8px
720px(포스트 박스 폭) = 722px(포스트 레이아웃 폭) - 2px(박스의 좌, 우 외곽선 폭의 합)
198px(사이드바 박스 폭) = 200px(사이드바 레이아웃 폭) - 2px(박스의 좌, 우 외곽선 폭의 합)
포스트, 사이드바 코너 레이아웃 조정이 잘못된 경우
3) 헤더 레이아웃 조정하기
자, 이제 전체적인 레이아웃, 그리고 포스트의 폭을 조정하고 필요에 따라 사이드 바의 폭까지 조정해 주었습니다. 이제는 넓어지거나(혹은 좁아진) 블로그 전체 레이아웃에 맞추어 메뉴바의 폭도 조정해주어야 겠죠. style.css에서 다음 부분으로 이동합니다.
/* 헤더 */
#header {
padding-top:53px;
background-color:/*@title-background-color=*/transparent/*@*/;
background-image:/*@title-background-image=*/url("http://cfs.tistory.com/blog/style/template/image/title/6.jpg%22)/*@*/;
background-repeat:/*@title-background-image-repeat=*/repeat-x/*@*/;
background-position:/*@title-background-image-position=*/center top/*@*/;
}
#header .head-container {width:/*@post-width:267=*/947px/*@*/; height:/*@title-height=*/150px/*@*/; margin:0px auto; } /* 타이틀바 폭 = 타이틀바 영역 폭 */
...(중략)
#searchbar .searchbar-container {float:left; width:/*@post-width:249=*/929px/*@*/; height:41px; background:url(images/searchbar_mid.png) repeat-x; } /* 메뉴바 폭 */
* html #searchbar .searchbar-container {
width:/*@post-width:249=*/929px/*@*/; /* 메뉴바 폭 */
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://cfs.tistory.com/blog/skin/tis_LifeInMono_Light/images/searchbar_mid.png', sizingMethod='scale');
}
#header {
padding-top:53px;
background-color:/*@title-background-color=*/transparent/*@*/;
background-image:/*@title-background-image=*/url("http://cfs.tistory.com/blog/style/template/image/title/6.jpg%22)/*@*/;
background-repeat:/*@title-background-image-repeat=*/repeat-x/*@*/;
background-position:/*@title-background-image-position=*/center top/*@*/;
}
#header .head-container {width:/*@post-width:267=*/947px/*@*/; height:/*@title-height=*/150px/*@*/; margin:0px auto; } /* 타이틀바 폭 = 타이틀바 영역 폭 */
...(중략)
#searchbar .searchbar-container {float:left; width:/*@post-width:249=*/929px/*@*/; height:41px; background:url(images/searchbar_mid.png) repeat-x; } /* 메뉴바 폭 */
* html #searchbar .searchbar-container {
width:/*@post-width:249=*/929px/*@*/; /* 메뉴바 폭 */
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://cfs.tistory.com/blog/skin/tis_LifeInMono_Light/images/searchbar_mid.png', sizingMethod='scale');
}
수정해줄 부분은 녹색의 글씨 부분입니다. 먼저, header의 레이아웃은 앞선 1)의 header 레이아웃과 동일하기 때문에 1)에서 수정해주었다면 같은 값으로 조정해주어야 합니다.
좀 더 밑으로 이동하여 searchbar 부분이 메뉴바의 폭을 조정할 수 있는 부분이니다. 전체 레이아웃이 늘어났을 경우 그에 맞추어 이 메뉴바도 늘려주는 것이 보기가 좋습니다. 특히, 레이아웃이 전체적으로 좁아졌는데 이 부분을 수정하지 않는다면, 메뉴바의 앞 뒤가 잘려져서 깨진 형태로 표시됩니다. 메뉴바의 폭을 조정하는 부분은 두 부분입니다. 상관관계는 다음과 같습니다.
929px(메뉴바 폭) = 947px(헤더 레이아웃) - 18px
메뉴바 레이아웃 조정이 잘못된 경우
4) 포스트 레이아웃 조정하기
마지막으로 포스트의 안쪽 레이아웃을 조정해줄 차례입니다. 3)까지의 과정을 마치면 외곽 레이아웃의 조정은 모두 완료됩니다. 하지만 포스트 본문의 경우는 레이아웃의 변화에 따라 이전에 작성했던 포스트의 오른쪽 여백이 없어지고 그림이 잘려서 표시되거나, 오른쪽 여백이 너무 많이 남는 상황이 발생하게 됩니다. 따라서, 다음과 같이 포스트 본문 영역 또한 바뀌어진 레이아웃에 맞춰줘야 합니다. style.css에서 다음을 찾습니다.
/* 포스트 */
.infor {width:/*@post-width:42=*/722px/*@*/; height:22px; padding-top:8px; } /* 포스트 레이아웃 폭 */
... (중략)
.article {
width:/*@post-width=*/680px/*@*/; /* 포스트의 본문 영역 폭 */
color:/*@post-body-color=*/#000000/*@*/;
font-size:/*@post-body-font-size=*/13px/*@*/;
font-family:/*@post-body-font-family=*/Malgun Gothic/*@*/;
word-break:break-all;
word-wrap:break-word;
overflow:hidden;
line-height:/*@post-body-line-height*/20px/*@*/;
text-align:justify;
}
.infor {width:/*@post-width:42=*/722px/*@*/; height:22px; padding-top:8px; } /* 포스트 레이아웃 폭 */
... (중략)
.article {
width:/*@post-width=*/680px/*@*/; /* 포스트의 본문 영역 폭 */
color:/*@post-body-color=*/#000000/*@*/;
font-size:/*@post-body-font-size=*/13px/*@*/;
font-family:/*@post-body-font-family=*/Malgun Gothic/*@*/;
word-break:break-all;
word-wrap:break-word;
overflow:hidden;
line-height:/*@post-body-line-height*/20px/*@*/;
text-align:justify;
}
722px라는 값은 포스트 레이아웃의 폭으로 1)에서 정했던 포스트 레이아웃 폭과 동일한 값으로 설정합니다. 그리고 하단에 위치한 것이 바로 본문의 실제 영역이 되겠는데요. 여기서는 42px 정도의 차이를 두고 설정하고 있습니다. 이 말은 결국, 우리들이 설정하는 포스트 영역 폭에서 42px만큼 감소된 값이 진짜 본문 영역 폭이라는 소리입니다. 사진이나 그림 등을 주로 싣는 블로그를 만들 경우에는 때 이 점을 참고해서 포스트 영역을 조정해야 할 듯 합니다.
680px(포스트 안쪽 본문 폭) = 722px(포스트 레이아웃 폭) - 42px
포스트 본문 레이아웃 조정이 잘못된 경우
위의 방법을 토대로 포스트 영역을 100px 줄이고, 사이드를 100px 늘린 블로그의 레이아웃입니다. 물론, 이와 반대로 포스트 영역을 더 늘리고 사이드 바를 줄일 수도 있으며, 포스트 영역을 늘리면서, 사이드 바 영역을 그대로 유지하는 것도 모두 가능합니다. 위의 방법을 사용하면 말이죠.
티맥스소프트, 결국 매각 추진티맥스소프트, 결국 매각 추진
Posted at 2010. 5. 14. 10:45 | Posted in 뉴스/IT관련뉴스- 티맥스소프트, 국내에 남은 유일하다 할 대형 소프트웨어 업체가 결국 매각을 추진 중인 것으로
확인됐다. 이데 따라 대한민국 소프트웨어산업도 크게 위축될 것으로 보인다.
유저에 따라, 바라보는 시선에 따라 그 평이 극명하게 달라지긴 했지만, 국내에 이만한 규모를 이룬 소프트웨어 기업을 찾기 어렵다는 점에서 티맥스는 나름대로 국내 소프트웨어 산업에 큰 비중과 역할을 담당했던 것이 사실이다.
하지만 의욕적으로 도전했던 윈도우 개발은 주위의 비아냥을 받는 수준이었고, 작년부터 직원들의 처우, 운영진의 교체 등 크고 작은 우여곡절을 겪으며 흔들리기 시작한 티맥스소프트가 결국 매각을 추진 중인 것으로 확인됐다. 작년 중순 절대 매각은 없다고 강수를 둔지 불과 일 년도 되지 않은 시점에서 확인된 이같은 사실은 국내 소프트웨어의 활성화를 기대하는 유저들에게는 적잖은 실망감이 들법한 소식.
티맥스 소프트 고위 관계자는 지난 13일, "경영난이 심화되면서 현재 주요 정보기술(IT) 서비스업체를 대상으로 M&A를 제안한 상태"라고 밝혔다. 현재 삼성SDS, LG CNS 등이 인수를 검토했거나, 또는 검토 중인 것으로 알려지고 있다. 박대연 티맥스소프트 회장은 "M&A나 투자건에 대해 아무것도 말할 수 없다"며 답을 피하고 있는 상황.
지난해 말부터 심각한 유동성 위기를 겪어온 티맥스는 사업에 비해 성과가 적었고, 부채가 1000억원을 넘는 등 어려움을 겪어 왔다. 부동산 매각 등으로 일부 채무를 변제했지만 여전히 650억원 이상의 채무가 남아있는 상태. 티맥스는 경영 합리화를 위해 2008년 말 1836 수준이던 직원 수를 1067명으로 줄였으며, 올 초 KT와 통신 SW 합자회사 'KT이노츠'를 설립해 분할을 시도하기도 했다.
M&A 성사 여부를 떠나 각광받던 소프트웨어 기업이 이렇게 맥없이 무너지게 되면서 관련 산업, 소프트웨어 기반 산업의 동반 몰락을 우려하지 않을 수 없는 상황이다. 특히 소프트웨어 산업을 집중 육성, 글로벌 기업을 키워낸다는 정부의 정책과 목표에도 차질이 불가피해진 상황.
국내 여건의 문제였을까? 아니면 티맥스의 잘못 때문이었을까? 명확한 원인은 알 수 없지만, 소프트웨어 기업들의 몰락은 우리 소프트웨어 산업의 미래에 대한 불안감을 가중시킬 수 밖에 없는 것이 현실. 정부 역시 단기적인 상과나 결과에 연연하기보다 이후 오랜 기간 대한민국을 이끌어갈 전략 산업으로 보고 거시적인 플랜과 지원 방안 등을 마련해야 할 것으로 보인다.
출처 - 케이벤치(www.kbench.com)
결국 티맥스윈도우를 출시하지 못하고 내려앉았네요 ㄷㄷ....
국산 윈도운좀 본다 싶었더니 안타깝습니다.
최근에 KT이노츠란 것을 만들었지만 것도 망하는건가요??.....
'뉴스 > IT관련뉴스' 카테고리의 다른 글
국내에서 휴대폰이 비싼게 A/S 때문이라구?! 이 뭔 개소리야? (21) | 2010.07.22 |
---|---|
Saying it out loud: IBM is moving to Firefox as its default browser (10) | 2010.07.09 |
인텔과 노키아, 통합 소프트웨어 플랫폼 '미고(MeeGo)' (2) | 2010.04.14 |
MS, IE 제로데이 긴급 패치 배포한다 (16) | 2010.03.30 |
KT이노츠 그게 뭐야?! 티맥스 + KT 손잡는다!! (10) | 2010.01.25 |