본문 바로가기
초보블로그 티스토리 운영가이드

HTML/CSS 몰라도 쉽게 티스토리 스킨 수정하는 팁 ( 초보자 가이드)

by 나완1219 2025. 4. 26.

 

티스토리 블로그를 운영하다 보면 블로그를 좀 더 내 스타일에 맞게 꾸미고 싶어집니다. 하지만 HTML이나 CSS를 잘 모른다면 막막할 수 있죠.

다행히도 티스토리에서는 초보자도 코드 수정 없이 스킨을 편집할 수 있는 방법이 많이 마련되어 있습니다. 이번 글에서는 HTML/CSS를 몰라도 누구나 쉽게 블로그 스킨을 수정할 수 있는 팁을 차근차근 소개해드리겠습니다.

HTML/CSS 몰라도 쉽게 티스토리 스킨 수정하는 팁 ( 초보자 가이드)

1. 티스토리 스킨 편집 기능 이해하기

티스토리의 기본 스킨 에디터는 코드 편집 외에도 비주얼 모드를 제공합니다. 이 모드를 이용하면 마우스 클릭만으로 색상, 폰트, 메뉴 위치 같은 기본 요소를 변경할 수 있습니다.

비주얼 모드 진입 방법

  1. 티스토리 관리자 페이지 접속
  2. 꾸미기 > 스킨 편집 클릭
  3. 상단 메뉴에서 ‘디자인 편집(비주얼 모드)’ 선택

TIP: 비주얼 모드는 실시간 미리보기를 지원하므로, 변경사항을 즉시 확인할 수 있어 초보자에게 매우 유용합니다.

2. HTML/CSS 몰라도 수정 가능한 대표 항목

비주얼 모드를 통해 수정 가능한 항목은 생각보다 다양합니다. 아래 주요 항목을 활용하면 블로그 분위기를 확 바꿀 수 있습니다.

  • 배경 색상 및 이미지 변경
  • 글자 폰트, 크기, 색상 변경
  • 타이틀, 메뉴, 푸터 편집
  • 사이드바 위젯 설정
  • 썸네일 크기, 목록형/카드형 스타일 선택

주의: 모든 스킨이 비주얼 모드를 100% 지원하는 것은 아니므로, 가능한 한 ‘스킨 옵션 제공’ 문구가 있는 스킨을 사용하는 것이 좋습니다.

3. 스킨 기본 설정으로 수정하는 방법

복잡한 코드를 건드리지 않고, 기본 설정만 조정해도 충분히 깔끔한 블로그를 만들 수 있습니다.

수정 방법 예시

  1. 관리자 페이지 → 꾸미기 > 스킨 편집
  2. ‘스킨 설정’ 탭 클릭
  3. 메뉴에서 변경할 항목 선택
  4. 값 입력 또는 선택 후 저장

주요 설정 항목

  • 배경 색상 변경 → 블로그 전체 분위기 설정
  • 글자 크기 및 폰트 변경 → 가독성 강화
  • 타이틀 로고 이미지 등록 → 브랜드화 효과
  • 포스트 목록 스타일 변경 → 카드형, 리스트형 등 선택

TIP: 글자 크기는 모바일 기준 16px 이상, 배경색은 흰색 또는 밝은 톤을 유지하는 것이 가독성과 SEO에 유리합니다.

4. 플러그인 활용으로 기능 추가하기

티스토리에는 기본 기능 외에도 플러그인을 이용해 다양한 기능을 추가할 수 있습니다.

플러그인 설정 방법

  1. 티스토리 관리자 → 플러그인 메뉴 클릭
  2. 원하는 플러그인 활성화
  3. 설정 후 블로그에 적용

추천 플러그인 예시

  • Google Analytics → 방문자 분석용
  • 방명록 → 방문자와 소통용
  • 트위터/페이스북 공유 버튼 → 콘텐츠 확산
  • 이미지 슬라이더 → 메인 이미지 꾸미기

TIP: 플러그인은 필요한 것만 최소한으로 사용하는 것이 블로그 로딩 속도에 유리합니다.

5. 스킨 배경 이미지 바꾸는 쉬운 방법

배경 이미지 하나만 바꿔도 블로그 인상이 확 달라집니다. 코드 수정 없이 이미지 파일만 준비하면 쉽게 적용할 수 있습니다.

배경 이미지 변경 방법

  1. 관리자 페이지 → 꾸미기 > 스킨 편집
  2. 비주얼 모드 → 배경 설정 클릭
  3. 이미지 업로드 및 위치 조정
  4. 반복 여부 및 고정 여부 선택 후 저장

TIP: 모바일 최적화를 위해 가로폭 1200px 이하, 파일 용량 500KB 이하로 설정하는 것이 좋습니다.

6. 글자 폰트 변경 및 가독성 높이기

글꼴만 살짝 바꿔도 블로그의 전문성과 인상이 크게 달라집니다. 티스토리에서는 별도의 코드 수정 없이 다양한 폰트를 지원합니다.

폰트 변경 방법

  1. 관리자 페이지 → 꾸미기 > 스킨 설정
  2. 폰트 항목에서 원하는 글꼴 선택
  3. 폰트 크기 및 줄 간격 조정

추천 폰트: 나눔스퀘어, 스포카 한 산스, G마켓 산스 등

TIP: 줄 간격은 기본 1.5~1.8em 정도가 가독성에 가장 좋습니다.

꾸미기는 즐겁게, 기본은 탄탄하게

HTML이나 CSS를 잘 몰라도, 티스토리에서 제공하는 비주얼 편집 기능과 기본 설정만으로 충분히 세련된 블로그를 만들 수 있습니다. 중요한 것은 가독성, 반응형 디자인, 사용자 편의성을 최우선으로 생각하는 것입니다.

처음부터 모든 걸 완벽하게 꾸밀 필요는 없습니다. 차근차근 블로그를 다듬어 나가면서, 나만의 스타일을 찾아보세요. 꾸준히 수정하고 관리하는 블로그가 결국 애드센스 승인지속적인 성장을 이끌어냅니다.