티스토리 블로그 글을 작성하면 글 내용에 삽입한 이미지가 자동적으로 제목 배경 이미지로 나오게 됩니다. 보통 썸네일을 대표 이미지로 선택했을 경우 포스팅 제목과 이중으로 보여 가독성이 떨어지는 경우가 많아서 저는 너무 싫더라고요. 오늘은 대표 사진이 자동 지정되지 않도록 티스토리 글 제목 배경 이미지 변경 방법을 알려드리겠습니다.
우선 아예 배경 이미지가 없도록 설정하는 것과 글이 없는 사진이 배경이 되도록 설정하는 방법 2가지가 가능합니다. 오늘은 이 두 가지 방법을 다 알려 드릴게요.
제목 배경 이미지 없애는 방법
1. 관리 > 스킨 편집 > HTML 편집
티스토리 블로그 HTML을 보면 대표 이미지가 자동적으로 제목 배경 이미지로 들어가도록 설정되어있습니다. 이것을 먼저 지워줘야 하는데, 관리의 스킨 편집에서 HTML 편집으로 들어갑니다.
[Ctrl + F]로 style="background-image를 찾으시거나 수동으로 스크롤을 내려 찾으셔도 됩니다. 저는 407번째 줄에 있었는데, 티스토리 블로그 개설 후 추가로 삽입한 코드가 있다면 번호의 차이가 있을 수 있습니다.
2. [##article_rep_thumbnail_raw_url_##] 지우기
해당 코드를 찾으셨다면 url([##article_rep_thumbnail_raw_url_##])의 대괄호 부분을 다 지워주세요. 중요한 것은 괄호 안의 내용만 지우는 것이 아니라 대괄호까지 다 지워야 한다는 것입니다.
3. 적용을 누르고 나와서 작성된 글 다시 확인하기
코드를 지운 후 꼭 상단의 적용을 눌러줘야 합니다. 페이지를 나와서 이미 작성된 포스팅이 있다면 제목의 배경 이미지가 제대로 지워졌는지 확인해주면 됩니다.
새 제목 배경 이미지 삽입하기
제목 배경 이미지를 없애고 나면 회색의 배경만 남아있는데요, 그냥 두면 왠지 관리 안 하는 블로그 같이 보이니까 글씨가 없는 이쁜 이미지로 배경 이미지를 지정해주려고 합니다.
1. 이미지 다운로드하기
이미 가지고 있는 이미지가 있다면 바로 쓰셔도 되고, 없다면 무료 이미지 다운 사이트에서 마음에 드는 사진을 다운로드하여줍니다. 어떤 이미지 등 상관은 없지만 글씨가 없고, 제목 글자색이 흰색이니까 어두운 사진이 좋을 듯해요.
사진을 다운로드할 때 주의할 점은 해상도 높은 사진을 그대로 받으면 내 글이 검색됐을 때 로딩 속도가 느려집니다. 구글 검색엔진은 글 로딩 속도를 중요하게 생각하기 때문에 절대로 고해상도 사진을 쓰면 안 됩니다.
이미지가 깨지지 않을 정도의 저해상도로 사진 다운을 받으시길 바랍니다. 저는 90KB 사진인데요, 최소한 100KB 이하 되는 사진으로 만드세요. TinyPNG 같은 사이트를 이용하셔도 좋아요.
2. 관리 > 스킨 편집 > HTML 편집 > 파일 업로드
상단의 경로로 다운로드한 사진 파일을 업로드해 줍니다. HTML 편집으로 들어가면 파일 업로드를 할 수 있는데, 하단의 추가 버튼을 눌러서 내 컴퓨터에 있는 사진을 업로드해 주세요.
업로드 한 사진 파일명에 마우스를 두고 우클릭을 하면 "링크 복사"를 할 수 있습니다. 이 링크를 아까 지운 곳에 다시 입력해 줘야 합니다.
HTML 섹션으로 들어가서 해당 코드가 있는 곳을 찾아준 후 괄호 안에 사진 주소를 입력해주세요. "url(사진 링크 주소)" 한 번 더 말씀드리지만 대괄호까지 지워주셔야 제대로 적용되니까 꼭 확인해 주세요.
적용을 누르고 나온 뒤 포스팅 글에 제대로 적용됐는지 확인해 주시면 됩니다. 이쁘게 적용됐죠? 네이버 블로그만 하던 분이라면 HTML 코드가 익숙하지 않아 어렵게 느껴질 수 있는데 차근히 따라 해 보세요.
오늘은 대표 사진이 제목 배경 이미지로 지정되지 않도록 티스토리 글 제목 배경 이미지 변경 방법을 알려드렸는데요, 이 글이 도움이 되셨다면 구독과 좋아요 버튼을 눌러주세요. 긴 글 읽어주셔서 감사드리고요, 좋은 하루 보내세요~!!
댓글