블로그/블로그 운영 팁

tistory 블로그 스킨 편집 기능으로 바꾸기

삶소중 2025. 6. 3. 22:16
728x90
반응형

tistory 블로그 스킨 편집 기능으로 바꾸기 대표 이미지


코드를 몰라도 이미 있는 기능을 사용하고 이미지를 만들어 입력하는 것만으로도 블로그 분위기를 바꿀 수 있습니다. 

tistory 블로그 스킨 편집 기능만 이용해서 블로그 분위기를 바꿀 수 있는 방법을 알려드립니다.

스킨 편집 구성 살펴보기

tistory 블로그 스킨 편집 구성 안내

블로그 관리→꾸미기→스킨 편집 순으로 이동하면 위의 이미지와 같은 페이지를 볼 수 있습니다. 

 

1. 스킨 편집 설정 부분
❗'적용' 버튼은 모든 스킨 편집이 끝났을 때 누릅니다. 

 

2. 변경 내용을 미리 볼 수 있는 부분

중간에 있는 아이콘을 누르면  각각 PC, 태블릿, 스마트폰 규격으로 볼 수 있습니다. 

 

tistory 블로그 스킨 상단 변화 요소.

티스토리 블로그 스킨 편집 요소 타이틀 헤더, 내비게이션, 슬로건 섹션 변화 적용한 모습

타이틀 헤더, 내비게이션, 슬로건 섹션

이 세 가지는 블로그 상단의 디자인에 변화를 줄 수 있습니다. 

타이틀 헤더는 가로, 세로 18픽셀로 표현됩니다.
블로그 로고 이미지를 만들어 파일을 업로드하시면 됩니다.

로고를 업로드하면 기존에 있던 블로그 타이틀이 사라집니다.

블로그 타이틀 문장은 슬로건 타이틀과 상세 문구에 입력하면 됩니다.

내비게이션을 이용해서 블로그 필수 정보를 티스토리 메뉴 기능을 활용해서 상단에 노출 시킬 수 있습니다. 

 

슬로건 섹션에는 블로그 로고 입력시 사라진 블로그 타이틀을 슬로건 타이틀과 상세문구로 나눠 입력하면 됩니다.

물론 이외에도 다른 문장을 입력해도 됩니다. 

 

tistory 블로그 스킨 배너 이미지 편집 영역 안내

배너 섹션

배너 이미지를 만들어서 이미지 파일을 업로드하면 적용됩니다.

배너 이미지 사이즈는 가로 1200 X 세로 250 px(픽셀)

배너 이미지를 업로드 했는데 미리 보기에서 보이지 않는 다면 화면 비율을 조절하면 확인할 수 있습니다.

 

문구를 입력하면 이미지 위에 텍스트가 나타납니다. 

자세히 보기 URL에 자세히 보여주고 싶은 링크를 입력합니다.

문구 색상, 자세히 보기 색상, 자세히 보기 커서 반응 색상 버튼을 클릭해서 원하는 컬러로 바꿀 수 있습니다. 

728x90

 

tistory 블로그 스킨 편집 프로필 영역 이미지 업로드 안내

프로필 배경 이미지

프로필에도 배경을 따로 설정할 수 있습니다. 

tistory 블로그 스킨 프로필 영역에 이미지 삽입 결과

프로필 배경 이미지를 업로드하면 프로필란에 배경이 삽입됩니다.
프로필 배경 이미지 사이즈는 가로 300, 세로 500px(픽셀)입니다.

오디세이 블로그 스킨의 경우 이미지를 삽입하면 배너 이미지와 같이 어두운 느낌의 레이아웃이 실행됩니다.

이 부분은 CSS 코드를 변경해야 하는 부분입니다.

 

밑에 페이스북, 유튜브, 인스타그램, 트위터  URL을 입력하면 프로필 하단에 링크 버튼이 나타납니다.

SNS도 같이 운영하는 분이시라면 유용하게 사용하실 수 있을 기능입니다.


블로그 꾸미기

블로그를 꾸미고 싶어도 어떤 것이 어디에 있는지 몰라서 꾸미지 못할 때가 있었습니다.
그래서 며칠을 이것저것 만져보고 실행해 보고 이 방법을 익혔습니다.

만질지도 모르는 코드를 수정하지 않아도 얼마든지 티스토리 블로그의 분위기를 바꿀 수 있습니다.

조금 더 욕심을 내서 AI의 도움을 받아 스킨 코드도 약간 수정해서 밝기 조절도 할 수 있었습니다. 

2025.06.02 - [블로그 온라인 수익화의 기록] - 코딩 몰라도 가능한 티스토리 스킨 CSS 편집 : 배너 오버레이 제거 방법

 

코딩 몰라도 가능한 티스토리 스킨 CSS 편집 : 배너 오버레이 제거 방법

블로그 배너가 뿌옇게 보이시나요? 티스토리 오디세이 스킨을 사용 중이라면 기본 설정된 "어두운 오버레이(필터)" 때문일 수 있습니다. 저는 HTML, CSS는 전혀 모르는 사람이지만, 그록3의 도움을

craftstory.tistory.com

 

빠르게 하지는 못하지만 조금씩 시도해 보고 기록해 놓고 있습니다.

그저 필요할 때 실행해 버리면 금방 끝날 일이지만 나중에 다시 그 기능을 실행하려고 하면 간혹 잊어버렸던 경험이 있어서 그 방법을 남겨놓기로 했습니다. 

 

저의 이런 경험이 티스토리 초보 블로거분들에게 조금이라도 도움이 될 수 있었으면 좋겠습니다.

728x90
반응형