블로그/티스토리 스킨 수정 방법

[티스토리 스킨 수정] 수동으로 넣은 본문 상단, 하단 애드센스 광고와 글 사이에 여백이 없을 때 해결 방법

비스카이비전 2022. 6. 20. 20:25

안녕하세요. 비스카이비전입니다. 애드센스 광고 위치로 가장 많이 사용되는 위치는 아마도 "본문 상단"과 "본문 하단"일 것입니다. 

 

 

포스팅 본문 영역의 경우 광고들이 글에 여백 없이 붙어 있다면 가독성을 해칠 수 있습니다. 아래 캡쳐 화면은 여백 없이 글에 붙은 광고의 예시입니다. 

 

광고와 글 사이에 여백이 없어서 답답해보입니다

 

저는 글과 광고 사이에는 어느 정도 여백을 만들어 주는 것이 좋다고 생각합니다. 오늘 저는 사용하시고 계신 스킨의 종류에 관계없이 본문 상단 광고와 본문 하단 광고와 글 영역 사이에 간단히 여백을 주는 방법에 대해 알려드리려고 합니다. 

 

본문 상단/하단 광고와 글 영역 사이에 여백을 주는 방법

1. 우선 스킨 편집 페이지에 들어가셔서 HTML 문서에서 Ctrl + f 로 [##_article_rep_desc_##]를 찾습니다.

수동으로 본문 상단, 본문 하단 광고를 넣으신 분들은 [##_article_rep_desc_##] 치환자 위 아래로 애드센스 광고 코드가 들어가 있을 것입니다. [##_article_rep_desc_##]가 블로그 본문 내용에 해당하는 치환자입니다. 티스토리 스킨을 개발하는데 있어서 가장 중요한 치환자라고 볼 수 있습니다. 

 

2. [##_article_rep_desc_##] 치환자 바로 위 아래에 <br> 을 각각 추가합니다.

 

 

첫번째 <br> 위에 본문 상단 광고 코드가 있어야 하고, 두번째 <br> 아래에 본문 하단 광고 코드가 있어야 합니다. 그러면 광고와 포스팅 사이에 한 줄씩 여백이 생깁니다. 참고로 <br> 태그는 문서 내 한 줄의 공백을 넣어주는 html 태그입니다. 공백이 생기니 한결 보기가 편해졌습니다. 

 

한결 보기 좋습니다

 

조금 더 공백을 주시고 싶은 분들은 <br> 태그를 각각 두 개, 세 개씩 넣으셔도 됩니다. 그러면 두 줄, 세 줄의 여유 공간이 생깁니다.

 

도움이 되셨길 바라며 글을 맺도록 하겠습니다.