애드센스 심사를 통과하셨다면 이제 광고를 블로그에 붙이셔야 할 것입니다. 광고를 붙여넣는 위치는 정말 다양합니다. 최적의 위치는 글쓰기에 따라 달라지는 거 같습니다. 글이 많은 포스팅이 있고, 사진이 많은 포스팅이 있으니 이미지 광고와 텍스트 광고를 적절히 섞어주시면 되겠습니다. 본문에서 더 자세히 알려드릴테니 잘 따라오시기 바랍니다.
테슬라의 모든 정보를 모으는 블로그,
테정원을 검색하세요!!
글, 사진 및 이미지 ▶ CopyLeft(C) 김성훈
#CopyLeft(C)는 저작권의 반대 개념으로, 카피라이트(CopyRight)와 반대되는 말입니다. '지적소유권' 이 오히려 정보의 물길을 막는 장애물이 되고 있는 현실을 극복하기 위한 운동입니다#
#사진과 이미지의 일부는 퍼온 것도 있습니다#
블로그
애드센스 광고 붙이기 총정리 (FastBoot1.6.2)
일단 먼저 광고를 붙일 수 있는 포인트를 알아야 합니다. 그리고 PC에서 보이냐 모바일에서 보이냐 또한 중요합니다. 이 모든 내용을 통합하여 한번에 알려드리도록 하겠습니다. 많은 분들이 (1. 본문 우측 상단), (2. 본문 하단), (3. 본문 중간), (4. 홈화면 상,중,하,), (5. 글목록 상,하), (6. 사이드바), (7. 사이드바 우측 빈공간) 이렇게 글을 7개로 쪼개어서 가이드 글을 쓰시던데 전 그냥 한번에 총정리해서 알려드리도록 하겠습니다.
숲을 먼저 보고나서 나무를 봐야 더 잘 볼 수 있다고 생각합니다. 먼저 광고 위치부터 그림으로 알려드리겠습니다.
스킨 : FastBoot1.6.2를 사용하시는 분은 무난히 적용되나 그외 스킨을 사용하시는 분들은 본인의 노하우로 적용시키시기 바랍니다.
먼저 본문에 광고 넣는 방법을 시작으로 사이드바, 사이드바 우측, 홈화면, 글목록 순으로 알려드리도록 하겠습니다.
본문 우측 상단, 본문 하단, 사이드바(1,2), 사이드바 우측
본문 상단에 336x280 두개를 넣거나, 본문 우측 상단에 336x280 하나를 넣는 경우가 있습니다. 모바일에선 300x280을 중간에 뜨도록 하거나, 우측에 200x200 이나 180x150을 뜨도록 할 수 있겠습니다.
본문 우측 상단 336x280 모바일 중앙 300x250
PC는 336x280 모바일은 300x250.txt첨부 파일을 다운받아서 열어놓기 바랍니다.
첨부된 본문 우측 상단 336x280 모바일 중앙 300x250 파일을 열면 ★별표와 ●동그라미가 보일 것입니다. 애드센스에서 광고를 만들 때, 반응형으로 만드시면 어떤 것인지 바로 알아차릴 수 있을 것입니다. 애드센스 반응형 광고는 두번째 그림과 같이 설정하고 저장 및 코드 생성을 클릭하시면 코드가 나옵니다.
블로그 관리에서 (꾸미기 -> 스킨편집 -> html편집)으로 갑니다.
Ctrl+f를 눌러서 article_rep_desc를 검색합니다. 찾은 부분 바로 위에 수정한 메모장 내용을 복사해서 붙여줍니다. 저장을 클릭합니다.
위와 같이 PC(768이상)에선 우측 상단에 위치하고, 모바일(768미만)에선 상단 중앙에 위치하게 됩니다.
본문 하단 PC와 모바일 100%x280
이번엔 본문 하단에 가로는 AUTO로 최대 크기 세로는 280으로 두꺼운 광고를 넣는 방법을 알려드리겠습니다. 첨부 파일을 다운받아서 열어놓기 바랍니다.
첨부된 파일을 열면 ★별표와 ●동그라미가 보일 것입니다. 애드센스에서 광고를 만들 때, 반응형으로 만드시면 어떤 것인지 바로 알아차릴 수 있을 것입니다. 애드센스 반응형 광고는 두번째 그림과 같이 설정하고 저장 및 코드 생성을 클릭하시면 코드가 나옵니다.
티스토리 블로그 관리에서 플러그인을 클릭합니다.
구글 애드센스(반응형)을 선택합니다. 하단 광고를 클릭하고 복사한 코드는 붙여넣습니다.
하단 광고가 PC와 모바일에 각각 나타난 모습니다.
이젠 사이드바에 광고를 넣어보겠습니다.
사이드바
첨부 파일을 다운받아서 열어놓기 바랍니다.
이번에도 반응형 코드를 생성하여 첨부파일에 ★, ●를 수정하고 복사해줍니다. 폭은 나중에 적용해보고 맞지 않다면 수정하시기 바랍니다.
이번엔 티스토리 블로그 관리에서 플러그인에 들어가 배너 출력을 적용합니다.
HTML 배너 출력을 선택하고 편집을 클릭하여 복사한 코드를 붙여넣습니다.
사진과 같이 사이드바에 애드센스 광고가 붙여졌습니다.
이제 사이드바 우측에 광고를 넣어보도록 하겠습니다.
사이드바 우측
첨부 파일을 다운받아서 열어놓기 바랍니다.
반응형 광고를 생성하여 첨부파일에서 ★,●를 수정한 뒤 코드를 복사해놓습니다.
티스토리 블로그 관리에서 HTML/CSS편집을 클릭합니다.
Breadcrumb를 검색하여 찾고, container 바로 아래에 복사한 코드를 붙여주시면 됩니다.
사진과 같이 사이드바 우측에 광고가 뜨게 됩니다. 모바일에선 광고가 많으면 느려지기 때문에 일부러 뜨지 않도록 하였습니다.
본문 중간
본문 중간에 글을 읽는데 방해되지 않는 선에서 광고를 넣는 방법을 알려드리겠습니다.
모바일에선 화면 반정도 나와서 독자들이 읽는 데에 불편함을 줄였습니다. 사진이 든 포스팅 보다는 글이 많이 든 포스팅에 적합합니다. 이제 첨부 파일을 다운받아서 열어놓기 바랍니다.
반응형 광고를 생성하여 첨부파일에서 ★,●를 수정한 뒤 코드를 복사해놓습니다.
먼저 글쓰기를 하면서 광고를 넣을 자리를 '여기'라고 표시를 합니다. 그런 후 HTML로 전환하여 줍니다.
Ctrl+f를 사용하여 '여기'를 검색하여 코드를 붙여넣어주면 되겠습니다.
그러면 사진과 같이 PC와 모바일 화면에 광고가 뜨게 됩니다.
글목록 상단, 하단
카테고리 상급 폴더를 선택했을 때 뜨는 글목록 화면에 광고를 넣어보겠습니다.
글목록 상하단
첨부 파일을 다운받아서 열어놓기 바랍니다.
상단엔 권장크기의 반응형, 하단엔 반응형 링크의 코드를 생성하여 첨부파일에 있는 ★,●를 수정해줍니다.
티스로티 블로그 관리로 들어가 HTML/CSS편집을 클릭해줍니다.
Ctrl+f를 이용하여 '추천 광고위치 2'를 검색합니다. '추천 광고위치 2' 아래에 복사한 코드를 붙여줍니다.
사진과 같이 글목록 상하단에 광고가 들어갑니다.
홈화면 상,중
먼저 블로그 관리에서 HTML 편집으로 가주시기 바랍니다. Ctrl+F로 enableTedition을 검색해주시기 바랍니다.
/*
---------- T-Edition Enable
false: Use FastBoot Index (Default)
true: Use T-edition
-------------------------------
*/
var f_enableTedition = true;
enableTedition 뒤에 false라고 되어있을텐데 true라고 바꿔주시기 바랍니다.
첨부 파일을 다운받아서 열어놓기 바랍니다.
반응형 광고 코드를 두개 생성합니다.
티스토리 블로그 관리에서 꾸미기 설정에 들어가 티에디션 설정하기를 클릭합니다.
먼저 상단에 칸을 생성합니다. + 표시를 눌러서 칸을 만들고 칸을 선택한 뒤에 목록형 3줄짜리를 선택합니다.
디자인을 선택하고 HTML을 클릭하면 코드 넣는 곳이 나옵니다. 상,하단 해당하는 코드를 넣으시면 되겠습니다.
사진과 같이 광고가 표시됩니다.
이상으로 7가지 광고 넣는 방법에 대해
알아봤습니다. 수고하셨습니다.
카카오 플러스 친구 버튼을 만들어놨습니다. 댓글로 물어보기 힘든 부분은 더욱 편하게 물어보세요! (예, 사진으로 설명해야할 경우)
애드센스 & 스냅북 관련글 링크
도움이 되셨다면 로그인 없이 가능한
아래 하트♥공감 버튼을 꾹 눌러주세요!
'블로그 > 애드센스' 카테고리의 다른 글
| 스냅북으로 애드센스 심사 통과하는 방법 2탄 (11) | 2017.10.06 |
|---|---|
| 애드센스 구글 게시자 툴바 설치 (2) | 2017.09.26 |
| 애드센스 페이지 수준 광고와 일치하는 콘텐츠 광고 (26) | 2017.09.24 |
| 네이버, 구글 애널리틱스 등록하기 (2) | 2017.09.20 |
| 애드센스 새 사이트 추가하기 (4) | 2017.09.20 |
| 티스토리 검색엔진 최적화 시키기 (16) | 2017.09.19 |
| 애드센스 심사 신청하기! (71) | 2017.09.18 |
