• 해외축구

  • 블로그 : 해외축구, 스포츠 소식 및 가십거리

티스토리 블로그에 파노라마 프로그램으로 만든 파노라마 사진을 올리는 법

티스토리 블로그 팁. 티스토리에 자신이 만든  파노라마 사진을 올리는 법


일단 파노라마 프로그램이 필요합니다. 가장 편한 방법은 사진을 여러번 찍어 자동으로 붙여 주는 프로그램보다 사진을 찍는 동시에 자동으로 한장짜리 파노라마 사진이 "짠~"하고  만들기가 되는 파노라마 프로그램이 좋습니다.   파노라마 프로그램은 직접 찾아서 쓰셔요.. 이런 무책임.. ㅎㅎ 저는 dermandar 라는 파노라마 어플을 사용했구요. 안드로이드 스마트폰용이나 아이폰용 모두 다 있네요.




암튼 이런 저런 방법으로 파노라마 사진을 만드셨나요? 요즘 세상 참 좋아진것 같네요.. ㅎㅎ 아주 오래전에는 자바 애플릿으로 파노라마 돌리고 했는데 이제는 찍고 올리면 끝이라니.. ㅎㅎ


자 이제~~ 파노라마 프로그램을 이용해 만든 사진을 티스토리에 올리는 방법을 소개할까 합니다.^^


파노라마 사진 (3061×450)


위의 사진을 보셔요.~ 이렇게 티스토리 블로그에 올리면 넓이가 초과될 경우 축소되어 원본을 볼 수 없습니다.

짜안~~~ 하지만 아래를 보셔요.  파노라마 사진을 올린 것입니다. 제대로 보이나요?


구글플러스를 통해 올릴 수 있지만, 티스토리 블로그의 높은 자유도를 잘 활용하면 홈페이지에서 여러가지 기능을 잘 활용할 수 있죠? ㅎㅎ 티스토리 블로그를 반응형 블로그로 만들 수 있는 것도 이처럼 js파일 등 기타 자바스크립트 파일을 올릴 수 있도록 배려한 것 때문이 아닐까 하는데요. 아마 블로그 중에서 가장 자유도가 높고, 블로거의 권한을 많이 준 블로그가 아닐까 생각이 드네요. 아이~ 티스토리 좋아 ㅎㅎㅎ



[여주여행] - 여주 미니어처 공원 갑돌이갑순이 세트장 파노라마





티스토리 파노라마 보기  호환성은?


pc에서는 파노라마가 잘 보이고 작동합니다. 안드로이드 스마트폰에서도 잘 되고요, 아이패드 아이폰 계열에서 기본으로 지원되는 사파리로는 파노라마 기능이 잘 안되네요.. ㅠㅠ 아이폰용 구글 크롬에서는 잘 보입니다. pc용으로 보면 하면 잘 보여요.


각종 pc 브라우저에서는 잘 보이는 파노라마 사진.. 스크립트를 막아두는 옵션이 있나요?

아이폰용 사파리에서는 잘 안보임 ㅠㅠ


블로그에 파노라마 사진 올리기


아래처럼 번호 순서대로 따라 하시면 됩니다.


1. 티스토리 블로그 관리자 페이지 > HTML/CSS 편집 > 파일 업로드 탭으로 이동합니다. 아래와 같이 파노라마 사진(제 파노라마 사진명은 pano.jpg)과 jquery.panorama_viewer.js, panorama_viewer.css 파일 (panorama.zip)을 올립니다.



즉, 올린 파노라마사진 1개와 자바스크립트 파일 1개, 스타일시트(css) 파일 1개를 올려요.


panorama.zip

파노라마 사진 관련 파일 받기 (js, css 파일 2개의 압축파일)
또는 http://github.com/peachananr/panorama_viewer 여기로 가셔서 파노라마 뷰어 파일을 받으세요.

 

2.  티스토리 블로그 관리자 페이지 > HTML/CSS 편집 > skin.html 를 찾아가서 아래 처럼 입력합니다.  이것은 입력하기 번거로우니 아래 파일 받아서 필요한 곳(???) 에 자신의 블로그 번호를 넣으세요.. ( 안에 포함된 물음표 번호는 자신의 블로그 소스 보기를 하시면, 알 수있을 것이에요.)

panoramat.txt


위 파일의 내용을 아래처럼 파노라마 <head> 와 </head> 사이에 붙여넣기 하세요.~




3. 포스팅 할 곳에... 파노라마 사진을 불러 오면 끝 납니다. 아래는 파노라마 사진의 경로로 포스팅 글 쓰는 곳에 붙여 넣기 하면 됩니다.  (바로 위의 panorama.txt에 아래 내용이 있으니 그것을 붙여넣기 하세요.)


  <div style="line-height: 1.8;" class="panorama">
 <img src="http://cfs.tistory.com/custom/blog/118/1185141/skin/images/pano.jpg">
</div>


글로 설명하자니 길지만~ 파일 2개(js. css)를 티스토리 블로그에 올리고~ 자신의 파노라마 사진을 역시 올리고.. 경로에 맞게 불러 오면 끝입니다.  (단, 자신의 파일들의 경로는 소스보기를 통해 찾아 내야 합니다... 찾기 쉬운데.. 말로 설명하자니..ㅠㅠ)


도움이 되셨나요??? 아래 하트 꾸욱~~ ㅎㅎ


* 본 포스팅은 사진배경화면 카테고리에 속한 글( 2015. 1. 17. 21:26에 작성)입니다.

NEWS