컴퓨터 화면을 따라 다니는 광고 설정

 수익형 블로그를 하면서 가장 신경 쓰이는 부분이 아마도 방문자의 광고 클릭이 아닐가 싶습니다. 저도 다른 블로그나 유투브를 방문했을 때, 광고가 뜨면 잘 누르지 않게 되는데요. 그 이유가 뭘까 생각해보니 일단은 저에게 필요한 광고가 거의 뜨지 않습니다. 그리고, 눈에 잘 띄지가 않습니다.

 분명히 애니메이션도 들어 가고, 광고주들 나름대로 한눈에 광고가 들어 오도록 기획했을 텐데 말이죠. 조금 더 곰곰히 생각해보니 대부분의 블로그나 유투브에 붙는 광고는 개인들 계정이라 즉시 또는 5초만 지나면 광고를 보이지 않게 할 수 있습니다. 즉, 본인의 마음에 들지 않으면 없앨 수 있는 것이죠. 

 그렇다면 반대로 오래 보이게 해서 방문자에게 눈에 띄게 하면 좋을 확률이 높다는 생각을 하게 됩니다. 그래서 궁리 한 것이 계속 광고가 블로그 방문자에게 노출이 되게 하는 것이었고, HTML 문맹자인 저로서는 어떻게 접근해야 할지 막막했습니다. 그러다가 발견한 검색어는 '따라다니는 사이드바' 였습니다. 2주 정도 공부하다가 어제 제일 최적이라고 생각되는 블로그를 발견해서 적용 해 봤습니다. 

 저의 바램은 원하는 광고가 스크롤 하다가 본문 중간 쯤에 나와서 본문 끝까지 따라 오는 것이었는데, 그 경지에 알맞은 것은 아직 못 찾았고요. 위에 보시는데로, 타불라 광고가 본문 우측에 고정되어 스크롤을 해도 그 자리에 있는 방법입니다. 

 잘 아시겠지만 위와 같이 광고가 창에 고정 되는 것은 애드센스 정책에는 위반이 됩니다. 그러나 제가 직접 타불라 담당자에게 확인한 결과 'OK' 받았습니다. 

 다만 위의 이메일 발췌문에서 보듯이 다른 콘텐츠, 이미지만 가리지 않으면 되는 거 같습니다. 그렇다면 팝업도 되는지 다음주에 한번 물어 봐야겠네요. 

 여하튼 각설하고 위의 움짤처럼 광고를 창에 고정 시키는 방법을 알려 드리겠습니다.  

저는 'KIRINYAGA'님이라는 티스토리 블로그에서 도움을 받았고요. 개념이나 소스는 링크 타고 가서 받으시면 좋겠습니다. 이 글을 쓰는 이유는 여러번 해도 잘 않되어서 저처럼 HTML에 무지한 분들 포기 하지 말라고 쓰는 겁니다. 마음이야 무단으로 다 떠오고 싶지만 고마운 님의 자료를 그렇게 가져 오면 안될 거 같네요.

 'KIRINYAGA'님 블로그에 가셔서 

'사이드바에 넣을 거.txt' 및 'skin.css 에 넣을거.txt' 두 가지의 텍스트 파일을 다운로드 받으시면 됩니다. 

1. 티스토리 메뉴 > HTML/CSS 편집 > CSS로 들어가서 'skin.css 에 넣을거.txt'파일을 최하단에 넣어 주고 저장 합니다.

저는 움짤처럼 오른쪽에 광고를 나타나게 하려고 6번째 줄에 left:0px로 로 되어 있는 것을 right:200px로 바꾸고, 광고 폭이 263이라 4번째 줄의 width값만 263px로 바꿨습니다. 

2. '사이드바에 넣을 거.txt' 중간에 광고코드만 삽입해서 복사 한 후에 

티스토리 관리창 사이드바 메뉴로 가서 '[플러그인] HTML 배너출력'을 누릅니다.

 위에서 복사한 코드 그대로 HTML 배너 출력 > HTML소스에 넣고 확인 해주면 끝입니다. 

 아마 타불라 뿐만 아니라 애드센스 외에 왠만한 광고 플랫폼은 이 방법을 써도 큰 문제 없을 거 같습니다. 얼마전에 데이블에서도 이 방법 외에 제가 하고 싶던 스크롤 > 광고 출현 > 광고 따라오는 기술을 쓴 블로그를 봤습니다. 그래도 꼭 애드센스 광고에는 절대 적용하지 마시고, 각각의 광고 플래폼 담당자에게 문의 후 사용해 보시길 바랍니다. 

 아. 마지막으로 이렇게 컴퓨터 화면을 따라다니는 광고는 '스마트폰'에서는 출력 되지 않습니다.

 

 자 모든 블로거 여러분들 화이팅입니다.