본문 바로가기
디지털노마드/블로그 운영하기

티스토리 북클럽 스킨 글 제목 배경 변경 방법

by 뚱찌빵찌 2020. 10. 28.

티스토리 북클럽 스킨 제목 배경 설정 및 변경

티스토리 북클럽 스킨 글 제목 배경 변경 방법

티스토리 북클럽 스킨으로 변경하고 나서 글을 쓰고나면 글 제목을 표시하는 부분이 글의 대표사진인 섬네일사진이 뒤에 배경으로 비치더라구요. 저는 섬네일이 글씨로 이루어져서 글씨그림 위에 글제목이 다시 덮여지니 더 지저분해보이더라구요. 

그래서 오늘은 '북클럽 스킨의 제목 배경사진 삭제 및 변경 방법'을 준비해 보았습니다. 섬네일을 따로 설정은 하고싶은데 글 제목 배경사진으로 깔리지는 않았으면 좋겠다 싶으신 분들은 아래 방법을 따라해주세요.

 

 


1. 북클럽 스킨 포스팅 글 제목 배경사진 삭제 방법

  1-1. [관리] > [스킨편집] > [html 편집]으로 들어가기  

스킨편집 페이지 들어가기

 

  1-2. HTML 편집 부분에서 https://blog.kakaocdn.net/dn/cVOm5q/btqL1og3ypF/SmwiYbU5SNW7BYwzBNTMaK/img.png을 지우기  

◾ HTML 칸 아무데나 클릭한 후, Ctrl + F를 눌러서 post-cover를 입력해서 찾는다.

 410번 줄 근처에서 괄호 안에 있는 배경경로 https://blog.kakaocdn.net/dn/cVOm5q/btqL1og3ypF/SmwiYbU5SNW7BYwzBNTMaK/img.png 부분을 지운다.

 오른쪽 상단에 '적용'을 누른다.

대략 410줄의 [ ] 부분 지우기

 

스킨편집 페이지를 나와서 포스팅 글을 눌러 확인하면, 이렇게 배경이 제거되어 글 제목 배경화면이 회색으로 나타납니다.

변경된 글 제목 바 확인하기


2. 포스팅 글 제목 배경 이미지 변경 및 설정 방법

자 다음으로는 내가 원하는 사진을 설정하는 방법을 알아볼까요?

저는 무료 이미지 다운로드 사이트에서 찾은 은하수 배경을 설정해보도록 할게요.

 

2-1. 스킨편집 페이지에서 변경할 사진 업로드하기  

 [관리]>[스킨편집]>[HTML 편집]으로 들어가서 상단에 적힌 [파일업로드] 부분을 선택한다.

 하단에 '추가'버튼을 눌러 내 컴퓨터에 저장한 사진을 불러온다.

배경이미지로 쓸 사진 준비

 

이미지 추가하는 방법

 

 

 

  2-2. 불러온 사진 링크 주소 복사하기  

불러온 사진 이름에 마우스를 갖다대고 우클릭하면 작은 창에 '링크 주소 복사'가 보일거에요.

이걸 누르면 해당 사진의 경로가 복사돼요. 이걸 복사한 후 다시 위 1-2에서 설명드린 HTML 편집부분으로 들어갑니다.

이미지 파일의 링크 주소 복사하기

 

2-3. HTML 편집에서 업로드한 사진의 링크 주소 붙여넣기

1-2에서  https://blog.kakaocdn.net/dn/cVOm5q/btqL1og3ypF/SmwiYbU5SNW7BYwzBNTMaK/img.png를 지운 괄호 안에 Ctrl+V를 눌러서 링크 주소 붙여넣어줍니다. 그리고 오른쪽 상단에 적용을 눌러주세요.

지웠던 [ ] 괄호 안에 복사한 주소 붙여넣기

 

그러면 요렇게 이미지 사진이 글 제목부분에 적용된 것을 확인할 수 있어요.

적용된 제목 상단 바 확인하기

 

 Tip! 

사진의 해상도가 너무 높아서 이미지 파일의 크기가 커지면 글의 로딩속도가 느려지게 돼요. 이럴경우 추후 애드센스나 애드핏 광고를 달았을 때 게시글이 더 무거워지니까 적당한 크기의 사진을 사용하는 것이 좋아요. 

 

저는 처음엔 600KB 크기의 사진으로 했다가 70KB의 사진으로 변경하였는데요. 위 포스팅은 70KB의 사진을 기준으로 작성했습니다. 해상도가 깨지지않는 선에서 이미지 파일 크기를 변경한 후 올리시면 돼요.

 

게시글의 로딩속도가 느리면 글 이탈률도 높아지고 블로그 최적화에도 영향을 미친다고하니 너무 큰 용량의 파일을 사용하는 것은 피하시길 추천드려요.

 


 

도움이 되셨으면 공감과 구독 눌러주세요.

오늘도 긴 글 읽어주셔서 감사합니다. 😊

댓글