홈페이지형 블로그 위젯 링크 여러개 연결하기: 간단 꿀팁

네이버블로그 위젯

투명위젯에 링크 여러개 연결하기

홈페이지형 블로그 초간단 꿀팁

 

 

 

홈페이지형 블로그 투명위젯 링크 연결
위젯 하나에 링크 여러개 연결하는 법! 

 

 

안녕하세요. 해피밀입니다. 오늘은 홈페이지형 블로그를 만드시려는 분들께 아주 도움이 될 만한

포스팅으로 왔습니다! 저는 현재 제 개인 블로그는 티스토리로 운영하고 있고, 저희 회사 블로그는 네이버로 운영하고 있습니다. 

블로그에 관심이 있으신 분들은 모두 아실, 홈페이지형 블로그에 대해 간단히 소개해드리고

하나의 위젯에 여러 링크를 연결할 수 있는 방법!을 바로 알려드리도록 하겠습니다.

더 이상 헤매지 마시고~ 제 블로그 보시고 바로 따라하세요!

 

 

 

✅ 홈페이지형 블로그란? 

 

출처:구글검색-에이픽셀

 

 

 

: 홈페이지형 블로그란? 

 

예시 이미지에서 보시다시피, 블로그지만 메인화면이 마치 홈페이지처럼 꾸며놓은 블로그를 말합니다. 티스토리 블로그로는 설정할 수 없고, 네이버 블로그로만 가능합니다. 네이버의 기본 설정으로는 할 수 없고 개인이 직접 위젯 위치를 결정하여 만드는 방법인데요. 주로 업체에서 운영하는 블로그들이 이러한 형태 입니다. 파워블로거들도 이러한 홈페이지형 블로그를 운영하고 있고요.

모바일에서는 불가하며, PC에서만 가능합니다.

 

 

 

✅굳이 홈페이지형 블로그를 왜 만드느냐?

 

 

요즘 홈페이지 없는 회사가 있을까요? 그 기업의 정보를 알고싶을 때 제일 먼저 하는것이 인터넷 검색이고, 그 다음 홈페이지를 둘러보는 것이겠죠. 큰 기업들은 보통 전문업체에서 제작한 홈페이지를 가지고 있지만, 영세한 기업들은 홈페이지가 없는 경우가 많아요.

홈페이지의 기능을 블로그로 대신 하는 경우가 굉장히 많은데, 이 때! 홈페이지형 블로그로 예쁘게 꾸며놓으면 전문가 느낌이 나기때문에 회사의 이미지를 위해서 홈페이지형 블로그로 해놓습니다.

 

 

 

---

 

 

저는 저희 회사 블로그를 포함하여 SNS를 담당하고 있습니다. 블로그, 인스타그램, 유튜브 모두 저의 손길이 안닿은 곳이 없어요. 하나하나 찾아보고 공부하며 만들었는데, 그 중에서도! 홈페이지형 블로그의 최대 장점이자 아주 헷갈리는 부분!

위젯 하나에 여러개의 링크 달기~! 를 여러분께 공유해드리려고 합니다. 

 만드는 순서부터 차근차근 설명해드릴 수 도 있지만, 이 포스팅은 '홈페이지형 블로그 스킨은 다 만들었는데, 링크여러개를 연결하고 싶어요. 링크 하나씩은 연결할 수 있는데 여러개 연결은 어떻게 하나요?' 이런 분들을 위한 내용입니다.

 

 

 

1. 모든 준비를 완료한 후 링크거는 것만 남으신 분들 따라하세요. 어느부분에 링크를 여러개 할 지 확인 합니다.

이미지위에 표시해 둔 네모칸에 링크를 각 각 걸어보도록 하겠습니다.

 

 

 

2. 연결해 줄 위젯 부분만 따로 잘라줍니다. 

 

 

 

3. https://www.maschek.hu/imagemap/ 이 사이트로 들어가서 이미지를 업로드 해주세요. 그리고 좌표값을 구해줍니다.

홈페이지형 블로그 위젯 링크연결하기 01

 

 

 

 

4. 링크를 걸어줄 영역을 드래그하여 잡아준 후, 좌표값을 확인합니다. 좌표값이 2,374,163,422 나왔습니다. 아래 영역도 똑같은 방법으로 좌표값을 얻습니다.

 

 

 

 

5. 좌표값을 다 얻었으면 블로그 설정으로 들어갑니다.  블로그 관리-> 꾸미기설정->레이아웃 위젯설정

링크를 걸어줄 위젯의 

 

 

 

6.

 

저는 위젯5번에 링크를 걸어줄 것이기 때문에 위젯5를 열었습니다. 

 

<img src="본인이만든 투명위젯 주소를 넣으세요 type=w966" width="170px" height="500px" usemap="#wb" border="0" />

<map name="wb">
<area shape="rect" coords="링크1의 좌표값" href="연결할링크주소1" target="_blank" />
<area shape="rect" coords="링크2의 좌표값" href="연결할링크주소2" target="_blank" />
<area shape="rect" coords="링크3의 좌표값" href="연결할링크주소3" target="_blank" />
</map>

 

 

✅이 소스 그래도 복사해서 사용하세요!  주의할 점!

• img의 width와 height 값은 본인의 위젯 사이즈에 맞게 수정하면 됩니다.
• target="_blank" 는 링크가 새로운 창으로 열립니다. 만약 현재창으로 열리길 원하시면 self 로 수정하세요.
• <area shape="rect" coords="링크3의 좌표값" href="연결할링크주소3" target="_blank" />  이 부분을 링크를 연결할 만큼 복사+붙여넣기하여 사용하면 됩니다.
• 맵네임 'wb'는 제가 임의로 설정한것이니 편한걸로 수정하여 사용해도 됩니다. 

 

 

 

 

저는 이렇게해서 회사 블로그에 링크 3개를 연결했습니다. 제가 알려드린 소스코드를 그대로 복사하여 사용하시면 됩니다.

저도 헷갈릴때마다 이 포스팅을 참고해야겠네요 ㅎㅎ  

 

 

 

그럼 다음에도 꿀팁을 전달해드리도록 좋은 내용의 포스팅을 가지고 오겠습니다.

다음 포스팅에서 또 만나요~!