애드센스 일치하는콘텐츠 레이아웃 변경방법(반응형)

애드센스 일치하는콘텐츠 레이아웃 변경방법(반응형)

애드센스에서 제공하는 광고 중 가장 효과가 좋은 광고형태는 일치하는콘텐츠 광고입니다. 보통은 본문하단에 8개의 콘텐츠를 4열 2행으로 표시하고 클릭을 유도하게끔 한 뒤 3~4개의 광고가 삽입되는 형태인데요. 저도 티스토리 운영 20일만에 생겨서 연구중에 있다가, 구글애드센스 홈페이지에서 레이아웃을 변경할 수 있는 방법을 발견해서 공유해 드립니다.

 

 

일치하는콘텐츠는 데스크탑에서과 모바일상태에서 보여지는 갯수를 동일하지만, 열과 행을 코드수정을 해 줌으로써 조금더 모바일에 최적화된 모습으로 변경해주는 것을 추천 드립니다. 구글애드센스에서 생성한 일치하는콘텐츠 광고 코드에 약간의 매개변수를 직접 수정해 줌으로써 모바일환경에서 2열 형태로 나타남에따라 가독성을 극대화 시킬 수 있는 장점이 있습니다.

 

압도적인 모바일 검색

 

모바일 검색에 최적화 해야합니다!!

대부분의 검색 디바이스는 모바일임을 알고 그에 맞게 최적화 하는 작업이 필수입니다. 검색엔진에 노출되는 티스토리 블로그의 유입형태는 조금씩 차이는 있지만 제 블로그의 경우 압도적으로 모바일환경에서 노출이 되고 있는 것을 확인 할 수 있습니다. 여러분들 역시 구글애드센스로 접속을 해서 직접 확인 해 보세요.

 

 

 

 

왼쪽 : 1열로 된 광고형태 / 오른쪽 : 2열로 된 일치하는콘텐츠 광고 형태

 

따라서 일치하는콘텐츠 광고가 활성화 되신 분들께서는 위 사진과 같은 모바일 상태에서 본문하단에 2열로 표시되는 일치하는콘텐츠광고 형태가 훨씬 가독성이 좋다는 것을 미리 알려 드릴게요. 제가 생각해도 왼쪽 1열로 된 것은 신문기사같아서 가독성이 조금 떨어진다고 생각 했습니다. 구글애드센스 광고로 들어가서 직접 가이드라인 설명을 정독 후 그대로 실행을 하셨습니다. 

 

 

PC환경 데스크탑에서의 4열 2행이 가장 가독성이 좋음.

또한 일치하는콘텐츠 광고는 PC 데스크탑에서는 기존대로 4열 2행이 가장 효과적이고 가독성도 뛰어 납나다. 따라서 우리는 반응형으로 광고코드를 조금만 수정해서, PC데스크탑에서와 모바일 상태에서 디스플레이에 따라 반응형으로 바뀌는 레이아웃 작업을 해 보도록 할게요.

물론 열과 행은 개인 기호와 취향에 맞게 수시로 변경이 가능하나, 행의 수가 증가한다고 해서, 광고가 더 늘어나는 것이 아님을 인지하시길 바랄게요.  행이 늘어나더라도 광고의 수는 3~4개가 기본인 것 같습니다. 

 

 

 

반응형 일치하는콘텐츠 광고 만들기

 

우선 구글애스센스로 접속을 하셔서, 광고---> 광고단위기준 ---> 일치하는콘텐츠 순으로 클릭을 합니다. 일치하는콘텐츠는 일정수준 블로그의 트래픽이 유지되고 게시글도 최소 50개 이상은 유지가 되어야 생성이되는 광고이기 때문에, 지금 막 애드고시를 합격하신 분들은 1일 1포스팅 하다보면 자연스럽게 구글애드센스에 자동으로 생성이 됩니다. (저는 3일에 한번씩 들어가서 확인 했음 ㅋㅋ)

 

 

자신이 알아 볼 수 있는 제목으로 광고이름을 설정해 주시고, 수익창출 옵션키 활성화를 한다음, 크기는 반응형으로 체크해 주세요. 우선 광고크드를 받기 위한 작업이기때문에 크게 어려운 것은 없습니다. 

 

