지난번 포스팅한 윈도우 라이브 캘린더를 블로그에 삽입하는 방법에 이어 블로그에 삽입한 캘린더의 크기를 원하는 크기로 조정하는 방법이 윈도우 라이브 핫메일 블로그에 올라와 소개합니다. 우선 지난번에 만든 윈도우 라이브 캘린더용 iframe 코드는 아래와 같습니다. 아래 코드에서 user=cid-caxxxxxxxxxxa2는 자신의 윈도우 라이브 사용자 id이므로 개개인마다 다르게 나타납니다. (자신의 윈도우 라이브 사용자 id를 알아내는 방법을 알고 싶으면 이전 포스팅 참조!)
1. 우선 캘린더에서 어떤 내용을 보여줄지를 결정해야 합니다. 이미 해 보신분들은 아시겠지만 윈도우 라이브 캘린더를 블로그에 삽입하면 달력이 나타나고 그 아래에 자기가 라이브 캘린더에서 입력해 놓은 일정이나 이벤트 리스트가 동시에 나타납니다. 여기서 달력만 보여주려면 이전에 사이드바에 삽입한 iframe 코드에 “l=m” 를 추가로 넣어주고 이벤트 리스트만 보여주려면 “l=a”를 넣어주면 됩니다. 그냥 둘다 보여주려면 "l=ma" 라고 넣어주면 됩니다.
2. 어떤 내용을 보여줄지 정했으면 두번째로 캘린더의 크기를 조정해 볼텐데 좌우 넓이는 141픽셀 또는 194픽셀, 두가지로만 선택이 가능합니다. 넓이를 141픽셀로 정하려면 위에 예로 든 iframe 코드에 “w=n”를 넣어주고 194픽셀로 정하고 싶으면 “w=w"라는 코드를 넣어주면 됩니다.
c=<배경(Background)색상>|<경계선(Border) 색상>|<글자(Text) 색상>|<선택하지 않은 글자(Alternate text) 색상>|<링크(Link) 색상>|<선택부분(Selection) 색상>
5. 마지막으로 iframe 자체의 경계선 굵기 및 크기, 스크롤 여부를 정합니다. (HTML코드를 조금 안다면 쉽게 할수 있는 부분입니다.)
제 블로그에 보이는 윈도우 라이브 캘린더의 소스코드를 최종 샘플로 공개해보면 아래와 같습니다. user=cid-caxxxxxxxxxx2 라고 되어 있는 부분이 개인 id부분이고 cal=%ec%99%80%ec%9d%b4%ec%97%87%ec%9d%98+%ec%ba%98%eb%a6%b0%eb%8d%94 라고 되어 있습니다. 이 부분은 각자 다른 코드를 가지고 있습니다. 옵션 부분은 모두 & 로 구분해 놓았으니 참고하시기 바랍니다.
이렇게 캘린더를 정리해 놓고 나니 블로그 사이드바가 깔끔해져서 훨씬 보기 좋아진것 같습니다. 그리고, 블로그에 캘린더가 항상 보이니 블로깅하다가 이따금씩 캘린더를 쳐다보게 되어 중요한 약속을 잊을 염려도 없고 개인일정 관리뿐 아니라 팀 일정관리 할때도 편리하게 사용할수 있을것 같습니다. 팀 일정은 윈도우 라이브 캘린더의 캘린더 공유 기능을 사용하면 됩니다. 또한, 자신의 일정을 블로그 방문자에게 알려줄수도 있어 별도의 공지사항을 작성하지 않아도 간단한 공지기능으로 사용할수 있어 좋은 것 같습니다.
* 이 포스트는 blogkorea [블코채널 : 웹, 컴퓨터, it에 관련된 유용한 정보 및 소식] 에 링크 되어있습니다.
<iframe src=http://calendar.live.com/calendar/badgeif.aspx?user=cid-caxxxxxxxxxxa2&cal=%ec%99%80%ec%9d%b4%ec%97%87%ec%9d%98+%ec%ba%98%eb%a6%b0%eb%8d%94></iframe>
1. 우선 캘린더에서 어떤 내용을 보여줄지를 결정해야 합니다. 이미 해 보신분들은 아시겠지만 윈도우 라이브 캘린더를 블로그에 삽입하면 달력이 나타나고 그 아래에 자기가 라이브 캘린더에서 입력해 놓은 일정이나 이벤트 리스트가 동시에 나타납니다. 여기서 달력만 보여주려면 이전에 사이드바에 삽입한 iframe 코드에 “l=m” 를 추가로 넣어주고 이벤트 리스트만 보여주려면 “l=a”를 넣어주면 됩니다. 그냥 둘다 보여주려면 "l=ma" 라고 넣어주면 됩니다.
2. 어떤 내용을 보여줄지 정했으면 두번째로 캘린더의 크기를 조정해 볼텐데 좌우 넓이는 141픽셀 또는 194픽셀, 두가지로만 선택이 가능합니다. 넓이를 141픽셀로 정하려면 위에 예로 든 iframe 코드에 “w=n”를 넣어주고 194픽셀로 정하고 싶으면 “w=w"라는 코드를 넣어주면 됩니다.
3. 넓이를 정했으면 이제 높이를 정할 차례인데 캘린더에는 달력과 함께 이벤트 리스트를 보여주게 되며 이벤트 리스트를 보여주는 방법에는 4가지 옵션이 있습니다.
- 현재 날짜와 가장 가까운 이벤트를 하나만 보여주려면 “h=s”라는 코드를 넣어줍니다.
- 이벤트 리스트중에 3가지 이벤트를 보여주려면 “h=m”이라는 코드를 삽입합니다.
- 이벤트 리스트중에 5가지 이벤트를 보여주려면 “h=mt”이라는 코드를 삽입합니다.
- 이벤트 리스트중에 7가지 이벤트를 보여주려면 “h=t”이라는 코드를 삽입합니다.
c=<배경(Background)색상>|<경계선(Border) 색상>|<글자(Text) 색상>|<선택하지 않은 글자(Alternate text) 색상>|<링크(Link) 색상>|<선택부분(Selection) 색상>
5. 마지막으로 iframe 자체의 경계선 굵기 및 크기, 스크롤 여부를 정합니다. (HTML코드를 조금 안다면 쉽게 할수 있는 부분입니다.)
제 블로그에 보이는 윈도우 라이브 캘린더의 소스코드를 최종 샘플로 공개해보면 아래와 같습니다. user=cid-caxxxxxxxxxx2 라고 되어 있는 부분이 개인 id부분이고 cal=%ec%99%80%ec%9d%b4%ec%97%87%ec%9d%98+%ec%ba%98%eb%a6%b0%eb%8d%94 라고 되어 있습니다. 이 부분은 각자 다른 코드를 가지고 있습니다. 옵션 부분은 모두 & 로 구분해 놓았으니 참고하시기 바랍니다.
<iframe frameborder="0" scrolling="no" width="194" height="450"src=http://calendar.live.com/calendar/badgeif.aspx?user=cid-caxxxxxxxxxx2&cal=%ec%99%80%ec%9d%b4%ec%97%87%ec%9d%98+%ec%ba%98%eb%a6%b0%eb%8d%94 &h=m&w=n&l=ma&c=ffffff|000000|000000|cccccc|9999ff|ddeeff"/></iframe>
이렇게 캘린더를 정리해 놓고 나니 블로그 사이드바가 깔끔해져서 훨씬 보기 좋아진것 같습니다. 그리고, 블로그에 캘린더가 항상 보이니 블로깅하다가 이따금씩 캘린더를 쳐다보게 되어 중요한 약속을 잊을 염려도 없고 개인일정 관리뿐 아니라 팀 일정관리 할때도 편리하게 사용할수 있을것 같습니다. 팀 일정은 윈도우 라이브 캘린더의 캘린더 공유 기능을 사용하면 됩니다. 또한, 자신의 일정을 블로그 방문자에게 알려줄수도 있어 별도의 공지사항을 작성하지 않아도 간단한 공지기능으로 사용할수 있어 좋은 것 같습니다.
* 이 포스트는 blogkorea [블코채널 : 웹, 컴퓨터, it에 관련된 유용한 정보 및 소식] 에 링크 되어있습니다.
'IT' 카테고리의 다른 글
윈도우7, 8월에 출시될수도 있다? (0) | 2009.05.03 |
---|---|
윈도우7에 포함될 가상 XP 모드, 내 PC에서 사용할수 있을까? (0) | 2009.05.01 |
내가 로또복권 구입의 국제적 최상 후보자? (20) | 2009.04.28 |
사람의 움직임을 감지하는 LCD 모니터 (2) | 2009.04.28 |
첫번째 안드로이드 넷북의 가격은 250달러? (6) | 2009.04.28 |