티스토리 블로그의 가장 큰 특징들 중에 하나는 뭐니뭐니 해도
블로그 스킨을 블로거 마음대로 조정할 수 있다는 점이다.
그런데 그건 웹제작 기술이나 태그 등을 잘 이해하는 사람들에게나
해당되는 말일 뿐이고.....웹제작 기술 커녕 태그가 무엇인지도 제대로 모르는 일반인들에겐 그건 그야말로 그림의 떡일 뿐이다.
그래서 티스토리 초대장을 받아 놓고서도 자기 블로그 스킨들을
도대체 어떻게 구성해야 할지 몰라 황망해하는 분들이 많다.
사실 나 자신 조차도 처음에 그래서 티스토리 블로깅을 포기했다가
재차 초대장을 받아 겨우 블로그 초기화면을 만들어 현재 운영 중이다.
그런데.....테터데스크라는 플러그인 툴을 활용하면 태그를 잘 모르는
일반인들도 쉽게 블로그 화면 구성을 할 수 있기에
그런 초보자 분들을 위해 그 방법을 소개하고자 한다.
우선, 티스토리 초기화면에 가서 내블로그 만들기를 클릭하여
새로운 블로그를 하나 만들어 보자.
예컨데, 아래와 같이 2단형 구조의 Magazine 스킨을 선택했다고 하자.
블로그를 만들면 아래와 같은 축하 화면이 뜨는군요.
그러면 이제 방금 새로 만든 블로그로 가보기로 하지요.
방금 만든 새 블로그에 가보니......아래와 같은 황당한 화면이 뜨는군요.
그래서....[글쓰기] 및 [관리자] 탭이 어디 있나 찾아 보았더니...
맨 아래 줄에 영어로 되어 있군요.
일단 설명을 쉽게 하기 위해 [WRITE] 탭을 눌러 글쓰기 창을 연 다음
아무 기사나 퍼다가 채워 보겠습니다.
10개의 글을 채워 넣었더니....아래와 같은 모습이 되는군요.
즉, 글들이 순서대로.....일렬로 죽~ 이어지는 모습입니다.
그러면 이제 맨 아래에 있는 [관리자](ADMIN) 탭을 눌러 관리자 창으로 가보겠습니다.
먼저 [카테고리 설정] 탭을 눌러 카테고리들 부터 지정해 주겠습니다.
[최고 미모] 및 [미코 과거 사진]이라는 두 개의 게시판을 만들어 두었습니다.
그리고 카테고리가 [노란 폴더] 형으로 보이도록 설정했습니다.
그런 다음 반드시 [저장] 단추를 눌러야 변경된 내용이 저장됩니다.
그런 다음 이제 [플러그인 설정] 탭을 눌러 살펴보겠습니다.
[플러그인 설정]에서.....[꾸미기] 탭을 클릭하니
맨 아래 쪽에 [테터데스크(첫페이지 만들기)] 항목이 보이는데....
아직 설정(=활성화) 되어 있지 않군요.
그래서 이제 그것을 이용하기 위해 맨우측 가장자리에 있는 톱니 모양의 설정탭을 클릭하여 활성화 시켜두어야 합니다.
위에 보니....이미 모든 것이 제대로 표기되어 있군요.
이제 우리는 [확인] 단추를 클릭하기만 하면 됩니다.
그런데....참고로 말하면....
테터데스크 기능을 단지 초기화면 구성에만 이용할 수 있는 것이 아니라... 블로그 각 글들의 상단이나 하단에만 그 기능을 적용시킬 수도 있다는 점입니다.
그런데 내가 테터데스크를 활용하는 이유는.....
블로그를 생성된대로 그냥 두면 블로그 글들이 글쓴 순서대로
그냥 죽~ 이어지게 됩니다.
나로서는 블로그의 그런 모양이 매우 싫습니다.
그래서 글들이 각 제목별로 나타나도록 하거나 또는
좀 다른 형태로 보여주고자 할 때
바로 테터데스크 기능을 이용하는 것이지요.
이제 블로그 초기화면으로 되돌아가기 전에
[글목록] 탭을 눌러 글들을 두 개의 게시판들에 각각 5개씩 나누어
분류해두고 나가도록 하지요.
그런 다음 맨위 좌측에 있는 [블로그로] 탭을 눌러
블로그 초기화면으로 한번 가보기로 하지요.
각 글들이 두 개의 게시판들에 각각 5개씩 나뉘어 들어가 있군요.
그리고.....우리가 이용하고자 하는 [테터데스크] 설정 툴이
우리를 기다리고 있군요.
이제 우리는 그것을 클릭해 봅시다.
맨 우측에 [아이템배치], [디자인 선택] 등등의 탭들이 보이는군요.
뉴스사이트형과 갤러리형 모두 4가지 종류가 있군요.
그 중에 이미 선택되어 있는 [뉴스사이트형(밝은 배경)]을 선택하기로 하지요.
그런 다음....맨 밑에 있는 [적용하기]가 아니라....[저장하기] 탭을 누르니 다음과 같은 화면이 나오는군요.
자세히 살펴보면......현재는 자기멋대로 위와 같이 아이템들을 설정해 두었군요. 물론, 그것들을 모조리 삭제해 버릴 수 있는 단추도 있군요.
그리고 각 아이템들을 위나 아래로 이동시킬 수 있는 단추도 보이고...
그래서.....우리는 일단 모조리 삭제해 보기로 합니다.
그런 다음.....우리 마음대로 아래와 같이 선택하여 배치하기로
해보겠습니다.
자기가 선택하고자 하는 아이템들을 하나 또는 동시에 여러 개를 선택한 다음 맨 밑에 있는 [아이템 배치하기] 단추를 눌러 배치하면 됩니다.
그런데 우리는 맨 밑에 있는 [HTML 입력기]를 맨 위로 한번 올려 보기로 하지요. (그건 각 상자 우측 상단에 있는 올리기 단추를 이용하면 됩니다.)
그런 다음 맨위 우측 상단의 [적용후 닫기]를 이용하여
이제 블로그 초기화면으로 다시 돌아가 보겠습니다.
설정 및 삭제 등 조작을 잘못해도.....원래의 블로그 글 자체에는
하등의 영향도 없습니다. 그러니 마음놓고 조작해도 됩니다.
위 아이템들은 단지 원래의 블로그 글들을 도대체 어떤 방식으로
초기화면에 보여주고자 하는지를 결정하는 것 뿐입니다.
따라서 만일 잘못 배치했다면.....간단히 삭제하고 다시 배치하면 될 것입니다.
그리고.....[포스트] 형이란....수많은 블로그 글들 중
자신이 독자들에게 보여주고자 원하는 글들만을 선택해서
보여주는 기능입니다.
[최신글] 형이란....글들을 자신이 선택할 수 없고
단지 글쓴 순서대로 최신글이 먼저 나타나도록 자동화 되어 있는 기능입니다.
그리고.....[HTML 직접입력]이란.....태그를 아는 분들이
자기 마음대로 화면을 꾸밀 수 있도록 하기 위한 기능입니다.
(태그에 대해서 모르시는 분들은 간단히 구글검색 등을 하면
그것을 가르쳐주는 사이트들이 무수히 많습니다.
물론, 그것들 전부를 공부할 필요는 없고, 단지 자신이 원하는 기능만
찾아 이용하면 그 뿐이겠지요.)
그러면 이제 [포스트] 형의 설정탭을 눌러
글들을 한번 배치해 보도록 하지요.
(1단으로 할 것인지, 2단으로 할 것인지 및 섬네일 크기 등등에 대하여
자신이 적당히 선택할 수 있을 것입니다. 단, 그런 변경 후 [설정변경하기] 탭을 눌러 저장해 주어야 합니다.)
하여튼, 여기서는 위와 같이 두 개의 글을 선택하였습니다.
그런 다음 [배치하기] 탭을 누르고, 이어서 맨 위 우측의 [적용후 닫기] 탭을 눌러 빠져 나옵니다. (주의: 맨 밑의 [적용하기] 탭은 나는 전혀 이용하지 않습니다.)
그랬더니.....아래와 같이 설정되었군요.
(참고: 우리는 똑같은 내용의 글을 퍼다가 올렸습니다.
그런데도 우측의 글에는 그림(=섬네일)이 보이고
좌측의 글에는 그런 그림이 안보이는군요.
그 이유는 우측의 글을 올릴 때는 [사진] 올리기 기능으로
티스토리 서버에 그림을 올렸기 때문이고......
좌측의 글을 올릴 때는 그렇게 하지 않고 그냥 마우스로 북~ 퍼다가
그림까지 함께 올렸기 때문에....그 그림은 티스토리 서버에 없기
때문입니다. 즉, 그 그림은 단지 원래 퍼온 페이지의 서버에 링크된
그림에 불과합니다)
암튼, 이번엔 [최신글] 형을 설정해 보도록 하지요.
아래 화면을 보시면....자신이 무엇무엇들을 선택해서 설정할 수 있을지
아마 쉽게 알 수 있을 것입니다.
나는 일단 위와 같이 선택하여 설정하고, 그것을 [저장하기] 한 다음
[적용후 닫기] 탭을 누르고 블로그 초기화면으로 다시 빠져나왔습니다.
2단형과 3단형 글 배치의 차이가 무엇인지 아마 잘 알 수 있을 것입니다.
그리고 최신형 글배치에 있어서도 그림이 나오는 글들과 안나오는 차이도
이미 위에서 설명한 바 있습니다.
즉, 그림이 나오도록 하려면.....글쓰기 창의 [사진] 올리기 기능을 이용하여 그림을 올려 티스토리 서버에 그림파일을 저장해야만 합니다.
그래서.....이번엔 [그림파일]을 이용하여 [HTML 직접입력] 아이템을
활용하기 위해 먼저 그림파일을 티스토리 서버에 올려 보도록 하지요.
물론, 그 그림은 이미 자신의 컴에 저장되어 있어야 합니다.
(가능한 파일이름을 영문으로 만들어 두는 것이 좋습니다.
여기서는 그냥 1.jpg 파일로 만들어 두었습니다.)
그림파일을 서버에 올리려면....먼저 [관리자] 창으로 가야 합니다.
이 블로그에서는 맨 아래 [admin] 탭을 누르면 되겠지요.
관리자 창에서....먼저 맨 좌측의 HTML/CSS 편집 탭을 클릭하고
그 다음 [파일업로드] 탭을 누르면....이미 많은 그림파일들이
이 블로그를 위해 들어 있음을 볼 수 있군요.
거기에 [추가] 단추를 눌러 자신의 컴에서 올리고자 하는 그림을 찾아
올려 보도록 합시다.(여기서는 1.jpg)
그림을 올렸으면...이제 그것을 파일창에서 찾아 봅니다.
그랬더니 저 위쪽에 [images/1.jpg] 라고 있군요.
거기에 마우스 커서를 대고 오른 클릭을 하면...아마 그 그림파일 주소를
복사할 수 있게 되어 있을 것입니다. 그것을 복사한 다음
블로그 초기화면으로 갑니다.(맨위 좌측의 [블로그로]라는 단추를 누르면 되겠지요)
그런 다음 다시 테터데스크의 [설정하기]를 누르면.....
[html 직접입력] 아이템을 설정할 수 있겠군요.
태그를 지금 당장 모른다고 해서.....걱정할 일 전혀 없습니다.
왜냐면 [태그] 또는 [태그 공부방]이라는 검색어로 검색해보면....
그런 것은 무수히 많이 찾을 수 있을테니까요.
그렇다고 그런 것을 모조리 공부할 필요는 없는 것이고....
예컨데, [그림 올리기 태그] 라는 검색어로 찾아보거나
또는 [글자색 조정 태그]라는 검색어로 찾아 자신이 필요한 것만
찾아 쓰면 그 뿐입니다.
하여튼......[저장하기] 단추를 반드시 눌러서 저장해 두어야만 합니다.
그런 다음 맨위 우측의 [저장후 닫기] 단추를 눌러 초기화면으로
가봅시다.
아직도 설정을 계속할 수 있도록 되어 있으나....우리 작업은 이제 다 끝났으므로 맨우측 상단의 테터데스크 툴의 [첫페이지 만들기] 단추를 누른 다음 마지막으로 [블로그 홈으로 가기] 단추를 눌러 테터데스크 작업을 끝내도록 하지요.
그랬더니....아래와 같은 최종화면이 되는군요.
참고로.....
위 테터데스크 아이템들은 몇번이고 반복해서 사용해도 상관없습니다.
예컨데, [HTML 직접입력] 아이템을 적당한 위치에 몇개를 사용하든
전혀 상관이 없습니다.
그건 각자 알아서 필요에 따라 결정할 일이지요.
또는 아래와 같이 아주 약간 변화를 줄 수도 있습니다.
즉, 맨위 태그줄을 복사하여, 맨 밑에 추가해 준 것이지요.
다만, 나타날 글자와 글자색만 변경했습니다.
그랬더니.....아래 화면이 되는군요.
기타, 스킨 수정을 하고자 한다면......필요한 것이 무엇인지 잘 생각해보고 그것을 어떤 검색어로 찾아보는 것이 좋을지를 결정하여 검색해 보면 됩니다.
예컨데, [블로그 제목 그림 올리기] 또는 [블로그 제목 크기 조정] 등등....
(뱀발)
참고로.....
방금 위에서 만들어 둔 새 블로그에서는 [관리자](ADMIN)과 [글쓰기](WRITE)이 블로그 맨 밑줄에 있어서 사용하기에 매우 불편합니다.
그래서....관리자창과 글쓰기창을 쉽게 찾을 수 있도록 만들어 보겠습니다.
먼저 맨 아래에 있는 [ADMIN]을 눌러 관리자창으로 갑니다.
그런 다음 좌측 항목들에서 [화면설정] 탭을 클릭합니다.
그런 다음 아래 화면에서와 같이 [메뉴] 탭을 클릭합니다.
거기서 아래 화면에서와 같이 기본메뉴에서 [관리자]를 찾아 설정하고
메뉴명에 [관리자] 등 적당한 이름을 지정해 줍니다.
글쓰기 창도 마찬가지로 만들어 줍니다.
그런 다음 오른쪽에 이미 들어가 있는 항목들 중 불필요한 것들을
모두 없애 버리기로 합니다. 나는 홈과 방명록 단추만 남기고
모두 삭제해 버렸습니다.
그런 다음 반드시 [저장] 단추를 눌러 변경 내용을 저장시킨후 블로그 초기화면으로 돌아가 보면.....아래와 같이 블로그 상단에 관리자, 글쓰기 메뉴가 새롭게 설정된 것을 확인할 수 있습니다.
이제는 관리자창과 글쓰기창을 찾고자 블로그 맨 아래 줄을 살펴볼 필요가 없어졌군요.
'IT, 프로그래밍, 웹제작 관련 > 티스토리 스킨 수정, 편집' 카테고리의 다른 글
자신의 티스토리 블로그에 구글 웹사이트 번역기 달기 (0) | 2013.08.31 |
---|---|
티스토리 블로그 초기화면 만들기 - 테터데스크 이용 (3) | 2012.07.08 |
스크롤 상, 하단으로 이동하기, 홈으로 이동하기 버튼 달기 (1) | 2012.04.21 |
다음뷰 추천버튼(손가락) 어디에든 자기가 원하는 위치에 넣어 달기 방법 (4) | 2012.04.10 |
저서(전자책)입니다. 일독을 권합니다.
자세한 설명
감사합니다.
많은 도움받고 갑니다
설명 감사해요 ~