"정보" 티스토리 꾸미기(기본 스킨 적용편)

 

 

티스토리를 처음 만들면 네이버 블로그랑 느낌이 많이 달라 어렵게 느껴지는거 같아요.

 

물론 네이버도 처음 만들면 어렵게 느껴지긴 하지만...

기능이 대체로 단순한 편이라 익숙해 지면 딱히 어려운 부분이 없조.

수정하고 변화 줄수 있는 부분도 한정적이라 스킨도 다들 비슷비슷하고..

 

하지만 티스토리는 html를 직접 수정하면서 더 다양하게 만들 수 있기에...

네이버 블로그와 다르게 상당히 복잡하고 어려운 부분이 있는거 같아요.

 

오늘 설명하는건 블로그 꾸미기의 기본 내용이기 때문에

네이버 블로그 꾸미 듯 누구나 쉽게 할수 있는 내용들이에요.

 

다음 포스팅엔 html을 사용해서 좀더 나만의 느낌을 담아 꾸밀 수 있는 방법도 설명해 드릴께요~

 

 

 

 

티스토리를 처음 만들면 요런 기본적인 스킨이 제공되요.

기본 스킨이지만 네이버 블로그와 다른점이 있조.

바로 반응형 스킨이라는 점이에요.

 

반응형에 대해서는 추후 설명드릴께요~

 

 

 

 

관리를 클릭해서 들어가면

 

 

 

 

이렇게 블로그를 꾸밀 수 있는 관리자 페이지가 나와요.

대체적으로 한번씩 읽어보면 간단하게 설정할 수 있는 것들이에요~

 

화면출력은 화면에 보여주는 내용들을 설정하는 곳이에요.

몇개의 글을 보여줄 것이고 최대 몇개의 댓글 등을 보여줄 것이냐 뭐 그런것들..

 

참.. 티에디션은 반응형 스킨 사용시 제대로 지원이 안되요!

티에디션은 사용안하시는게 좋아요~

고정스킨인 경우 사용하셔도 무방하구요~

 

 

 

 

글 설정 이라는건

글쓸때 최대 가로폭을 어느정도 까지 할것이냐 라는건데..

설정해 논 가로폭에 맞게 이미지도 최대폭이 정해지는 거에요.

 

전 900px로 했어요.

사진이 너무 작게 들어가도 답답한 감이 있어 전 크게크게 올리는 편이라...ㅎㅎ

 

 

 

 

블로그에 맞게 카테고리 추가를 하면 되요~

주제 분류 설정을 해둔 후 포스팅을 하게되면 해당 카테고리 설정 시

 자동으로 분류가 선택되기 때문에 글쓸때 마다 분류를 지정하지 않아도 되요!

 

사실 이정도만 설정해두고 포스팅을 해도

깔끔하고 심플한 블로그를 운영할 수 있답니다.

하지만 스킨만 바꿔봐도 블로그 분위기가 확~ 바뀌기 때문에

스킨 바꾸기까지 도전~~

 

 

 

 

티스토리의 주요 기능이 꾸미기라는 부분인데...

HTML/CSS 편집 기능을 잘 활용하면 정말 다양하게 블로그를 꾸밀 수 있어요.

요 기능이 티스토리의 가장 큰 매력이라고 할수 있조.

 

하지만 해당 기능을 사용하려면 어느정도의 전문지식은 필요해요.

기본적으로 html과 css를 조금이라도 알고 있어야 간단하게라도 수정을 할수 있어요.

 

모든 내용을 자세히 설명할 순 없지만

초보들도 나만의 느낌을 블로그에 조금씩 담을 수 있도록

 최대한 쉽고 간단하게 필요한 부분만 포스팅 해볼 생각이에요.

 

만약 원하는 수정 포인트가 있다면 댓글 남겨 주세요.

포스팅 시 참고하여 최대한 알려드릴께요~

 

이번 포스팅에서는 기본으로 제공하는 스킨을 블로그에 적용하는 방법을 설명할께요~

 

 

 

 

일단 가장 손쉽게 블로그를 꾸밀 수 있는 방법 중 하나는 스킨바꾸기!

 

스킨으로 들어가면 다양한 스킨들을 제공하고 있어요.

제공되는 스킨들을 보면 반응형 스킨도 있고 고정 스킨도 있고..

레이아웃도 각기 다른 형태라... 꽤 다양하게 선택할 수 있조.

 

