이번 포스팅은 최근에 운영중인 웹사이트에 구글 애드센스를 승인받고 적용했던 과정과 방법에 대한 포스팅입니다.

 

## ✅ Google Adsense 승인 과정

애드센스를 발급 받기 위해 새로 개설하는 블로그 같은 경우에는 애드센스 심사에 1주 ~ 2주 정도가 소요되고 웹 사이트의 컨텐츠가 어느정도 갖추어지지 않으면 심사에서 탈락한다고 합니다.

저는 블로그와 게임 전적검색 사이트인 [valin.kr](https://valin2.kr) 두 웹사이트를 심사했는데 평균적으로 애드센스 심사 통과까지 하루도 걸리지 않았는데 아래와 같은 이유 때문이라고 생각합니다.

 

1. SEO 최적화를 위한 Next.js 프레임워크 사용
 * Next.js의 SSR, SSG 렌더링 방식을 사용하면 쉽고 효율적이게 SEO 최적화를 할 수 있습니다.
 * [Next.js 환경에서 SSR을 활용하여 SEO 처리하기](https://www.chanstory.dev/blog/post/4)
2. google search console에 웹사이트를 등록하고 사이트맵 추가 및 색인 생성하기
 * google search console에 웹사이트의 사이트맵을 추가하나 웹 사이트의 URL을 검사하고 색인 생성을 요청하면 구글 검색 엔진이 웹사이트의 URL을 인지하고 노출도를 올려줍니다.
 * [개인 웹 사이트 구글에 검색되도록 하기](https://www.chanstory.dev/blog/post/13)
3. 지속적인 컨텐츠 제작
 * 블로그에도 작년 5월부터 꾸준히 포스팅을 하고 있고 게임 전적검색 사이트에도 작년 11월 쯤 부터 꾸준히 업데이트를 진행했는데 이러한 컨텐츠를 계속 제작하는게 하루만에 승인된 가장 큰 이유일 것 같습니다.
 * 꾸준하게 블로그나 웹사이트를 운영중이고 애드센스에 관심이 있으시다면 한번 신청해보세요. 쉽게 통과 할 수 있을거에요.


 

## 📌 웹사이트 소유권 주장

구글 애드센스 심사를 진행하셨다면 웹사이트의 소유권을 주장하기 위해 프로젝트에 ads.txt를 추가해주세요.

 

추가 방법은 매우 간단합니다. 구글 애드센스 페이지에서 ads.txt 내부에 입력할 텍스트를 제공하는데 프로젝트의 public 폴더 내에 ads.txt 파일을 생성한뒤 텍스트를 붙여 넣어주세요.

ads.txt를 인지하고 소유권이 확인되면 아래 이미지와 같이 승인됨 이라는 문구가 출력됩니다. ads.txt 승인까지는 구글 봇이 크롤링하는데 시간이 좀 걸리기 때문에 2일 ~ 3일정도 걸리는 것 같습니다.

![image.png](https://imagedelivery.net/R2WiK4wfRK3oBXTwjgzQfA/caf9d171-d118-4601-2fa6-e4985f920200/public)

 
더 궁금한 부분이 있다면 [ads.txt 가이드](https://support.google.com/adsense/answer/7532444?hl=ko)를 참고하시면 됩니다.







## 🎊 광고 제작하기
구글 애드센스는 웹사이트의 레이아웃을 자동으로 판단하여 봇이 생각한 최적의 위치에 광고를 자동으로 등록할 수 있습니다.
하지만 해당 기능은 웹사이트의 레이아웃을 망가트리는 경우가 많기 때문에 반드시 광고는 직접 추가해주어야합니다.

 

직접 광고를 추가 하기 위해 먼저 광고를 생성해보겠습니다.

구글 애드센스 페이지에서 광고탭을 선택한 뒤 일반적으로 많이 사용하는 인피드 광고를 선택해주세요.

![image.png](https://imagedelivery.net/R2WiK4wfRK3oBXTwjgzQfA/360d95c9-32f1-47a7-5c4a-9549ff99b200/public)


 
인피드 광고를 선택하시면 몇가지의 타입이 나오는데 예시를 확인하시고 원하는 광고를 선택해주시면 됩니다.
저는 측면 이미지를 선택했습니다.

![image.png](https://imagedelivery.net/R2WiK4wfRK3oBXTwjgzQfA/ab04a16b-04bf-4b3d-68e4-809a53d2e700/public)


 

다음으로는 광고의 스타일을 커스텀할 수 있는데 저는 기본 스타일을 사용했습니다.
원하는 스타일을 커스텀한 뒤 저장 및 코드 생성 버튼을 누르면 되겠습니다.

그럼 아래와 같은 화면이 나오는데 코드를 복사한 뒤 완료 버튼을 누르면 광고가 생성되고 코드를 프로젝트에 적용하면 광고가 노출되기 시작합니다.

![image.png](https://imagedelivery.net/R2WiK4wfRK3oBXTwjgzQfA/01d86081-dab1-4802-15b1-b45ff9bad600/public)






## 🖥 웹사이트에 광고 노출시키기
직접 광고 코드를 프로젝트에 적용해보겠습니다.

 

Next.js 프로젝트라면 광고를 사용하기 위해 코드의 최상단의 `<script>` 태그를 복사하고 프로젝트의 _document 파일의 `<Head>` 태그 안에 추가해주세요.
(_document 파일을 잘 모른다면 [https://nextjs.org/docs/advanced-features/custom-document](공식문서)를 참고해주세요.)

 
Next.js를 사용하지 않고 react 환경에서 진행한다면 public 폴더의 index.html 파일의 `<head>` 태그 안에 추가해주시면 됩니다.

 

다음으로는 광고 컴포넌트인 GoogleAd.tsx를 복사한 코드를 붙여 넣으며 아래와 같이 코드를 작성해주세요.
광고를 포함하고있는 컨테이너는 width는 조절할 수 있지만 height는 광고의 높이에 맞게 유동적으로 변할 수 있도록 스타일링 해주셔야합니다.
 

> GoogleAd.tsx
```tsx
import { useEffect } from 'react';

declare global {
 interface Window {
 adsbygoogle: any;
 }
}

const GoogleAd = () => {
 useEffect(() => {
 (window.adsbygoogle = window.adsbygoogle || []).push({})
 }, []);

 return (
 <div className="googleAd-container">
 <ins
 className="adsbygoogle"
 style={{ display: 'block' }}
 data-ad-format="fluid"
 data-ad-layout-key="-fb+5w+4e-db+86"
 data-ad-client="ca-pub-3131973401944410"
 data-ad-slot="5792448771"
 />
 </div>
 );
};

export default GoogleAd;
```


 

광고 컴포넌트 제작을 완료했으니 광고 노출을 원하는 페이지에 불러와 사용하시면 됩니다. 그리고 광고는 로컬환경에서는 출력되지 않으니 주의해주세요!!

 
 


## 🖐 마치며
오늘은 구글 애드센스 승인부터 적용 방법에 관련된 포스팅을 진행했습니다.

만약 수익목적으로 개발 블로그에 애드센스를 적용하려고 생각한다면 별로 추천하진 않습니다. 1년 이상을 꾸준히 개발 관련 포스팅을 하시는 분들도 애드센스 수익이 나지 않는다고 않아서..😥

그래도 단순히 광고 등록 경험을 해보고 싶다면 애드센스 등록은 적극 추천합니다!
수익은 없지만 내가 만들고 운영하는 웹 사이트에 광고가 등록되면 뭔가 뿌듯하고 더 열심히 포스팅 하고싶고 업데이트 하게 되더라구요😁

이번 포스팅은 최근에 운영중인 웹사이트에 구글 애드센스를 승인받고 적용했던 과정과 방법에 대한 포스팅입니다.

 

## ✅ Google Adsense 승인 과정

애드센스를 발급 받기 위

Next.js 프로젝트에 Google Adsense 적용하기