블로그 마케팅 강좌 - 프롤로그..

강좌의 대상 층은 "전업 블로거"의 수입을 조금 늘릴 수 있는 방법을 제시하고, 마케팅 비의 부담을 느끼는 소기업이나 소상 점을 위한 내용을 중심..

블로그 1:1 멘토링 교육 안내..

블로그가 요동을 치고 있는 상황입니다. 덕분에 저도 블로그 교육을 다시 시작을 하려고 합니다. 교육 방식은 1:1교육으로 메토링을 진행 하려고 ...

IT 제품 등에 대한 리뷰를하고...

브랜드 블로그와 블로그 마케팅을 블로그를 전문적으로 운영해드리고 있습니다.
TEL.010-2776-9081 / chunchu99@gmail.com

네이버 블로그 만들기[4] 위젯을 만들자

네이버 블로그 만들기의 단점으로 꼽는 것 중 하나가 확장 성이나 자유도가 약하다는 것입니다. 물론 티스토리나 워드 프레스 같은 설치 형 블로그에 비하여서는 자유도가 떨어집니다.

   

자유도가 떨어지는 네이버 블로그를 다른 사람의 블로그와 차별화를 줄 수 있는 것들이 있습니다. 이번에는 네이버 위젯 만들기 입니다. 이번 달에는 신규로 진행하는 브랜드 블로그가 많아서 네이버 블로그 만들기 포스팅이 풍성해지는 것 같습니다.

   

   

네이버 블로그 위젯 만들기

네이버 위젯은 약간의 포토샵을 하기면 어렵지 않기 때문에 따라하기는 데는 크게 문제가 없을 것입니다. 이번에도 수원 하늘토한의원의 네이버 블로그에 설치할 진료시간 위젯을 만들어 보겠습니다.

   

네이버 위젯은 기본적인 규격이 있습니다. 위젯이라고 하지만 간단하게 설명하면 링크배너라고 할 수 있습니다. 포토샵을 처음 접하시는 분들이 가장 먼저 접하는 것이 배너가 아닐까 생각을 합니다.

   

   

1. 네이버 블로그 만들기 -위젯에 쓰일 배너 이미지 만들기

네이버 위젯의 규격은 폭이 170px 입니다. 높이는 크게 문제되지 않기 때문에 폭에 맞추어 작업을 하시면 됩니다.

   

   

저는 작업의 편의를 위해서 폭을 340p로 두 배로 확대해서 작업을 했습니다.

 

   

적당히 로고나 텍스트로 완성을 하실 수 있습니다. 위젯은 html로 만들 수도 있는데 코딩보다는 이미지배너를 쓰는 것이 편합니다.


   

   

2. 네이버 블로그 만들기 - 이미지 올리기

   

간단하게 배너를 만들었습니다. 배너를 만든 후에는 오래된 포스팅에 이미지를 첨부 하시거나 비공개 글에 이미지를 넣으시면 됩니다.

   

이번에는 비공개 포스팅 하단에 이미지를 넣었습니다. 네이버 블로그에 이미지 넣은 방식으로 이미지를 넣으시면 됩니다.

 

   

   

오른 쪽 클릭으로 이미지의 주소를 확인 하실 수 있으니, 주소를 복사해 두시면 됩니다.

   

이미지의 주소를 복사하면 아래처럼 나오는 데 그대로 쓰시면 됩니다.

http://postfiles7.naver.net/20150415_86/skys4205_1429067187663jBlGe_JPEG/n_w_01.jpg?type=w2

   

   

이미지 배너 소스

<img src="복사한 이미지 주소" width=170>

   

완성된 이미지 소스 주소입니다. 주소를 복사하여 위젯의 소스를 만드시면 됩니다.

<img src="http://postfiles7.naver.net/20150415_86/skys4205_1429067187663jBlGe_JPEG/n_w_01.jpg?type=w2" width="170">

   

3. 네이버 블로그 만들기 위젯 등록 방법

   

관리 > 꾸미기 설정 >디자인 > 레이아웃 위젯 설정

 

   

위젯 등록 배타서비스 클릭한 후 미리 준비한 html코드를 붙여놓고 다음을 누르시면 됩니다.

위젯 미리 보기에서 위젯의 모양을 확인 하십시오.

 

   

만들어진 위젯을 원하는 위치로 드래그 하시면 위젯 설치가 마무리됩니다.

   

이제 확인을 해보러 가시면 됩니다.

 

   

   

테두리를 만들지 않아서 조금 불안 했는데 깔끔하게 보여서 좋습니다.

   

   

TIP

