목차
구글 애드센스 자동 광고 오류 및 해결 방법, Autoptimize 설정 방법
최근 애드센스 승인을 받기 위해 광고 코드를 헤더에 삽입하면서 우연히 코드 에러 메세지를 발견하게 되었다. 어차피 광고 설정을 수동으로 하기에 큰 문제는 없지만, 그래도 항상 자동과 수동을 함께 사용하기에 해결책을 알아보게 되었다.
01
of 04
구글 애드센스 자동 광고 오류 증상
구글 애드센스 광고 설정 미리보기 상단에 빨간색 코드 가져오기 버튼 모양이 표시 된다. 이 경우 자동 광고가 7개가 나와야 할 페이지에 1~2개 정도만 나온다. 자동 광고가 아예 안 나오는 것도 아니고 1~2개 정도만 나타난다.
애드센스 승인을 받을 때 헤더에 자동 광고 코드를 넣어주는데, 이 코드를 정상적으로 인식하지 못하는 오류라 판단된다.
광고는 수동으로 넣으면 상관없는데, 애드센스 승인을 받을 때 이 오류가 어떤 영향을 미칠지 몰라 해결책을 알아보게 되었다.
02
of 04
구글 애드센스 자동 광고 오류 원인
결국 원인은 내가 설치한 플러그인 중 Autoptimize의 설정 때문이었다. Autoptimize는 웹페이지의 속도를 향상 시켜주는 플러그인으로 자바 스크립트를 압축하는데 이때 문제가 발생하는 것 같다.
후에 카페 회원님들의 답변을 보니 Autoptimize뿐만 아니라 다른 비슷한 종류의 플러그인에서 나타나는 증상이라고 한다.
03
of 04
구글 애드센스 자동 광고 오류 해결 방법
이 오류를 해결하기 위해선 아래 두 가지 방법 중 한 가지를 선택하면 된다.
① Autoptimize 플러그인을 사용하지 않거나 자바 스크립트 압축 설정을 해제한다.
② Autoptimize 설정은 그대로 두고, 헤더 코드를 삭제하고 아래 코드를 푸터에 삽입한다.
<!--noptimize-->
<script type="text/javascript">
function downloadJSAtOnload() {
var element = document.createElement("script");
element.src = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-000000000000";
document.body.appendChild(element);
}
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;
</script>
<!--/noptimize-->
Code language: JavaScript (javascript)※ 위 코드는 애드센스 광고를 지연 로드 시켜서 사이트 속도를 올려주는 코드다.
04
of 04
Autoptimize 설정 방법
1. JavaScript Options
① Optimize JavaScript Code? : 자바 스크립트 코드를 최소화 합니다. (체크)
② Aggregate JS-files? : 페이지 속도 도구의 렌더링 차단 오류를 해결 합니다. (체크)
③ Also aggregate inline JS? : 페이지 성능은 향상되지만 팝업이 표시되지 않습니다.
④ Force JavaScript in <head>? : JS 렌더 블록이 생성되므로 권장되지 않습니다.
⑤ Add try-catch wrapping? : 이 방법은 권장되지 않지만 사이트에서 JS 오류 또는 스크립트 중단을 발견한 경우 이 기능을 사용하도록 설정 합니다.
2. CSS Options
① Optimize CSS Code? : CSS 코드를 최소화 합니다. (체크)
② Aggregate CSS-files? : 이 옵션이 꺼져 있는 경우 개개의 CSS 파일은 그대로 유지되지만 최소화 됩니다. (체크)
③ Also aggregate inline CSS? : 캐시 크기를 빠르게 늘릴 수 있으므로 권장하지 않습니다.
④ Generate data: URIs for images? : CSS 자체에 작은 배경 이미지를 포함하려면 이 옵션을 활성화 합니다.
⑤ Eliminate render-blocking CSS? : 권장하지 않습니다.
⑥ Inline all CSS? : HTML의 크기가 크게 증가하기 때문에 권장하지 않습니다.
3. HTML Options
① Optimize HTML Code? : HTML 코드를 최소화 합니다. (체크)
4. CDN Options
Cloudflare를 사용하는 경우 이 항목을 공백으로 둡니다. 그렇지 않으면 CDN 루트 URL을 입력하여 자동 최적화된 파일의 CDN을 활성화 합니다.
5. Misc Options
① Save aggregated script/css as static files? : 웹 서버가 압축 및 만료 작업을 제대로 처리하지 않는 경우 이 옵션을 사용 불가능으로 설정하십시오. (체크)
② Minify excluded CSS and JS files? : 이 옵션을 제외하더라도 고장난 항목이 있으면 이 옵션을 선택 취소합니다. (체크)
③ Enable 404 fallbacks? : 이 옵션을 켜면 자동 최적화는 발견되지 않은 파일을 “폴백” 버전으로 리디렉션하여 페이지/사이트를 어느 정도 그대로 유지합니다. (체크)
④ Also optimize for logged in editors/ administrators? : 기본적으로 자동 최적화는 로그온한 편집자/관리자에 대해서도 활성화됩니다. 페이지 작성기를 사용하여 로그인할 때 자동 최적화를 사용하지 않으려면 이 옵션의 선택을 취소하십시오.
⑤ Enable configuration per post/ page? : 게시/페이지 편집 화면에 “메타박스”를 추가하여 게시/페이지 레벨별로 다양한 최적화를 해제하시겠습니까? (체크)
6. Image optimization
① Image optimization & CDN : 차세대 WebP 이미지 포맷을 포함한 ShortPixel의 글로벌 CDN에서 이미지를 처리하려면 이 옵션을 선택합니다.
② Lazy-load images? 지연 로드 이미지를 활성화 합니다. (체크, 1 설정) ※ 만약 테마나 기타 다른 곳에서 지연 로드 이미지를 활성화 했다면 이곳은 체크하지 않습니다.
7.Extra Auto-Optimizations
① Google Fonts : 구글 폰트 삭제 선택 (체크)
② Remove emojis : 이모티콘 제거 (체크)
③ Remove query strings from static resources : 쿼리 문자열을 제거해도 로드 시간이 향상되지는 않지만 성능 점수가 향상될 수 있습니다. (체크)
④ Remove WordPress block CSS : WordPress는 블록 기반 사이트의 쉬운 스타일링을 개선하기 위해 블록 CSS와 글로벌 스타일을 추가하지만 상당한 양의 CSS와 SVG를 추가할 수 있습니다. 사이트에서 블록 CSS 및 “글로벌 스타일”을 사용하지 않고 사용할 수 있다고 확신하는 경우 여기에서 비활성화 시킬 수 있습니다. (체크)
