블로그에 애드센스 광고를 설정해두면 보통은 화면 광고가 가운데 정렬되서 나오는 것이 일반적이다. 그런데 블로그 테마/스킨을 변경하거나 코드를 잘못 넣으면 광고가 화면 한쪽에 붙어서 나올 수 있다.
구글 애드센스 본문 광고는 크게 자동, 수동 방식 2가지가 있는데 원인과 해결 방법을 알아보자.
이 블로그 메인 화면에는 헤더 아래 광고를 적용해 두었다. 최근 갑자기 워드프레스 테마를 변경하고 작동 여부를 확인하러 도메인으로 접속했더니 위처럼 광고가 왼쪽에 쏠려서 나오는 것을 발견했다.
애드센스 사용 유저라면 위 광고 코드는 익숙할 것이다.
잠시 위의 코드를 보면
<ins class=”adsbygoogle”
…
data-full-width-responsive=”true”></ins>
부분이 있는데 위 아래로
<div style=”text-align: center;”>와 </div>를 넣고 저장했더니 광고가 가운데로 정렬되었다.
다음은 모바일로 블로그에 접속했을 때인데 광고가 왼쪽으로 쏠려 있는 것이 보인다. 하지만 위처럼 본문에 들어가는 자동 광고는 코드를 추가할 수 없었는데, 대신 CSS에 문제가 있었다.
* {
max-width: 100%;
box-sizing: border-box;
}
위는 테마 변경 후 모바일 화면이 옆으로 움직여서 추가한 코드이다. 이후 화면은 안정되었지만, 광고 쏠림 현상이 있었고 결국 위 코드를 없애니 자동 광고가 가운데로 정렬되었다.
만약 CSS에 해당 코드가 있다면 삭제하고 다른 코드를 적용해 보자.
관련 글
워드프레스 모바일 화면이 옆으로 움직일 때 해결 방법
코드 삭제 후 광고가 화면 가운데 나오는 것을 볼 수 있다. 클래스 이름 *은 아마도 블로그의 모든 html 요소를 선택하는 요소인 것 같다.
