파일올려서 경로를 알아 블로그 꾸미기

들어가기 전에

얼마전 댓글에 티스토리 블로그에서 파일의 경로로 물었는데 여기서는 그것에 대해 살펴보고 파일을 블로그에 올려 경로를 알면 블로그 꾸미는데 도움이 될 것 같습니다. 만약 티스토리 블로그에서  스킨을 수정하지 않으면 여기 글이 필요없을 것 같은데 어려우면 간단히 여기 글을 살펴보시기 바라며 나중에 사용할 일이 있으면 하세요.

여기서는 파일의 경로외에 이미지 태그와 링크 태그를 배울 수 있는 곳을 가르쳐 드릴 것인데 여러분이 보시는 저의 블로그에서 아래 그림에서 볼 수 있듯이 두개의 버튼처럼 하려면 이미지 태그,이미지 경로,테이블 태그,A 태그를 알아야 합니다. 아래와 같이 하기 위해 경로와 태그를 알아야 하니 어려울 것 같은데 쉽게 하는 방법은 제가 생각하기로 없습니다.

위처럼 사이드바에 하는 것 말고 저는 스킨을 정말 수정을 많이 하는데 스킨에 특별한 효과를 주기 위해서는 파일 올리는 것과 파일의 경로를 알아야 하는 것은 필수인데 그러지 않으면 블로그를 꾸밀 수 없거든요. 아래 그림처럼 블로그를 꾸미기 위해서 파일이 경로가 어떻게 되는지도 알아보겠습니다.

파일 올리기와 파일의 경로 알기

파일 올리기 : 티스토리 블로그에서 파일 올리기는 스킨 메뉴의 HTML 편집을 클릭한 후 페이지가 나오면 파일 업로드 탭을 클릭하고 아래 그림의 파일 업로드 버튼을 클릭하여 파일을 올리면 무조건 images 디렉토리안에 있게 됩니다. 만약 Edit.jpg라는 파일을 올리면 아래 그림처럼 녹색 박스처럼 images/가 붙어 images 디렉토리에 있다는 것은 잊지 마시기 바랍니다.

파일의 경로알기 1 : 티스토리 블로그에 파일을 올리는 곳을 알았으니 파일의 경로를 알아야 하는데 아는 방법은  http://blog.naver.com/romeo2juliet/140120140311 을 보시면 파일의 경로를 아는 방법을 알 수 있는데 그 페이지에서 설명은 익스플로러로 했는데 파이어폭스 3.4에서는 아래와 그림과 같이 그림 주소 복사를 하시면 됩니다.

파일의 경로알기 2 :  위의 경우는 파일의 전체 경로를 아는 것이고 스킨의 수정시 파일 경로를 반드시 알아야 되는데 스킨 수정시에는 파일 이름만 알면 됩니다. 티스토리 블로그에 올린 파일은  images 디렉토리에 있으므로 스킨에서 파일의 위치는 무조건 ./images/파일명이나 images/파일명을 써주면 됩니다. ./images는 점이 한 개인데 두 개로 착각할 수 있는데 하나이고 어려울 수 있으니 images/파일명으로 아시기 바랍니다. 아래 그림을 보듯이 저는 파일의 위치를 ./images/라고 했는데 ./images/ 대신에  images/라고 해도 됩니다. 이것은 저에게만 해당되는 것이 아니라 여러분 모든 분께 해당되니 HTM/CSS 편집에서 스킨 수정시 올린 파일의 위치는 무조건 ./images/파일명이나 images/파일명이 됩니다. 그렇다고 글쓰기시 파일의 위치가 ./images/파일명이나 images/파일명이 되지 않고 그런 경우는 위 처럼 해야 합니다. 참고로 경로는 http://jjackq.tistory.com/89 보면 이해가 될텐데 ./images은 images와 같은데 더 정확한 표현이라고 하네요.

파일 경로 알기2를  그림으로 나타내면 아래와 같이 간단합니다.참고로  아래는 워드 2007의 SmartArt로 만든 것입니다.

image 태그와 a 태그 알기

올린 파일의 경로와 HTML 태그에서 image 태그를 알면 페이지나 사이드바 등에 이미지 위젯을 만들 수 있습니다. 이미지 태그만 설명한 것은 http://blog.daum.net/y-tour/3118697 를 보시고 이미지 태그와 이미지에 링크거는 방법은 http://sys610.tistory.com/244 을 보시면 됩니다. 이왕이면 이미지 태그도 알고 이미지에 링크거는 법도 알아 두시기 바랍니다.

정리하며

• 스킨 수정할 때 티스토리 블로그에 올린 파일은 무조건 images 폴더에 위치해서 스킨에서의 경로는 무조건 images/파일명입니다 블로그를 꾸미기 위해서는 태그도 잘 알아야 되지만 파일을 올리고 파일의 경로도 알아야 합니다.
• 아래 동영상을 보면서 티스토리 블로그에 파일을 올리고 파일의 경로를 안 후 글쓰기에 태그로 불러오는 것을 볼 수 있습니다. 참고로 아래 동영상은 캠타시아(camtasia) 7로 만들었습니다.

• 스킨을 수정할 수 없는 다음 블로그와 네이버 블로그에는 파일 올리기가 없습니다. 또 아셔야 하는 것은 네이버 블로그의 경우는 네이버내에서만 파일의 링크를 가져가면 이상이 없으나 네이버를 벗어나면 엑박이 걸리므로 네이버 블로그는 외부링크를 지원하지 않는다는 것을 알아두세요. 다음 블로그의 경우는 외부링크를 지원합니다.