원하는 형태의 스킨을 발견했다면 적용 버튼을 클릭하면 끝!

스킨 바꾸는건 정말 쉽조? 누구나 간단하게 할수 있어요.

 

여기서 잠깐~~~ 반응형이 무엇이냐?

정말 자세히 설명하자면 너무 길어지기 때문에 딱 집어 간단하게만 말할께요!

 

pc에서 익스플로러 창을 가로방향으로 줄이다 보면

 디자인이 세가지 형태로 살짝씩 바뀌는걸 볼수 있을꺼에요.

그 세가지 형태를 쉽게 pc , 테블렛 , 모바일 용이라고 보면 되고,

그렇게 바뀌는걸 반응형이라고 해요.

 

 반응형 스킨이 아닌 경우 가로방향으로 줄여봐도 별 반응이 없어요.

그런걸 고정스킨이라고 보면 되구요.

 

 

 

 

고정스킨을 사용하려면 모바일웹 스킨은 ON

반응형 스킨을 사용하려면 모바일웹 스킨은 OFF하면 되요.

 

반응형 스킨은 모바일웹을 사용하지 않아도 모바일에 맞게 잘 나오지만

고정스킨은 모바일웹을 사용해야만 모바일에 맞게 볼수 있어요.

 

 

 

 

저는 이번에 새롭게 추가된 반응형 스킨 #2를 적용해봤어요.

딱히 한게 없지만 깔끔하니 맘에드네요~

 

 

 

 

반응형 스킨을 적용한 후 익스플로러 창을 가로방향으로 줄여보면

이미지와 같이 세가지 형태로 디자인이 바뀌는걸 확인할 수 있어요.

PC, 테블렛, 모바일 각기 최적화 된 디자인으로

블로그를 볼수 있게 제공하기 때문에 반응형 스킨 사용 시

모바일웹 스킨을 사용하지 않아도 되는것이조.

 

 

 

 

기본 스킨에서 이미지만 간단하게 바꿔보고 싶다면 html/css편집 클릭!

 

 

그럼 위와같은 창이 열릴꺼에요.

다른건 전혀 수정하거나 바꿀 필요 없고~

 

 

 

 

파일업로드를 클릭하세요!

 

그럼 해당 스킨에서 사용된 이미지들을 볼수 있어요.

배경스킨으로 사용된 이미지를 찾은 다음

이미지 명만 똑같이 맞춰 새로운 이미지를 추가해주면 됩니다.

 

해당 스킨의 경우는 배경이미지 명이 images/header_default.jpg << 되어있네요.

그럼 이미지 명을 images/header_default.jpg 라고 할것이냐? 노노!!

images/  << 요부분은 빼고 header_default << 요 부분이 이미지 명이 되는거에요.

이미지 형태가 .jpg << 되는거구요.

 

즉 header_default 라는 이름의 이미지를 jpg 형태로 추가하면

자동으로 배경이미지가 바뀌는 것이조.

 

이미지를 추가한 후 블로그 화면에서 F5를 클릭하면 추가된 이미지로 바뀐걸 확인할 수 있어요.

 

 

 

 

요렇게!

배경 이미지만 바뀌어도 블로그 전체 느낌이 달라지는거 같조?

이미지만 바꿔줘도 느낌히 확 바뀌기 때문에

굳이 어렵게 html을 수정하며 꾸밀 필요는 없어요.

 

하지만 블로그를 운영하다 보면 좀더 나만의 느낌을 살리고 싶다 하는 순간이 오거든요.

그럴때 살짝씩 공부하며 바꿔보는것도 또다른  재미인거조~

 

 

 

 

요건 제가 지금 사용하고 있는 스킨이에요.

 

기본으로 제공하는 #2 라는 반응형 스킨을 적용한 후

필요한 부분만 살짝씩 수정해서 요런 느낌으로 꾸며 본 것이조.

 

 

 

 

두가지 모두 기본으로 적용한 스킨은 동일하지만

html을 살짝 바꿔 줌 으로써 완전 다른 분위기가 나오니...

어려워도 공부하며 고쳐 볼 가치는 있는거 같지 않나요?

 

포인트 포인트를 집어 초보들도 간단하게 고쳐볼 수 있도록

포스팅을 할 예정이니 도전해 보세요~~~

 

* 궁금한 부분이 있으면 댓글 남겨주세요.

포스팅을 통해 최대한 알려드리겠습니다. *

 

 

 

티스토리 꾸미기