티스토리블로그 글 제목 배경 이미지 제거하기, 배경색 바꾸기

티스토리블로그 글작성 시 제목 부분에 배경이미지로 인하여 제목이 잘 안 보이는 경우가 있어서, 배경이미지를 제거하고 배경색을 바꾸는 방법을 알아보겠습니다.

글제목 배경이미지 변경 전

티스토리블로그를 시작하고 스킨을 선택하면 기본적으로 글쓰기의 포맷이 세팅되어 있습니다.

다른 스킨도 그런지 모르지만 북클럽스킨은 상단 글의 제목 부분에 글 내용에 있는 이미지가 자동으로 배경이 되어 나타납니다.

그런데 배경 이미지와 제목의 글자가 겹쳐서 글 제목이 잘 보이지 않는 경우가 많고, 또 글의 로딩속도에도 영향을 준다고 합니다.

티스토리블로그 글 제목 배경 이미지 없애기, 배경색 바꾸기

 

배경 이미지 제거하기

 

스킨편집

html편집

블로그관리의 스킨편집> html편집으로 들어갑니다.

html 화면 아무 곳을 누르고 Ctrl F를 누르면 검색창이 뜨고 검색창에 permalink를 치면
permalink 글자가 들어간 부분이 검색됩니다.

그중에 아래처럼 div class="post-cover"로 시작하는 부분이 있습니다.

<s_permalink_article_rep>
<div class="post-cover"<s_article_rep_thumbnail> style="background-image:url(https://blog.kakaocdn.net/dn/bd97x5/btrYeZvFyJJ/dX6SzTvK95Kl52ub7UOiz0/img.png)"</s_article_rep_thumbnail>>
<div class="inner">
<span class="category">블로그 공부</span>

위의 노란 줄 "   " 안의 내용을 아래처럼 바꾸면 됩니다.

<s_permalink_article_rep>
<div class="post-cover"<s_article_rep_thumbnail> style="background-color:#666666;"</s_article_rep_thumbnail>>
<div class="inner">
<span class="category">블로그 공부</span>

위와 같이 변경을 하고 적용을 누르면 끝납니다.

배경 색상 변경하기

위에서 #뒤의 여섯 자리는 html 색상을 나타내는데 원하시는 색상을 골라서 넣을 수 있습니다.

색상넘버 참조

글쓰기화면 상단의 글자색상 번호를 참조하거나 더 다양한 색상을 원하면 검색창에 html 색상표나, html컬러차트를 검색해서 색상넘버를 참조하면 됩니다.

글제목 배경이미지 변경 후

위와 같이 글 제목뒤의 배경이미지가 사라지고 제목을 알아보기 쉽게 바뀌었습니다.

 

마무리

html기반인 티스토리블로그는 이용자가 html과 css 수정을 통해서 자신의 블로그를 취향대로 꾸미고 변경할 수 있습니다.

이쪽을 전공하거나 공부한 사람은 별것 아닐 수 있지만 초보자에겐 생소하고 어려운 부분이 있습니다. 조금씩 공부하며 따라 해 보는 수밖에 없는듯합니다.