티스토리 블로그 상단 이미지 제거, 높이 조절방법 총정리

 

오늘은 블로그 글의 상단 이미지를 제거하고 높이를 조정하는 방법에 대해 자세히 알아볼게요. 블로그의 디자인을 개선하고 싶거나, 글의 가독성을 높이고 싶은 분들에게 유용한 정보가 될 거예요. 함께 살펴볼까요?

 

 

---

 

 

티스토리 블로그 상단 이미지 제거, 높이 조절방법

 

 

티스토리 상단 이미지 제거 이유

티스토리 블로그의 기본 설정에는 글 상단에 대표 이미지가 표시되도록 되어 있어요. 하지만 때로는 이 이미지가 불필요하거나, 글의 내용과 맞지 않을 수 있죠. 또한, 모바일 환경에서는 이 이미지가 너무 큰 공간을 차지해 가독성을 해칠 수도 있어요. 그래서 많은 블로거들이 이 상단 이미지를 제거하고 싶어 해요.

 

티스토리 상단 이미지가 있을 때의 문제

 

※ 위 그림은 특정 블로그의 포스팅 자료로 상단 이미지로 인해 포스팅 제목의 가독성이 크게 떨어짐을 확인할 수 있어요.

 

 

티스토리 개설 후 수익형 블로그 기본 세팅 방법

 

 

 

티스토리 상단 이미지 제거 방법

상단 이미지를 제거하는 방법은 크게 두 가지가 있어요. CSS를 이용하는 방법과 HTML을 수정하는 방법이에요. 각각의 방법을 자세히 알아볼게요.

 

CSS를 이용하는 방법

CSS를 이용하면 간단하게 상단 이미지를 숨길 수 있어요. 다음 단계를 따라 해 보세요.

1. 티스토리 관리자 화면에 접속해요.
2. '꾸미기 > 스킨 편집'을 선택해요.
3. CSS 편집창을 찾아 다음 코드를 추가해요:

.article_view .tt_article_useless_p_margin figure.imageblock { display: none !important; }

 

이 코드는 글 내용의 첫 번째 이미지(대표 이미지)를 숨기는 역할을 해요.

 

 

티스토리 레이지로딩(lazy loading) 적용 방법

 

 

HTML 수정 방법

HTML을 직접 수정하는 방법도 있어요. 이 방법은 조금 더 복잡하지만, 더 세밀한 제어가 가능해요.

1. 티스토리 관리자 화면에서 '꾸미기 > 스킨 편집'으로 이동해요.
2. HTML 편집창에서 <div class="article_view"> 부분을 찾아요.
3. 그 안에 있는 <figure class="imageblock"> 태그와 그 내용을 삭제하거나 주석 처리해요.

주석 처리는 다음과 같이 할 수 있어요.

<!-- <figure class="imageblock"> ... (이미지 관련 코드) ... </figure> -->

 

코드 양 끝부분에 주석 표시인 <!-- 와 -->를 추가하면 해당 코드는 주석 처리가 되어요.

 

 

 

글 높이 조정하기

상단 이미지를 제거한 후에는 글의 높이를 조정하고 싶을 수 있어요. 특히 제목과 본문 사이의 간격을 조절하면 더 깔끔한 레이아웃을 만들 수 있죠. 이것도 CSS를 이용해 할 수 있어요.

1. 티스토리 관리자 화면의 '꾸미기 > 스킨 편집'으로 가세요.
2. CSS 편집창에 다음 코드를 추가해요.

.article_view .tt_article_useless_p_margin { margin-top: 20px; /* 원하는 간격으로 조절하세요 */ }

 

이 코드에서 margin-top 값을 조절하면 제목과 본문 사이의 간격을 원하는 대로 설정할 수 있어요.

 

 

티스토리 반응형 스킨 적용 방법(스킨 변경방법)

 

 

티스토리 상단 이미지 제거 및 글 높이 조정 주의사항

티스토리 상단 이미지 제거 및 글 높이 조정 시 주의사항은 다음과 같아요.

1. CSS나 HTML을 수정할 때는 항상 주의가 필요해요. 잘못 수정하면 블로그 전체 레이아웃이 깨질 수 있어요.
2. 수정 전에 반드시 현재 설정을 백업해 두세요.
3. 수정 후에는 여러 기기와 브라우저에서 테스트해 보세요. 특히 모바일 환경에서 잘 보이는지 확인하는 것이 중요해요.

 

실시간검색어 순위 확인 방법 총정리(블로그운영에 꼭 필요한 점)

 

 

 

마치며...

지금까지 티스토리 블로그의 상단 이미지를 제거하고 높이를 조정하는 방법에 대해 알아보았어요. 이런 작은 변화로도 블로그의 전체적인 느낌이 많이 달라질 수 있어요. 여러분의 블로그 스타일에 맞게 적절히 활용해 보세요.

 

 

함께 읽으면 좋은 글

블로그 마케팅이란? 블로그 마케팅 무엇이 있나?

티스토리 블로그 수익화의 현실(수익금은 얼마?)