최종적으로 만들어진 일치하는 콘첸트 광고 코드가 생성 되었습니다. 클라이언트(Client)값과, 슬롯(Slot)값은 개인광고 번호이기 때문에 유출되지 않도록 주의 하세요 !!  우선 일치하는콘텐츠 광고 코드를 복사하였다면, 메모장에 붙혀넣기 해 주세요. 그대로 사용하면 모바일상에서 1열로 아래로 길게 나타나는 형태이기 때문에, 매개변수 코드를 덧붙혀 줄거에요!!

 

 

기본적인 일치하는광고 코드

메모장에 붙혀넣기 한 기본적인 광고코드 형태 입니다. 위에 붉은색으로 X 표시 한것은 개인 마다 고유한 애드센스 숫자가 적혀 있을거에요.

이 광고에다가 매개변수 3가지를 넣어주겠습니다.  

 

 

구글애드센스 매개변수값 설정

매개변수는 총 3가지를 삽입해 주어야 합니다. 레이아웃의 형태(스타일) , 행의 갯수, 열의 갯수 이렇게 총 3가지입니다.

반응형 일치하는 콘텐츠 단위를 맞춤설정하는 구글애드센스 가이드라인 바로가기는 링크 표시 해 둘게요!!

 

 

support.google.com/adsense/answer/7533385?hl=ko&ref_topic=9183242

반응형 일치하는 콘텐츠 단위를 맞춤설정하는 방법 - AdSense 고객센터

 

예를 들어,  첫번째 ui type 는 "텍스트위에 이미지표시" 라는 매개변수 값  image_stacked 이고, 두번째 행의 수는 숫자 4를 입력하고, 세번째 열의 수 값은 2를 입력한다면, 이미지밑에 텍스트가 작게 적혀 있는 2열, 4행의 일치하는콘텐츠 광고 매개변수가 생성되는 것입니다.

 

 

반응형 매개변수 값 설정

여기서 가장 중요한 것은 각각의 매개변수값을  콤마( , )로 한번 더 입력하는 것입니다. 다시말해, 광고 UI 타입에 노란색 글자로 image_stacked가 두번적혀 있음을 알 수 있습니다. PC환경과 모바일환경 모두 같은 스타일로 표시 된다는 뜻이고, 행의 수 매개변수값에 4와 2가 적혀 있는 것은 PC환경에서 행의 수는 4개이고, 모바일환경에서의 행의수는 2개라는 뜻이 되겠죠.

열의수도 마찮가지입니다. PC환경에서는 2열로 표시가 될것이고, 모바일환경에서는 4열로 표시가 된다는 뜻입니다. 결론적으로 위의 매개변수를 그대로 적용했을때, 모바일에서는 광고의 형태가 이미지 밑에 텍스트가 있는 스타일이고, 2열 4행이 되는 것이죠. 어렵게 생가하실 필요 없습니다. 직접 적용을 해 보면 금방 이해를 하실 수 있을 거에요 !!

 

결론적으로 위와 같은 코드로 최종 수정이 되어야 합니다. 녹색글씨와 노란색부분의 글씨를 한글짜도 빠짐없이 메모장에 옮겨둔 자신의 광고코드에 위 3가지 매개변수를 타이핑 해 주세요. 하나하나 타이핑 하는게 가장 빠르고 좋습니다. (눈이 조금 아플 수 있음) 매개변수값을 적용했다면, 전체 광고 코드를 복사해 줍니다.

 

 

 

광고코드는 플러그인을 활용 하자

일치하는콘텐츠 광고코드는 플러그인의 구글애드센스(반응형)을 활용 하세요. 어차피 블로그 글쓰기와 동시에 플러그인은 자동적용이 되기 때문에 일일히 광코코드를 직접 입력하지 않아도 되는 장점이 있습니다. 자신의 글 본문 하단에 일단 디스플레이 광고를 삽입하고 싶다면 글쓰기의 서식에 적어두고 적용하시는 것을 추천 드립니다.  본문의 가독성을 해치지 않게 일치하는콘텐츠광고는 본문의 하단에 위치하는게 가장 효과적이고 이탈률도 적다고 할 수 있습니다.

 

 

 

 

 

 

 플러그인 하단 광고삽입칸에 매개변수로 수정한 광고코드를 붙혀넣기 한 뒤, 변경사항 적용 버튼을 꼭 눌러주세요. 시간 딜레이 없이 바로 적용이 됩니다. 궁금하신 것은 댓글 남겨 주세요!!

 

 

적극 추천하는 콘텐츠