워드프레스에서 애드센스 광고를 운영하다 보면 광고를 어디에 넣어야 할지보다, 어떻게 관리해야 하는지가 더 어려워질 때가 있습니다. 오늘은 워드프레스 Ad Inserter 플러그인에 대해 도움되실 정보를 공유해보고자 합니다.
저 역시 기존에는 사용자 정의 HTML 블록에 애드센스 코드를 직접 넣고, 이를 패턴으로 저장해서 사용하는 방식으로 운영하고 있었습니다.
그런데 어느 순간 구텐베르크 편집기에서 HTML 코드가 보이지 않는 현상을 겪게 되었고, 잘못하면 광고를 중복 삽입할 수도 있는 상황까지 경험했습니다.
그 일을 계기로 현재는 Ad Inserter 플러그인을 활용해 광고를 중앙에서 관리하는 방식으로 바꾸었습니다. 결론부터 말하면 지금은 훨씬 편합니다.
특히 워드프레스 초보자라면 애드센스 광고 삽입은 직접 HTML로 관리하는 것보다 워드프레스 Ad Inserter 플러그인 하나로 정리하는 것이 훨씬 안정적이라고 사실을 느끼게 될 것입니다.
왜 Ad Inserter를 사용하게 되었는가
처음에는 단순히 애드센스 광고를 넣기 위한 목적이었습니다.
당시에는:
- 사용자 정의 HTML 블록 생성
- 애드센스 코드 직접 삽입
- 패턴으로 저장
- 여러 글에 재사용
방식으로 운영하고 있었습니다.
문제는 저도 모르는 사이에 업데이트가 이뤄어 졌는지 모르겠으나, 워드프레스와 구텐베르크 업데이트 이후 발생한 것으로 개인적으로 생각 중입니다.
기존에는 편집기 안에서도 HTML 코드가 바로 보였는데, 며칠 전부터 코드가 보이지 않고 빈 화면처럼 표시되기 시작했습니다.
처음에는 광고 코드가 삭제된 줄 알았습니다.
그래서 쿠키 문제인가? 캐시 문제가 싶어서 관련 부분을 검색해서 제거했음에도 여전히 보이지 않았습니다.
실제로 다시 애드센스 코드를 넣을 뻔했고, 나중에 확인해 보니 기존 광고는 정상적으로 살아 있었습니다.
즉:
“편집기 표시 방식 문제”
였던 것입니다.
그 이후부터는 광고 코드를 글 내부에 직접 넣는 방식보다, 중앙에서 관리할 수 있는 구조가 필요하다고 느꼈습니다.
이 내용 관련하여, 아래 글에 정리해두었습니다.
저와 동일한 상황을 겪고 계신지 확인이 필요하시다면
아래 글 확인해 보세요.
● 워드프레스 사용자 정의 HTML 안 보임 – 애드센스 광고 사라짐
Ad Inserter란 무엇인가요?
Ad Inserter는 워드프레스에서 광고를 관리할 수 있도록 도와주는 플러그인입니다.
저처럼 초보자 분들을 위해서 워드프레스 Ad Inserter에 대한 개략적인 이해를 위해서 간단히 설명 드리며 시작해 보도록 하겠습니다.
쉽게 말하면:
“광고 코드를 저장해두는 중앙 관리 공간”
이라고 생각하면 이해하기 쉽습니다.
예를 들어:
- Block 1 → 본문 상단 광고
- Block 2 → 본문 중간 광고
- Block 3 → 본문 하단 광고
처럼 구분해서 애드센스 광고를 직접 제어하며 사용할 수 있습니다.
그리고 실제 글에서는 복잡한 HTML 대신 간단한 쇼트코드만 넣으면 됩니다.
예를 들면:
[adinserter block="1"]이런 방식입니다.
물론, 워드프레스 Ad Inserter 플러그인의 기능은 훨씬 더 다양합니다. 저처럼 수동으로 광고를 넣지 않아도 자동으로 다양한 옵션을 설정함으로써 보다 글에만 집중할 수 있도록 해주는 고마운 워프 플러그인 중 하나라 생각합니다.
Ad Inserter 설치 방법
워드프레스 관리자에서:
플러그인 → 플러그인 추가 or 플러그인 상단 메뉴 플러그인 추가
로 이동합니다.
검색창에:
Ad Inserter
를 입력하면 아래 플러그인이 나옵니다.
- Ad Inserter – Ad Manager & AdSense Ads
- 작성자: Spacetime
- 홈페이지 바로가기
[지금설치] 버튼을 눌러 설치 후 활성화합니다.
꼭 활성화 하셔야 해요~~
애드센스 광고 코드 넣는 방법
플러그인을 활성화하면 좌측 메뉴에:
[설정 > Ad Inserter]
메뉴가 생성됩니다.
(버전별로 다를 수 있으나, 현 워프에서는 설정에 있음)
Ad Inserter를 눌러 보셔요.
들어가 보면:
- Block 1
- Block 2
- Block 3
처럼 여러 개의 블록이 보입니다.
여기에 애드센스 광고 코드를 넣으면 됩니다.
예를 들어:
- Block 1 → 상단 광고
- Block 2 → 중간 광고
- Block 3 → 하단 광고
처럼 구성하면 관리하기 편합니다.
애드센스에서 광고 코드를 복사한 뒤 원하는 Block 안에 붙여넣고 저장하면 됩니다.
워드프레스 Ad Inserter Block 애드센스 광고코드 생성
Ad Inserter 화면을 보시면 아래와 같이 16 블록을 기본적으로 제공하고 있습니다. 여기에 우리가 필요한 정보를 넣으면 됩니다.
아래 그림 보면서, 그럼 만들어보도록 하겠습니다.
- Ad Inserter 화면에서 원하는 블록을 선택합니다.
여기서 저는 2번을 선택했습니다. - 해당 블록에 애드센스 광고 코드를 삽입합니다.
(애드센스 광고센터에서 만든 복사 & 붙여넣기 하세요) - ‘Manual‘을 선택합니다.
- ‘Shortcode’ 체크 활성화 합니다.
- [Alignment]에서 ‘Center’를 선택합니다.
- ‘Save Settings 1-16’을 눌러 저장합니다.
애드센스 수동 광고코드를 하나 생성하였습니다.
이와 같이 하시면 됩니다. 쉽지요?
실제 글에 광고 삽입하는 방법
광고 코드를 저장했다면 이제 글에서는 쇼트코드만 사용하면 됩니다.
예를 들어:
[adinserter block="2"]를 넣으면 Block 1에 저장된 광고가 출력됩니다.
이 방식의 장점은 상당히 큽니다.
기존처럼:
- HTML 직접 삽입
- 광고 코드 복붙 반복
- 패턴마다 코드 관리
를 하지 않아도 됩니다.
광고 수정도 Ad Inserter에서 한 번만 수정하면 전체 글에 반영됩니다.
패턴과 함께 사용하는 방법이 정말 편했습니다
개인적으로 가장 편했던 부분은 패턴과 함께 사용하는 구조였습니다.
예전에는 패턴 내부에 애드센스 HTML 코드를 직접 넣었습니다.
하지만 지금은:
[adinserter block="2"]처럼 쇼트코드만 넣고 있습니다.
이렇게 바꾸고 나니:
- 패턴이 훨씬 가벼워짐
- 광고 관리 편리
- 워드프레스 업데이트 영향 감소
- HTML 블록 문제 감소
장점이 있었습니다.
특히 나중에 광고 위치를 수정하거나 광고 종류를 변경할 때 정말 편했습니다.
위와 같이 만들어진 패턴은 한 곳에서 관리가 됩니다.
그 위치는 [모양 > 디자인 > 패턴]을 보시면 됩니다.
여러분도 확인하세요.
내가 관리하는 패턴을 보실 수 있습니다.
Ad Inserter를 사용하면서 가장 좋았던 점
실제로 사용해 보면서 느낀 가장 큰 장점은:
“광고 관리가 훨씬 단순해졌다”
는 점이었습니다.
특히 워드프레스는:
- 구텐베르크 업데이트
- 블록 에디터 변화
- GeneratePress 업데이트
- 캐시 플러그인 충돌
등으로 예상치 못한 상황이 발생하는 경우가 있습니다.
그런데 광고를 중앙에서 관리하게 되면 이런 문제에 대응하기 훨씬 쉬워집니다.
또한 초보자 입장에서도:
- 광고 위치 변경
- 광고 ON/OFF
- 광고 테스트
- 모바일 광고 관리
가 훨씬 편해집니다.
워드프레스 애드센스 운영 시 느낀 점
이번 경험을 통해 느낀 것은:
광고를 단순히 “삽입”하는 것보다,
“관리 구조를 어떻게 가져갈 것인가”
가 훨씬 중요하다는 점이었습니다.
특히 애드센스를 오래 운영할수록:
- 광고 위치 변경
- 광고 교체
- 광고 테스트
- 광고 최적화
작업이 반복되기 때문입니다.
그래서 지금 기준에서는 사용자 정의 HTML에 직접 광고 코드를 계속 넣는 방식보다, Ad Inserter 같은 광고 관리 플러그인을 사용하는 방식이 훨씬 안정적이라고 생각합니다.
마무리
워드프레스에서 애드센스 광고를 운영하고 있다면 Ad Inserter는 한 번쯤 꼭 사용해 볼 만한 플러그인이라고 생각합니다.
특히:
- 애드센스 초보자
- 광고 관리를 쉽게 하고 싶은 경우
- 패턴을 자주 사용하는 경우
- HTML 직접 관리가 부담스러운 경우
라면 더욱 편하게 느껴질 수 있습니다.
저 역시 처음에는 단순히 광고 삽입 용도로 시작했지만, 지금은 광고 관리 구조 자체가 훨씬 안정적으로 바뀌었다고 느끼고 있습니다.
<워드프레스 초보자를 위한 글 안내>
● 워드프레스 이미지 최적화 플러그인 Imagify 테스트 결과 확인
● 워드프레스 방문자 확인 깔끔하게 보기 위한 jetpack 옵션 설정하기
댓글 남기기