이미지 사이즈를 2배인 340px으로 작업하고 보여주는 것을 140px으로 보여주게 했습니다. 덕분에 태블릿이나 HiDPI를 쓰는 환경에서는 매우 선명하게 보입니다. 물론 확대해서 볼 때도 선명해 보입니다.

   

일반 디자인을 하실 때 메뉴에 적용하시면 매우 선명한 메뉴를 만들 수 있습니다.





홍보배너링크

댓글을 달아 주세요

  1.  댓글주소  수정/삭제  댓글쓰기 Favicon of http://miml.tistory.com BlogIcon 세이렌.

    정말 도움이 되는 정보씁니다.여

  2.  댓글주소  수정/삭제  댓글쓰기 Favicon of http://ggng2.tistory.com BlogIcon 헬로끙이

    오호 이렇게 사용하는 거였군요
    덕분에 잘 알아갑니다 ^^

  3.  댓글주소  수정/삭제  댓글쓰기 Favicon of http://datafile.tistory.com BlogIcon 신기한별

    네이버 블로그 위젯 만들기 잘 보고 가요~

  4.  댓글주소  수정/삭제  댓글쓰기 Favicon of http://su1624.tistory.com BlogIcon 도느로

    이 정보는 생각날때마다 꺼내봐야할 알짜 정보같습니다.
    고맙게 잘 알아갑니다 ^^
    편안한 오후되세요~

  5.  댓글주소  수정/삭제  댓글쓰기 Favicon of http://jesus96.tistory.com BlogIcon 하늘마법사

    네이버 블로그 위젯 만드는 방법 잘 알아갑니다^^ 네이버도 도전해보고 싶네요

  6.  댓글주소  수정/삭제  댓글쓰기 Favicon of http://8910.tistory.com BlogIcon 여행쟁이 김군

    좋은 정보 잘 보고 갑니다~
    즐거운 하루 되시길~

  7.  댓글주소  수정/삭제  댓글쓰기 Favicon of http://billnote.net BlogIcon 빌노트

    네이버 블로거들에게 피가되고 살이되는 정보겠네요^^
    잘보고 갑니다!

  8.  댓글주소  수정/삭제  댓글쓰기 Favicon of https://infotaptap.com BlogIcon 톡톡 정보

    네이버 블로그 만드는 법 알아갑니다.
    편안하고 행복한 밤 보내세요^^

  9.  댓글주소  수정/삭제  댓글쓰기 Favicon of http://cloudcorps.tistory.com BlogIcon 구름군단

    네이버블로그... 디자인에 한계성을 느꼈었는데... 이 한계를 뛰어넘어 멋지게 꾸미신 분들이 많이 계시더라구요.^^ 위젯만드는 것 잘보고 갑니다.^^

  10.  댓글주소  수정/삭제  댓글쓰기 Favicon of http://jongamk.tistory.com BlogIcon 핑구야 날자

    위젯을 만들면 여러가지로 유용하겠어요~~

  11.  댓글주소  수정/삭제  댓글쓰기 Favicon of http://bmking2015.tistory.com BlogIcon 달빛천사7

    네이버 블로그 정보 잘보고 갑니다.

  12.  댓글주소  수정/삭제  댓글쓰기 Favicon of http://yahoe.tistory.com BlogIcon 금정산

    에이버블로그 저도 함 만들어야 겠습니다.
    잘 보고 갑니다.

  13.  댓글주소  수정/삭제  댓글쓰기 Favicon of http://miml.tistory.com BlogIcon 세이렌.

    위젯을 만드는 것은 처음봅니ㅅ어여다. 잘봐

  14.  댓글주소  수정/삭제  댓글쓰기 Favicon of http://saygj2.tistory.com BlogIcon 광주랑

    위젯만드는 방법이 의외로 어렵지 않네요 ^^ 보면서 차근차근 따라해보니 쉽게 만들 수 있었어요 ^^ 친절한 설명에 박수를!!

  15.  댓글주소  수정/삭제  댓글쓰기 Favicon of http://zoahaza.net BlogIcon 조아하자

    네이버 위젯으로는 장애인 웹 접근성을 지킬 수 없더군요... 무엇보다도 헤딩태그가 안먹히는 문제가 있어서리...―,.―

    •  댓글주소  수정/삭제 Favicon of http://chunchu.tistory.com BlogIcon 천추

      네 그점은 저도 매우 아쉽습니다. 접근성도 검색에 영향을 주 때문에 네이버에서 제한을 하기 때문에 ... 그건 조금 풀어 주었으면 좋을 텐데요!!