flickr를 사용하시나요?
블로그도 가지고 계신가요?

그렇다면, flickr 사이트의 사진을 당신의 블로그에 display할 수 있도록 widget을 달아봅시다.



먼저 flickr 사이트로 이동, 로그인은 굳이 할 필요 없습니다.

flickr 둘러보기에서 flickr 서비스를 선택하면 다음 화면이 뜨지요.

사용자 삽입 이미지

flickr나 관련 사이트에서 제공하는 서비스 종류가 무척 많은데, 우리는 이번에는 '그 밖의 자료'를 찾습니다.
'The Great Flickr Tools Collection'을 보면서 과연 얼마나 대단한 tool들이 있는지가 궁금해 집니다.
click해서 이동.

사용자 삽입 이미지

3rdy party tools를 찾습니다.

죽~ scrol해서 내려가야합니다.
아니면 'pictobrowser'를 페이지에서 검색해도 좋습니다.

사용자 삽입 이미지


중간 쯤에서 'Pictobrowser'를 찾을 수 있을겁니다.
설명 그대로 flickr사이트의 사진을 블로그에 display 해 주는 widget 이랍니다.

사용자 삽입 이미지


click해서 들어가면 화면에서 pictobrowser widget을 볼 수 있습니다.

아랫쪽에는 썸네일 사진들이 좌우로 스크롤 하면서 클릭해서 선택해 볼 수 있게 되어있고,
이 경우 사진은 사전에 설정된 확대된 크기로 일부분이 display 됩니다.

사용자 삽입 이미지


마우스를 사진 영역으로 올리면 썸네일은 사라지고, zoom in된 사진을 움직여가면서 볼 수 있습니다.


사용자 삽입 이미지


click하면 다음 사진으로 넘어갑니다.

사용자 삽입 이미지


마음에 드시나요?

그렇다면 이제 본격적으로 위젯을 설치해 보겠습니다.


아래 간단히 설면이 나와있습니다만,
정말로 간단합니다.

사용자 삽입 이미지


먼저, 저 위에 봤던 pictobrowser의 우하단에 흐릿하게 보이는 로고를 클릭합니다.

그리고는 flickr ID를 써 넣습니다. (로그인 ID가 아닙니다. 사용자 이름입니다.)

사용자 삽입 이미지

계속을 누르면 다음 화면에서 본인의 flickr 사진 관리에서 설정해 놓은 set이나 혹은 keyword (Tag)를 선택하게 됩니다.
선택된 set이나 tag의 사진들만 display 되는겁니다.
미지정일 경우에는 빈 자리를 click해서 넘어갈 수도 있는 것 같습니다.

사용자 삽입 이미지

group의 경우에는 flickr에 그룹으로 등록된 사용자들만 선택할 수 있는데, 생략합니다.

다음 화면에서는 본인의 블로그에 올리는 위치에 따라 알맞게 display 되는 모습을 customize할 수 있습니다.
전체 영역의 폭과 높이를 설정하는데, 썸네일 영역은 높이가 고정되어있으니, display 되는 사진의 size를 보면서 알맞은 크기로 설정합니다.

그 외 사진의 display되는 크기, 위치, 배경색 등등을 설정할 수 있습니다.
바로 결과를 보면서 진행하므로 아주~ 쉽습니다.

사용자 삽입 이미지


다 되었으면, 마지막 단계로 html 코드를 복사해서 자신의 블로그에 올리고자 하는 위치에 맞도록 붙여넣기 해 주면 끝나겠습니다.

사용자 삽입 이미지


이렇게 해서 만들어진 pictobrowser의 결과입니다.
요 옆 사이드바에서 볼 수 있습니다.

사용자 삽입 이미지


한번 이렇게 설치를 해 두면, 수정할 일이 생겼을 경우에 flickr 사이트를 통해서 들어갈 필요 없이 위젯에 보이는 pictobrowser 로고를 누르면 그 자리에서 수정이 가능하니 아주~ 편할 것 같습니다.
많이 이용해 보세요~


Daum 블로거뉴스
블로거뉴스에서 이 포스트를 추천해주세요.

신고