메르세데스' blog

티스토리 메인 화면에 애드센스를 넣을 때 자동 광고와 수동 광고 단위를 선택하는 기준, 스킨 백업, 모바일 검증 방법을 정리했습니다. 오래된 예제의 의미는 살리되 현재 기준에서 잘못 적용하기 쉬운 부분을 함께 고쳤어요. 아래 순서대로 확인하면 단순한 화면 복사보다 실제 판단에 도움이 됩니다. 티에디션을 사용하던 과거 화면입니다. 현재는 사용 중인 스킨과 관리 기능을 기준으로 판단해야 합니다. 자동 광고와 수동 광고부터 구분한다 메인 화면에 광고를 넣는 방법은 크게 자동 광고와 수동 광고 단위로 나뉩니다. 자동 광고는 Google이 페이지 구조를 분석해 위치를 선택하고, 수동 광고는 운영자가 HTML 안의 위치를 정해요. 위치를 세밀하게 통제해야 한다면 수동 방식이 맞지만 스킨이 바뀔 때마다 다시 확인해야 합니다. 오래된 티에디션 안내는 당시 화면을 이해하는 기록으로는 쓸 수 있어도 최신 관리 메뉴의 사용 설명서가 될 수 없습니다. 현재 티스토리 관리 화면에서 제공되는 광고 기능과 사용 중인 스킨의 구조를 먼저 확인하세요. 스킨 편집 전에 복구 지점을 만든다 HTML을 수정하기 전 현재 스킨을 백업합니다. 광고 코드가 들어갈 메인 목록 영역을 찾은 뒤 한 번에 여러 위치를 고치지 말고 한 곳씩 적용하세요. 코드가 화면 편집기에 의해 꺾이거나 속성이 바뀌지 않았는지도 확인해야 합니다. 광고가 표시되지 않는다고 코드를 연속해서 붙여 넣으면 중복 스크립트가 생길 수 있어요. 사이트가 AdSense의 사이트 목록에 등록돼 있는지, 승인 상태인지, 광고 차단 확장 기능을 사용 중인지도 나눠 확인합니다. 메인 화면의 콘텐츠 흐름을 해치지 않는지 본다 광고가 첫 콘텐츠보다 크게 보이거나 메뉴와 너무 가까우면 방문자가 탐색하기 어렵습니다. 데스크톱에서는 괜찮아도 모바일에서 광고 폭 때문에 가로 스크롤이 생길 수 있어요. 홈, 카테고리, 개별 글을 각각 확인하고 광고와 콘텐츠가 오인되지 않게 간격과 문맥을 유지합니다. 권장 흐름 기본 제공 기능 확인 → 스킨 백업...

티스토리 카테고리 화면의 상단과 하단에 애드센스를 배치할 때 스킨 구조, 반응형 크기, 정책 위험을 확인하는 방법을 설명합니다. 오래된 예제의 의미는 살리되 현재 기준에서 잘못 적용하기 쉬운 부분을 함께 고쳤어요. 아래 순서대로 확인하면 단순한 화면 복사보다 실제 판단에 도움이 됩니다. 기존 스킨에서 사용한 광고 위치 예시입니다. 현재 스킨 구조와 광고 정책을 먼저 확인해야 합니다. 2015년 치환자 위치를 그대로 복사하면 안 된다 티스토리 스킨은 종류와 업데이트 시점에 따라 HTML 구조가 달라요. 과거 글에 나온 치환자나 특정 div 위치를 최신 스킨에 그대로 붙이면 광고가 중복되거나 모바일 화면이 깨질 수 있습니다. 작업 전 현재 스킨을 백업하고, 카테고리 목록을 감싸는 영역을 개발자 도구에서 먼저 확인하세요. 티스토리 관리 화면이 공식 광고 연동이나 플러그인을 제공한다면 직접 코드 삽입보다 그 방법을 우선하는 편이 유지보수에 유리합니다. 직접 수정은 현재 기능으로 원하는 위치를 구현할 수 없을 때만 선택하세요. 광고 코드는 HTML 보기에서 원형을 유지한다 Google은 광고 코드를 디자인 편집 화면이 아니라 HTML 소스에 넣고, 코드가 편집기에 의해 변형되지 않았는지 확인하라고 안내합니다. 광고 단위의 스크립트와 속성을 임의로 줄이거나 바꾸지 마세요. 반응형 광고라면 부모 영역의 폭이 너무 좁거나 display:none 상태가 아닌지도 확인해야 합니다. 카테고리 상단과 하단에 모두 넣을 경우 같은 광고가 콘텐츠보다 더 눈에 띄지 않는지 모바일에서 살펴보세요. 광고 클릭을 유도하는 제목이나 이미지와 광고를 혼동하게 만드는 배치는 피해야 합니다. 수정 후 세 화면을 확인한다 홈, 카테고리 목록, 개별 글 화면은 서로 다른 스킨 분기를 사용할 수 있습니다. 카테고리에서 잘 보이더라도 개별 글에 중복 삽입될 수 있어요. 데스크톱과 모바일 폭에서 세 화면을 모두 열고 레이아웃 이동, 가로 스크롤, 빈 광고 공간을 확인합니다. 작업 순서 스킨 ...