티스토리 팁-티스토리의 무한계정을 이용해보자. (파일 업로드 주소 따기)



티스토리의 가장 큰 장점 중에 하나가 웹상의 저장공간을 무한대로 제공한다는 것입니다. 사진을 몇 천개를 올리던, 음악 파일을 몇 천개를 올리던 티스토리는 묵묵히 저장공간을 제공하며, HTML 태그로 그 사진과 음악 파일을 접근 할 수 있게 해줍니다. 물론 하나의 파일에 용량 제한이 걸려있어 20MB 이상의 파일은 업로드 할 수 없습니다. 하지만 20MB라면 고화질의 사진을 업로드 할 수 있으며 음악파일의 경우 고음질의 음악파일을 제공할 수 있습니다. ( 동영상의 경우는 인코딩을 다르게 하거나 해야 하지만 일반적으로 고화질을 제공하기는 어려울 것 같습니다. )


지난번 포스트에서 HTML/CSS 편집하기와 파일 업로드에 대해서 배웠는데요.

2010/09/14 - [블로그/블로그팁 - 연재] - 티스토리 초보팁 20편 - HTML/CSS 편집을 이용한 블로그 스킨 수정

파일업로드 부분에서 파일을 업로드하고 그 파일을 가져다 쓰는 방법을 설명하지 않았네요. 오늘은 그 파일을 가져다 쓰는 방법, 그러니까 HTML 태그에서 src 속성이나 href 속성에 사용할 수 있는 URL 을 따오는 방법을 알아보겠습니다.


업로드한 파일 가져다 쓰기

티스토리 초보팁 20번째 팁에서 스킨 편집을 위한 파일 업로드 기능이 있음을 배웠는데요. 깜빡하고 업로드한 파일의 URL을 따올 수 있는 방법을 설명 안 해드렸네요. ( 한 블로거 분께서 비밀글로 조언을 해주셨습니다. 감사합니다. ( -- )( __ )( -- )


파일 업로드 메뉴를 들어가보면 위와 같이 되어 있습니다. 현재 스킨에서 사용중이거나 여러분이 업로드 해 놓은 파일들의 목록이 보입니다. 하지만 이 파일에 어떤 경로로 접근해야 하는지는 나오지 않습니다. 파일 목록에서 우클릭을 해서 속성보기를 해봤자 해당 파일의 경로가 아니라 파일업로드 페이지의 경로만 볼 수 있죠..

손수 제작한 배너를 스킨 상단에 배치하고 싶어도 이걸 가져다 쓸 방법이 없으니 있으나 마나한 기능입니다. 하지만 방법이 있습니다. ( 치환자로 어떻게 할 수도 있을 것 같지만 약간은 다른 방법을 이용해 보겠습니다. )


파일 업로드 탭에는 업로드한 사진의 미리보기를 지원합니다. 확장자가 gif 인 파일을 아무거나 선택해보면 미리보기 화면에 해당 사진이 출력되는 것을 볼 수 있습니다. 이 미리보기 기능을 이용해서 '파일업로드'를 이용해서 업로드한 파일이 어디에 저장되는지 알 수 있습니다.


대충 목록에서 그림 파일 하나를 선택하면 미리보기 쪽에 그림 파일의 미리보기 항목이 있는 것을 볼 수 있습니다.
미리보기에 띄워진 그림파일에서 우클릭을 한다음 속성(R)을 클릭합니다. ( 파이어폭스 사용자 여러분은 '그림 정보보기' 가 되겠죠. )


그러면 '주소(URL)' 라는 항목에 복잡한 주소가 뜨는 것을 볼 수 있습니다. 이게 바로 '파일 업로드'에 올려진 파일들의 주소입니다.
재미있는 사실은 '파일 업로드' 페이지에서 볼 수 있는 모든 파일의 주소에서 'http://cfs.tistory.com/custom/blog/10/100974/skin/' 부분까지 똑같다는 것입니다. ( 마지막에 나와있는 preview.gif 를 제외하고는 모두 /images/ 까지 똑같죠. )

물론 앞으로 여러분들이 업로드 할 모든 파일들도 다 같은 경로에 업로드가 됩니다. 이를 이용하면 사진 뿐만아니라 플래시 파일, HTML 문서, 동영상 파일 등도 업로드를 해서 가져다 쓸 수가 있습니다.

모든 파일들이 같은 경로, 즉 'http://cfs.tistory.com/custom/blog/10/100974/skin/'에 있는 것을 볼 수 있는데요.
중간에 100974 라는 부분이 아마도 티스토리 내부에서 블로그를 구분할 수 있게 해주는 ID 같은 건가 봅니다.



시험삼아 올려보기

그럼 시험삼아 파일을 하나 올려보고 링크를 시켜 보겠습니다.
간단한 HTML 파일을 하나 작성해서 올려보도록 하겠습니다.

<!-- 파일 업로드 테스트 -->
<html>
<head>
   <title>여러분의 무한계정!!</title>
</head>
<body>
   안녕하십니까? 여기는 티스토리의 업로드 공간에 올려져 있는 문서입니다.!!!<br />
  <a href='http://plusblog.tistory.com/457>다시 돌아가기</a>
</body>
</html>

이와 같은 HTML 파일을 작성한 다음 업로드를 해보겠습니다. 편의상 파일이름은 aaa.html로 하겠습니다.
파일 업로드를 이용해서 파일을 업로드하면,


업로드 된 파일 목록에 aaa.html 이라는 항목이 생긴걸 볼 수 있습니다.
업로드 된 aaa.html 파일역시 다른 파일들과 마찬가지로 'http://cfs.tistory.com/custom/blog/10/100974/skin/' 까지는 동일한 주소를 갖고 그 다음에 images/aaa.html 이라는 추가적인 주소가 됩니다. ( 즉 업로드한 aaa.html 파일은 'http://cfs.tistory.com/custom/blog/10/100974/skin/images/aaa.html' 이라는 경로로 접근을 할 수가 있다는 말입니다. )


업로드한 파일의 경로로 따라가보니 HTML 문서 하나가 열리는 것을 볼 수 있습니다. ( 인코딩 설정을 안 해놔서 이상한 문자가 뜰텐데 인코딩을 한국어로 바꾸어 주시면 제대로 보입니다 ^^ )

aaa.html 보러가기

이렇게 티스토리에서는 스킨을 편집 할 수 있도록 블로거분들에게 무한 계정을 제공하고 있습니다. 여러분들이 직접 만든 배너나 플래시 파일( 플래시 게임이라든지 아니면 위젯 어플리케이션 등.. ) 등도 이곳에 업로드를 하고 이처럼 주소를 따와서 블로그에 게재, 혹은 링크를 걸 수 있습니다.

어떤가요? 이 정도면 티스토리 블로그 참 편하지 않나요?? ㅎㅎ


+ Recent posts