티스토리 뷰

홈페이지형블로그제목

 

홈페이지형 블로그제작 마지막시간이네요~오늘은 홈페이지처럼 메뉴를 만들어서 클릭하면 해당페이지로 이동

할수 있도록 링크를 걸어주어서 홈페이지처럼 만드는 과정을 해볼건데요. 지난시간에 좌표값을 구해놨으니

그 좌표값을 대입만 시켜주면 간단합니다.

 

투명위젯만들기

 

포토샵을 열어서 새로만들기로 하시면 이름은 적당히 넣어주시구요 가로 170px , 세로 400px을 설정하구요

가장중요한건 내용에서 투명을 선택해야 배경이 투명이 됩니다. 다 선택하셧으면 승인을 누르면되는데요

그후에 따로저장을 눌러 그림형태를 png형태로 저장해주시면 투명그림이 생성이 됩니다.

 

이미지주소

 

블로그로 이동하셔서 메모란에 글쓰기를 누르시면 위와 같은 페이지가 나오는데요 사진등록을

눌러서 아까 만든 투명위젯을 올려줍니다. 위의 이미지에서 회색박스인데요 실제로는 투명이라

아무것도 보이지 않습니다. 그럼 밑에 html이라고 써잇는것을 클릭하면 중간에 겹쳐져 있는

그림은 html을 눌러야 보입니다. <img src= ... 시작해서 ...png로 끝나는 부분을 컨트롤 + c를 눌러

복사해 둡니다. "http://blogfiles.naver.net/MjAxNzA4MDVfMjMz/MDAxNTAxODk4MTIyNDY1.TZR

h3w806uTn4v8InaWZ1Eoje98VujTEZaWpNTRvyMYg.a0C3EM0o9_GtJ0wSllFZ9KLqaYOR5QzkQLYt

qjyGmkAg.PNG.kadakorea/%ED%88%AC%EB%AA%85.png" 이것이 되겠네요 복사하신다음 확인을

눌러 글을등록시켜줍니다.

 

링크주소복사

자 이제 클릭했을경우 해당 페이지로 이동하게 링크주소를 복사해야 하는데요 블로그 메인화면에서

맨밑으로 내리시면 카테고리라는것이 있어요 위의 그림과 같이 해당 이동페이지에 마우스오른쪽을

클릭하면 팝업이 뜨는데요 "링크주소복사"라는 것을 선택해서 주소를 복사해 둡니다. 위의 이미지는

크롬에서 주소를 복사한것이구요 익스플로러에서는 속성에서 주소를 복사하시면 됩니다.

 

투명위젯에디트

 

블로그 관리페이지로 와서 꾸미기 - 위젯,레이아웃 페이지로 이동하시면 저번에 했던 위젯사용설정을

마우스휠로 내리시면 지난시간에 만들어놓은 위젯 다섯개를 보실수있는데요 옆에 보면 edit라는

글을 클릭하시면 수정을 하실수가 있어요~

 

위젯수정하기

 

에디트 버튼을 클릭하시면 위젯수정이라는 박스가 뜨면서 내용을 수정하실수가 있는데요. 위젯코드입력

코드를 수정하시면 되는데요~ <img src="투명위젯png주소" 아까전에 등록하구 <img 어쩌구 복사해놓은

주소를 여기다 붙혀넣으시면 되구요 width="170", height="400"으로 설정해주시면되구요 밑에보면

좌표값 0,236,169,292라고 써있는것을 좌표구하기 시간에서 구한 좌표값을 써주시구요 마지막으로

herf ="링크걸 주소"란에 주소값을 넣어주면되는데요~주소값을 넣으주시면 됩니다.

 

<img src="http://blogfiles.naver.net/MjAxNzA4MDVfMjMz/MDAxNTAxODk4MTIyNDY1.TZR

h3w806uTn4v8InaWZ1Eoje98VujTEZaWpNTRvyMYg.a0C3EM0o9_GtJ0wSllFZ9KLqaYOR5QzkQLYt

qjyGmkAg.PNG.kadakorea/%ED%88%AC%EB%AA%85.png" width="170" height="300" usemap="#Map" border="0" />
<map name="Map" id="Map">
 <area shape="rect" coords="0,240,170,300" href="http://blog.naver.com/PostList.nhn?blogId=kadakorea&amp;from=postList&amp;categoryNo=6" target="_top" />
</map>

 

최종적으로 녹색으로 표시된곳만 입력하시면되구요 나머지는 똑같이 써주시면됩니다. 물론 다섯개의

위젯의 클릭위치가 같기 때문에 밑의 herf=주소넣는곳만 각각의 링크를 복사해서 붙혀넣기하시면

간단하게 홈페이지형 블로그를 제작하실수 있어요. 머리에 있는 내용을 글로 쓸려니 너무 어렵네요

간단하고 쉽게 설명을 한다고 하는데 초보자에게는 먼말인지 잘모르는 경우가 많겠지요. 그럴땐

과감하게 댓글남겨주세요. 자세히 설명을 드리던 안돼면 전화라도 드려서 가르켜 드릴께요 ㅎ

이상으로 홈페이지형 블로그 만들기를 마치겠습니다. 감사합니다.

댓글