지난 1달간 제 블로그를 오셨던 분이라면 아시겠지만 제 블로그에 한동안 광고가 안나왔습니다. 저 같은 경우는 데이블이나 카카오에드핏(구 다음에드핏) 다른 것을 일절 하지 않고 어자피 일정 금액 이상 쌓여야 받는거 구글 애드센스로 올인한 블로그를 운영하고 있었는데 어느날 무효트래픽으로 경고 메세지가 날라옴과 함께 광고가 일절 중단 되었습니다.
처음에는 제가 쓴 글 중에 시비가 몇 번 걸린적이 있어서 그것 때문에 테러라도 당했나 싶었는데 다행이라면 그런게 아니고 그냥 네이버 블로그 하던 친구에게 티스토리 하라고 권하면서 광고 설정이나 테마 적용하는거 도와줬었는데, 그 친구가 공공PC에서 자기 블로그와 제 블로그 광고를 열심히 눌러 줬다고 합니다.(...... 하루에 32달러 찍힐때 의심을 했었어야 했는데)
처음에는 1달이 지나면 풀리겠지 했더니 풀릴 기미는 안보여서 거기에다가 하루 방문자가 1500명 전후하느 블로그를 냅두는게 아까워서 데이블과 다음에드핏 쿠팡파트너스 모조리 신청해서 올렸습니다.
광고코드를 정리하고 새로 붙이다 보니 제 블로그만 해도 애드센스를 8개를 주렁주렁 달고 있었는데 모두 주석 처리 해버리고 기본 반응형과 컨텐츠 추천 두개 만 남겼더니 광고 제한은 그대로이지만 광고는 다시 나오기 시작했습니다. 광고 게제가 제한 한다는게 한 페이지당 송출하는 광고 횟수의 제한인가 봅니다. 아무튼 지금은 나오니 다행입니다.
어찌되었거나 다시 처음으로 돌아와서 쿠팡파트너스는 사이트를 소유하지 않아도 코드 발급이 가능했고 데이블은 한번에 통과, 그리고 카카오 애드핏은!
???!! 하루 페이지뷰 3천이상 되야 올릴 수 있는 데이블도 한번에 통과를 한 블로그가 왜 보류되었지 했더니
사유는 모바일에서 광고가 제대로 안나온다고 나왔습니다.
다음 애드핏 광고는 이렇게 두가지가 있습니다. PC버전과 모바일 버전이 있는데
모바일 버전 애드핏의 경우
블로그 모바일 꾸미기 설정에서 모바일웹 자동 연결을 사용할때에 뜨는 것이고 저는 반응형웹 설정해서 이용중이라 PC화면 그대로 모바일에 나오게 설정했습니다.
그러다보니
이렇게 PC버전의 하단 광고는 반응형이 아니고 고정됩니다. 컴퓨터에서 보면 문제가 없지만 휴대폰으로 같은 화면을 보게 되면
요렇게 혼자 툭 튀어나와서 스크롤 하다가 거슬리는 환경이 만들어집니다. 이것 때문에 심사에서 탈락을 했습니다.
첫번째 해결방법은 모바일웹 자동 연결을 사용하면 되는데, 저는 별로 그 테마를 안좋아합니다.(광고가 덜나오거든요)
그래도 지금 당장 만지기는 귀찮아서 대총 모바일웹 자동 연결로 통과를 시켰습니다만... 다시 수정에 들어 갔습니다.
두번째방법은 위처럼 오버되는 부분을 안나오게 처리 해버립시다.
주소 입력 칸에다가 카카오에드핏에서 넣어야할 소스 코드를 하나 주었을 겁니다.
<div id="아무이름">
..
소스코드
..
</div>위처럼 입력을 해줍시다.
아무이름은 식별값이기 때문에 말그대로 abc를 하시건 아무거나 쓰시면 됩니다.
그런다음 관리자로 들어가셔서 HTML수정 - 편집을 누른다음
CSS창으로 가봅시다.
그리고 스크롤을 쭉 내리면서 찾다보면 @media screen이라고 되어 있을 겁니다.
우리가 일반적인 웹환경에서 이렇게 동작을 하는데 특정 조건에서는 이렇게 작동하라고 명령을 줄 수 있습니다.
@media screen 해놓고 max-width:767px라고 되어 있는데, 즉 좌우 폭이 767px일때는 아래 처럼 행동하라는 뜻입니다. 이런 코드 덕분에 우리는 같은 페이지를 다른 환경으로 볼때 환경에 맞추어서 출력되는 이유입니다.
아무튼 첫번째 중괄호 바로 아래에다가
#적어두었던 아무 이름{
display: block;
overflow: hidden;
}라고 해줍시다. #은 id값에 접근하는 것입니다. 제가 div를 설정하면서 id값을 지정해두었지요
그리고 위처럼 적어주시면 넘치는 부분은 숨겨버리게 됩니다.
이제 카카오에드핏이 넘치는 부분을 잘라 버렸습니다.
블로그 팁에다가 자주 사용했던 말인데, 정말 블로그를 잘 키워보고 싶고 열심히 하고 싶으시다면 자바스크립트 까지는 아니더라도 CSS와 HTML을 배워두시면 몹시 유용합니다.
