지크의 팁박스 :: 블로그에 날씨 배너 달기

블로그에 날씨 배너 달기

블로그 : 2007/05/14 03:30

홈페이지 상단이 왠지 허하고, 광고 뿐만이 아니라 유익한 정보도 전해주고 싶어서 날씨 배너를 달기로 했다. 그런데 날씨 배너를 서비스하는 업체는 상당히 많은 것 같은데, 정작 쓸만한 것은 없다. 디자인이 구리거나, 배너 하단에 보기싫은 광고가 붙어있기 때문이다. 지금 소개할 Kweather 의 배너 서비스도 실제로는 하단에 광고가 붙어있다. 돌아다니는 설치 팁에는 overflow:hidden (구역을 넘어가는 부분을 잘라서 안보이게 하는 태그) 을 먹이라고 하는데, 아쉽게도 파폭과 오페라에서는 제대로 적용되지 않았다. 원인을 찾아보니, 파폭과 오페라에서는 overflow 하는 텍스트 만을 제대로 잘라낼 뿐, 이미지 같은 것들은 그대로 노출했다. 이래가지고는 웹표준을 자랑하는 오페라와 파폭의 명성이 아깝다는 생각조차 든다.

암튼 몇시간의 삽질 끝에 해결책을 찾아냈는데, 바로 iframe 을 사용하는 것이다. iframe 은 페이지 안에 또다른 페이지를 연결해 보여주는 태그이다. Kweather 가 들어간 페이지를 별도로 만들어 계정에 올리고, 삽입을 원하는 페이지에 iframe 태그로 출력해 보여준다는 얘기다. 하지만 여기서도 브라우저 별로 여백 처리가 다르고, 스크롤 바가 보여지는 문제가 발생한다. 다행히 여백을 "0" 으로 하고, 스크롤 바를 안보이게 설정하니, 세가지 브라우저에서 똑같은 결과를 얻어낼 수 있었다.

기술적인 설명은 이정도로 하고, 내가 사용한 코드를 보여주겠다.

1. Kweather 가 들어간 페이지

</body>

원하는 지역이나 스킨이 다르기 때문에 아래 페이지를 참고해서 코드를 수정해줘야 한다.
http://cafe.naver.com/ahablog/10667

2. 삽입을 원하는 페이지

* 그나저나 광고에다 날씨, 카운터 등, 외부 호출이 너무 많아져서 블로그가 매우 무거워졌다. 초고속 인터넷이 아닌 다른 곳에서 이 블로그에 접속해보니, 전체 내용이 표시되지도 않고 [완료] 메시지를 뱉어낸다. 빌어먹을 IE 같으니, 시간이 아무리 걸리더라도 로딩은 해야될 것 아냐!