수동으로 삽입한 티스토리 본문 애드센스 코드가 깨질 때 대처법
티스토리 본문에 자동이 아닌 수동으로 애드센스 코드를 넣는 것은 귀찮지만 몇 가지 장점이 있다. 티스토리 본문에 광고 코드를 내가 원하는 위치에 삽입을 할 수 있으며 티스토리 관리 메뉴의 본문 중간(에디터) 광고 삽입의 경우에는 본문에 단 1개만 애드센스 코드가 삽입되는데 수동으로 넣으면 원하는 개수만큼의 광고 코드를 넣을 수 있다.
그래서 나같은 경우에는 본문 중간에 애드센스 광고 코드를 대부분 “수동”으로 삽입하고 있다. 일일이 수동으로 광고 코드를 삽입하는 것은 어려우니 “서식” 기능을 활용하면 그나마 손쉽게 본문 중간에 광고 코드를 삽입하는 게 가능하다.
2022.07.21 – [SW/Tip] – 티스토리 에디터에서 본문 중간에 애드센스 코드 수동으로 손쉽게 넣는 방법
하지만 수동으로 광고를 넣는 방법은 문제가 될만한 요소가 있다. 티스토리 글을 작성하고 발행을 하다보면 어느 순간에 본문 내용을 수정할 일이 생길 것이다. 그런데 본문 중간에 수동으로 애드센스 광고를 넣은 상태에서 티스토리 글을 수정하면 이후에 본문 중간에 수동으로 넣은 광고들이 전혀 노출이 되지 않는 문제가 발생한다.
이게 무슨 말일까? 쉽게 설명하면 이렇다.
- 내가 티스토리 글을 작성하면서 서식을 활용해 애드센스 광고 코드를 중간에 넣고 난 다음 저장 혹은 발행을 했다.
- 이후에 글 내용을 수정하기 위해서 다시 작성해놓은 글을 수정한 다음에(물론 광고 코드는 전혀 건드리지 않은 상태) 발행을 하면 본문 중간에 삽입한 광고가 정상 노출이 되지 않는다.
즉 본문 중간에 넣은 광고 코드가 깨져버리는 상황이 발생해버리고 만다.
예제로 작성한 글이다. 여기서 서식을 활용해 애드센스를 삽입하고 저장을 한 다음에 다시 티스토리 에디터로 들어간 모습이다. 이 상태에서 애드센스 코드가 정상인지 확인해 보자. 우측 상단에 모드를 “HTML”로 바꿔본다.
어 이상하다. 자세히 보면 애드센스 광고 코드가 이상하게 변해버린 것을 볼 수 있다. 원래 삽입했던 광고 코드는 이렇다.
중간에 <ins> 태그의 코드는 다 날아가버리고 <p> 태그만 잔뜩 붙어있다. 이런 현상과 관련하여 원인을 찾아보려고 노력했으나 티스토리 에디터의 특징으로 판단해야 할듯 하다. 에디터 기능에 글을 작성할 때마다 <p> 태그를 붙이는 거 같은데 그렇다고 해도 <ins> 태그 내용이 날아가는 것은 버그이지 않을까 생각한다.
그럼 이런 현상을 막을 수 있는 방법이 있을까? 다행이도 대안이 있다. 다시 좀 전에 광고 코드를 저장해 놓은 서식으로 이동한다. 그런 다음에 HTML 모드로 변경한다.
확인해 보니 이미 서식에 저장했던 애드센스 광고 코드도 살짝 망가져 버린 것을 알 수 있다. <ins> 태그 앞에 <p> 태그가 자동으로 붙어버린 것이다. 이 상태에서 서식에 저장된 코드를 전부 삭제해 버리고 다시 코드를 복사해 넣는다.
그런 다음에 위와 같이 애드센스 광고 코드의 처음 앞과 끝 뒤에 “<div>…</div>” 태그를 넣어주면 된다. <div> 태그로 감싸면 이후에 본문 중간에 서식으로 광고 코드를 넣고 저장을 해도 광고 코드가 깨지지 않는다. 위의 과정까지 했으면 완료를 하고 서식을 저장해 준다.
그럼 실제로 안깨지는지 확인을 해보자. 위 저장한 서식을 광고 코드를 넣어본 다음에 저장하고 다시 에디터로 들어가서 HTML 모드로 확인해 본다.
오호! 정말로 광고 코드가 깨지지 않은 모습이다. 다소 문자 배열이 틀어지긴 했지만 JS코드이므로 광고 노출에는 전혀 지장은 없다. 광고 코드에 <div></div>로 감싸주기만 해도 애드센스 광고 코드 깨짐을 방지할 수 있다.
