나만의 위젯을 만들어보자.
여러분들은 위젯을 블로그 에 달아 보셨나요?
블로그 사이드바에 나만의 특별한 위젯을 만들어 달면 좋겠다고 여러분들도 생각해보았을 것입니다. 위젯을 만들고 싶어도 컴퓨터 실력이 부족하여 못 만들고 그만두는 일들이 참 많을 것입니다. 내가 만들지는 못해도 여러 사람들이 만들어놓은 웹언어인 태그를 이용하여 위젯을 흉내를 내어 연출하는 방법으로 한번 해 보겠습니다.
먼저 위젯에 사용할 이미를 포토샵이나 그림판으로 크기를 정하여 만들어 웹서버어디엔가 올려둡니다 서버는 여러분의 블로그에 올려도 좋고 아니면 게시판에 파일로 첨부하여 올려도 좋습니다 이미지에 주소만 부여되면 되니까요 이미지의 고유 주소가 있어야 웹에서 제대로 이미지가 나타나기 때문에 반듯시 이미지는 주소가 있어야합니다.
그리고 이미지가 준비 되었다면 이제 태그를 이용하여 웹을 만드는데 위젯을 크기를 어떻게할 것인가를 정하여 위젯 커기에 맡게 웹페이지를 만들어야 겠지요 여기서 만드는 위젯은 크기를 가로200픽셀 세로 230픽셀 사이즈 위젯을 만들기로 합시다.
크기를 정하셨다면 이제 이미지를 불러오는 이미지 태그를 사용하여 저장해둔 서버에서 이미지를 불러옵니다. <img src="이미지 주소“>이미지를 불러왔다면 이제 이미지에 링크를 걸어 열고 싶은 웹을 열수있게 합니다 반듯이 새창으로 열어야 겠지요
<p><a href="http://가야할웹주소" target="_blank"><img border="0" src="이미지주소" width="180" height="210"></a></p>
메모장에 이와같이 태그를 작성하여 확장자를 htm 파일로 저장하여 또 게시판에 파일로 첨부하여 올려 웹주소를 만든다.
이런식으로 복수의 웹페이지를 만들어 올려놓고
웹페이지 랜덤으로여는 태그를 이용하여 또 하나의 웹페이지를 만든다. 만드는 태그는 아래같이 작성한다.
<HTML>
<HEAD> <TITLE>pr</TITLE> <script LANGUAGE="javascript"> <!-- //-- 웹페이지의 경로를 넣어주세욤 ^^* var pages = new Array( "http://웹페이지주소/파일명.htm", "http://웹페이지주소/파일명.htm", "http://웹페이지주소/파일명.htm"); //----- 아래 내용은 수정하지 마세요. ^^* var pageNo = Math.floor(Math.random()*pages.length); //--> </script> </HEAD> <BODY> <script language="JavaScript"> <!-- location.href=pages[pageNo] //--> </script> </BODY>
</HTML>
메모장으로 이와같이 작성하여 확장자를 먼저와 같이 뭐뭐.htm 으로 저장하여 게시판에 또 파일 첨부형식으로 올려주면 웹주소를 얻을수 있을 것입니다.
이제 위젯모양의 준비물이 다됬다면 창안에 창열기 태그로 마무리 합시다.
아래가 창안에 창열기 태그입니다.
[여기서부터]
<div align="left"> <table border="1" width="200" height="230" bgcolor="#8A8A8A" cellspacing="0" cellpadding="10"> <tr> <td width="200" height="230"> <p align="center"><iframe src="랜덤웹주소" frameborder="0" width="180" height="205" leftmargin="0" topmargin="0" scrolling="no"></iframe></td> </tr> </table></div>
[여기까지 드래그하여 매모장에 붙여 넣어다가 매모장에서 다시 복사하여 블로그 스킨편집으로 사이드바 부분 태그에 알맟은 장소에 붙여 넣어주시면 끝
'컴퓨터 태그 홈피만들기' 카테고리의 다른 글
| 티스토리 초대장 배포함에 있어 (3) | 2012.01.25 |
|---|---|
| 검색창 만들기 (1) | 2012.01.22 |
| 홈페이지 만들기 (0) | 2011.09.13 |
| 컴퓨터정품인정을 통과 못한고 인터넷하는방법 (0) | 2011.09.02 |
| 돈을 벌수 있는 블로그 (1) | 2011.08.26 |
