앞서 티스토리 본문에 수동으로 광고 1개를 넣는 방법을 살펴봤다. 글만 써두고 전혀 신경 쓰지 못하다가 하나씩 시야를 넓혀가는 중인데 본문에 중간광고 1개를 넣는 것은 굉장히 쉬웠다. 한번 적용을 해보니 이제 여러 개를 넣어보고 싶은 욕심이 생겼다. 이번에 글을 쓰면서 글이 꽤나 길어져 이럴 때 너무 무리하지 않게 광고를 두세 개 정도 넣어주면 괜찮을 것 같았다. 아래 글은 본문에 광고를 1개 추가하는 방법에 관한 글이다.
https://bemylooove.tistory.com/4
티스토리 블로그 본문 중간에 광고를 추가해보자
티스토리 블로그에 자동광고로만 설정해 두고 아무것도 손 데지 않고 글을 써왔다. 어떻게든 수익을 올릴 생각을 해야 하는데 공격적이지 않은 성향 탓에 제자리걸음인 것 같아 한 개씩 시도해
bemylooove.tistory.com
1. 본문 중간(에티더) 활성화 확인
다시 기초로 돌아가서 먼저 애드센스관리의 광고설정에서 본문 중간(에디터) 부분을 활성화시켜줘야 한다. 아래 사진 부분처럼 해주면 되는 것이다.
(1) 설정에서 수익 하위 메뉴에 '애드센스 관리'를 클릭한다.
(2) 본문 중간 부분의 우측 바가 오른쪽으로 활성화가 잘 되어 있는지 확인한다.
2. 광고 1개를 넣어보자
(3) 광고가 삽입되길 원하는 곳에 본문 광고 하나를 먼저 추가해보자. 글 사이 원하는 광고 삽입 위치에 커서를 둔 후 상단 가로 점 세개 부분을 클릭한다.
(4) 하위 메뉴에 광고를 클릭한다.
(5) 아래와 같은 팝업창이 뜨면 아래 확인 버튼을 클릭한다. 아래와 같이 구글 애드센스 광고가 형성되었다.
*애드센스 광고 1개를 설정했고, 이제 한 개 더 넣어줘야 하는데 이제부터는 위와 같은 방법으로 하면 안 된다. 1개까지 위와 같이 쉽게 광고를 넣을 수 있고, 두 개부터는 HTML을 사용해야 한다.
3. 2번째 광고 넣을 곳 표시
2번째 광고를 넣을 곳에 표시를 해두자. 이제 HTML모드로 바뀌면 복잡해서 잘 알아볼 수 없기 때문에 몇 번째 광고인지 아래 '본문광고 02'라고 써 놓은 것처럼 잘 표시해두어야 한다. 광고를 연달아 5~6개 수동으로 달아보는 과정을 거치게 되면 무슨 말인지 잘 이해가 될 것이다. 필자도 지금 막 5개 정도의 광고를 연달아 달아 보니 확인하는 과정에서 좀 헷갈렸다. 그리고 광고가 표시가 안 되는 경우도 있어 광고를 좀 많이 넣었을 경우 확인을 해봐야 하는 과정을 거치게 된다.
(6) 본문에 2번째 수동광고를 넣을 곳에 커서를 두고 '본문 광고 02'라고 입력해서 표시를 해두었다.
4. 구글 애드센스에서 광고 HTMl 코드 만들기
HTML이 보기만 해도 골치가 아파 쳐서 나도 이 과정을 하고 싶지 않았지만 이 과정을 알아두고 서식으로 광고를 설정해 두면 앞으로 이런 수고를 할 일은 줄어들 테니 이 과정을 거쳐보는 게 좋다. 광고를 넣는 HTML코드는 구글 애드센스에서 설정하고 저장을 해서 필요할 때마다 복사해서 붙여 넣기 하면 된다.
(7) 구글 애드센스 홈페이지를 방문한다.
https://adsense.google.com/intl/ko_kr/start/
Google 애드센스 - 웹사이트에서 수익 창출하기
Google 애드센스의 웹사이트 수익 창출 기능을 사용하여 수익을 올려보세요. Google 애드센스에서 광고 크기를 자동으로 최적화하여 광고의 노출 및 클릭 가능성이 높아집니다.
adsense.google.com
(8) 구글 애드센스의 왼쪽 상단 설정 메뉴를 클릭한다.
(9) 왼쪽 메뉴의 광고를 클릭한다.
(10) 상단 광고단위 기준을 클릭한다.
(11) 신규광고단위 만들기에서 디스플레이 광고를 클릭한다.
(12) 수평형을 선택한다.
(13) 광고의 이름을 입력한다. (광고의 번호를 붙여주는 게 덜 헷갈린다. 수동광고를 2개만 붙여줄 경우라면 상관없지만 많이 지면 헷갈리기 마련이다. HTML에 똑같은 광고이름이 들어가게 되면 많이 헷갈린다.)
(! 4) 광고크기에 반응형을 선택한다.
(15) 하단 만들기 버튼을 클릭한다.
이렇게 하면 코드 생성이 완료된 것이다. 여기를 다시 사용하게 될 텐데 일단 넘어가자.
(16) 하단 완료 버튼을 클릭한다.
5. 만들어진 코드 복사하기
이제 코드가 다 만들어졌다. 아래처럼 만들어진 코드가 보일 것이다. 처음에는 어차피 같은 코드인데 하나 가지고 다수의 수동광고에 붙여봤다. 그런데 해보니 사람들이 순번을 붙여서 여러 개 만들어두고 사용하는 이유가 있더라. 이 부분은 일단 코드를 붙여보고 아래 다시 얘기하도록 하겠다.
(17) 만들어진 코드를 복사하라면 양괄호 부분을 클릭하면 된다.
(17-1) 본문 광고02에 대한 HTML이 보인다. 여기에서 왼쪽 하단 복사하기 버튼을 클릭한다.
6. 복사한 광고코드 블로그에 붙여 넣기
위 (6) 번에서 블로그 본문 중간에 커서를 두고 수동으로 공고를 붙여 넣고 싶은 부분에 '본문 광고 02'라고 입력했다. 이 부분을 HTML 모드로 변경한 후 검색을 해서 '본문 광고02'를 찾아준 후 그 자리에 구글애드센스에서 만들어서 복사해 놓은 광고코드를 붙여 넣기 하는 과정을 하면 된다.
(18) 상단 '기본모드'를 클릭한다.
(19) 하위메뉴가 나타나면 'HTML'을 클릭한다.
(20) 작성모드를 변경하겠냐는 팝업창이 뜨면 확인 버튼을 클릭한다.
HTML 모드로 변경되니 상당히 복잡하다. 그래서 미리 광고 넣을 표시인 '본문 광고02'라고 광고를 넣고 싶은 본문 중간에 넣어둔 것이다.
(21) ctrl + F를 눌러 '본문 광고02'를 검색한다.
(22) 아래처럼 '본문 광고02'가 잘 찾아졌다. 찾아진 부분을 드래그하여 선택 후 그 자리에 붙여넣기(ctrl+V) 하면 된다.
아래처럼 '본문 광고02' 부분이 변경된 것이 보일 것이다.
(23) 여기서 다시 상단의 HTML 모드에서 다시 기본모드로 바꿔준다.
(24) 기본모드에서 아래와 같이 보이는데 이 자리에 광고가 들어가게 된다.
(25) 글을 발행해서 표시된 공간에 광고가 잘 들어갔는지 확인해 보자. 이렇게 광고를 여러 개 삽입하는 과정을 해봤다.
광고가 2개 이상 들어가게 되면 애드센스에서 광고 코드를 만들 때 순번을 붙여 코드를 만들어서 저장해 두는 게 편리하다. 광고코드를 5개까지 넣어보니 코드를 넣는 과정과 확인하는 과정에서 굉장히 헷갈린다. 그리고 코드를 5개 넣었는데 광고가 안 나오는 경우도 있다. 이런 문제는 생각해보지 않고 이 과정을 거쳐 서식화해서 좀 간편하게 쓸 예정이었다.
수동광고 삽입 후 광고코드 깨지지 않게 방지하기 위한 코드 넣는 방법은 아래와 같다.
https://bemylooove.tistory.com/6
티스토리에 애드센스 광고코드 붙여넣기 후 광고가 안나올때, <div></div>와 코드 다시 붙여넣기
블로그에 글을 쓰다가 글이 길어지면 자동 광고로는 부족하다. 맨 앞과 맨 뒤에 붙는 게 자동광고인데 글이 길다면 미관을 해치지 않고서도 몇 개의 광고는 더 넣어줄 수 있다. 수동 광고를 1개
bemylooove.tistory.com
'How to' 카테고리의 다른 글
| 티스토리 애드센스 수동 광고 서식 만들어서 간편하게 넣자. feat.<div></div> (0) | 2024.11.26 |
|---|---|
| 티스토리에 애드센스 광고코드 붙여넣기 후 광고가 안나올때, <div></div>와 코드 다시 붙여넣기 (2) | 2024.11.18 |
| 티스토리 블로그 본문 중간에 광고를 추가해보자 (5) | 2024.10.09 |
| 티스토리 구글 애드센스 광고 승인이 지속적으로 안날경우 (6) | 2024.10.09 |
| 티스토리 블로그 네이버 서치어드바이저 간단체크 사이트설명, Open Graph, robots.txt 오류 문제 해결 (3) | 2024.08.18 |