티스토리 블로그 타이틀 이미지 세로 크기 확장하기

 

 티스토리 블로그에서 타이틀 이미지를 올리고 크기를 확장하는 방법을 알아보도록 하겠습니다. 티스토리 블로그에서는 스킨위자드 기능을 이용하면 아주 쉽게 타이틀 이미지를 올려서 높이 조절까지 가능한데요. 하지만 스킨 위자드에서는 세로 크기가 300px 한계치이기 때문에 그 이상으로 크기를 확장하기 위해서는 HTML/CSS 편집을 건드려야 한다는 단점이 있습니다. 크게 어려운 부분은 없고 수치만 바꿔주면 되기 때문에 저와 같은 HTML 초보자도 쉽게 따라할 수 있습니다. 

 

HTML/CSS의 헤더박스의 세로 크기를 조절하여 위의 사진과 같이 타이틀 이미지를 650px로 확장했습니다.

타이틀 이미지를 무조건 크게 만든다고 큰 이점은 없겠지만

블로그를 꾸미기 좋아하는 사람이라면 한 번 시도해 보세요.

 

먼저 관리자 모드로 들어가서 메뉴에서 스킨을 선택하고 스킨위자드를 클릭합니다. 

 

수정을 하기에 앞서 항상 백업을 하는 습관을 가지는 것이 좋습니다.

필자는 백업을 하지 않고 스킨이 다 날라가는 바람에 재복구 하는데 2~3시간 정도를 허비했습니다 ㅠ

이런 불상사를 방지하기 위해서라도 백업을 생활화 합시다~

 

화살표가 가르키는 스킨저장을 클릭하면 간단하게 현재의 스킨을 저장할 수가 있습니다.

스킨 저장을 하게 되면 위의 사진처럼 빨간 박스 안에 저장한 스킨들이 나열이 됩니다.

 

 

스킨 저장을 클릭하면 뜨는 화면에서 스킨명만 입력하면 바로 저장이 됩니다.

 

스킨위자드 메뉴로 들어왔다면 타이틀 → 직접올리기 선택하고요.

찾아보기를 눌러서 타이틀 이미지 파일을 올립니다.

오른쪽에 보면 이미지 사용에 원래크기 선택, 정렬에서 맞는 위치를 선택하면 됩니다.

 

 이제 텍스트 메뉴로 들어오면 높이 메뉴가 있는데요.

300px이 한계치인데 직접입력에 보면 650이 입력되어 있습니다.

 

높이를 300px 이상 확장하려면 관리자 모드에서 HTML/CSS 편집을 선택합니다.

 

 HTML이 아닌 CSS에서 #headerBox를 찾습니다.

그리고 그 밑에 보면 height:/*@title-height 라고 타이틀 높이가 나와 있는 부분이 있습니다.

 

여기서 초록색 부분의 수치를 바꿔주면 되겠습니다.

저 같은 경우는 300px에서 650px로 바꿨습니다. 

 

지금까지 스킨위자드 기능으로 타이틀 이미지를 올리고 크기를 확장하는 방법을 알아보았습니다.

다시 한 번 언급하자면 조금 귀찮더라도 수정하기 전에 항상 백업을 하는 습관을 가집시다.

백업 파일이 없는 상태에서 스킨이 날라가는 순간 본인의 소중한 시간도 같이 날라갈 수 있거든요.