본문 바로가기

매거진 스킨 애드센스 일치하는 콘텐츠 광고 넣는 위치

gracenmose 2021. 9. 2.

스킨별 애드센스 일치하는 콘텐츠 넣는 위치 포스팅 시리즈입니다. 티스토리에서 기본 제공하는 10개 스킨에 대해서 애드센스 일치하는 콘텐츠 광고 단위가 떴을 때 넣는 위치를 정리하는 내용입니다.

 

(구독자를 위한 포스팅을 하고 있는데 제 블로그가 구독하시는 분들의 '피드'에 안 뜨는 문제가 매우 심각하게 발생하는 듯 하네요.. 다음이 카카오하는 이 버그는 과연 고치기는 할까요?)

 

알아두어야 할 사항

  • 모든 스킨 편집 내용은 '기본'값입니다. 즉, 스킨변경에서 적용 버튼 누른 순정 상태 기준입니다. 수동으로 HTML편집에서 몇 줄 넣었으면, 제 글에서 언급하는 위치에서 조금 뒤에서 찾으시면 됩니다.
  • HTML 편집 모드에서 검색을 하려면 편집창을 한 번 클릭 후 CTRL+F 를 눌러야 합니다. 
    이렇게 노란 창으로 떠야 함
    위와 같이 노란색으로 창이 떠야 제대로 찾을 수 있습니다.
  • 편집하기 전 실수를 방지 하기 위해서 미리 HTML 페이지 전체를 메모장에 복사해 두면 좋습니다.
    ▶ 관련글: 티스토리 스킨편집 할 때 꼭 해 두면 좋은 팁 (ft. 메모장)

 

반응형

 

매거진(Magazine) 스킨

매거진 스킨은 '시선이 돋보이는 매거진'을 만들 수 있다고 설명되는 스킨입니다. 역시나 이 스킨도 기본값으로 보여지는 모습이 아닌 커버리스트 중 하나를 사용한 미리보기여서 처음 적용하면 적잖이 당황할 것 같습니다.

 

빨간색으로 된 컬러셋이 기본 값이어서 아래 PC화면과 모바일화면을 보시면 빨간색으로 된 메뉴명들이 눈에 띌 겁니다. 해당 컬러셋은 블랙 또는 블루로도 변경이 가능합니다.

 

다양한 커버리스트를 지원하는데, 블로그홈에서는 사이드바가 없는 것처럼 보이다 실제 본문으로 들어가면 사이드에 최신글과 인기글이 사이드바로 노출이 됩니다. 

 

전반적으로 매우 깔끔한 스킨입니다. 

매거진 스킨
매거진 스킨 티스토리 설명

 

PC화면 모습

PC화면의 모습입니다. 기본값은 상단에 전체글로 4개가 대표 섬네일과 함께 제목, 작성일 기준으로 쭉 나열되어 있습니다. 기본값은 8개입니다. 글이 8개가 되면 4열 2행으로 표시가 되는 것으로 알고 있습니다. 그 아래로는 리스트 형태로 다시 해당 글들이 반복됩니다.

 

다양한 커버를 지원하기 때문에 블로그 홈페이지는 여러 형태로 변경은 가능합니다.

 

기본 화면 모습

 

카테고리 등은 우측 상단의 메뉴 버튼을 누르면 화면 전체를 덮어버리면서 카테고리, 메뉴 등이 나옵니다. 카테고리와 태그/방명록에 별다른 구분이 없는 것이 조금 아쉽긴 하네요.

메뉴 누른 모습

 

본문의 모습입니다. 홈에서는 없던 사이드바가 우측에 생깁니다. 애드센스 광고 사이드바를 넣으면 이 화면에서는 우측에 광고가 나오게 됩니다. 

본문 모습

빨간색으로 된 블로그 이름, 본문글 제목, 카테고리, 인기글, 최신글 등의 색상은 검정색이나 파란색으로 바꿀 수 있습니다. 

 

모바일 화면 모습

모바일에서의 모습은 기본 값은 위에 최근 글 8개가 나열되고 아래 리스트 형태로 또 한 번 나열됩니다. 이런 중복을 피하기 위해서는 목록만 나오게 하거나 내용만 나오게 하는 방식으로 설정을 조금 바꿔야겠네요. 사실 블로그 홈까지 가서 보는 경우는 많이 없지만, 중복 콘텐츠들이 노출되는 것이 조금 아쉽습니다.

 

왼쪽이 블로그 홈이고, 오른쪽이 본문의 모습입니다. 블로그이름을 강조하고 싶은경우 이 스킨을 쓰면 왼쪽 상단에 계속 나오니 각인 시키기는 좋겠네요. 제목도 별도의 제목 박스 없이 강조되어 시인성이 아주 좋아보입니다. 또한 제목박스가 크지 않아서 별도로 설정 건드리지 않으면 본문 첫부분이 화면에 보이겠네요.

모바일 화면

 

메뉴 버튼을 누르면 카테고리가 나오는 것은 PC하고 똑같습니다.

메뉴 버튼 누른 것

 

지원되는 커버리스트

커버리스트는 슬라이더 / 섬네일리스트1,2 / 슬라이드 리스트1,2 / 리스트 까지 여러개가 지원됩니다. 하지만 이름만 봐서는 대체 어떤 것인지 설명된 곳이 한 군데도 없는것이 현실이죠.

 

지원되는 커버 종류들

 

슬라이더는 대표 이미지를 배경으로 하고 제목과 본문 일부가 나오는 큰 이미지가 슬라이드 방식으로 나오는 방식입니다. 사진 콘텐츠가 중요할 때 써먹기 좋아보입니다.

슬라이더

 

섬네일리스트1 (아래 왼쪽)과 섬네일리스트2 (아래 오른쪽)입니다. 섬네일리스트1은 아주 큰 섬네일이, 2는 작은 섬네일이 제목을 더 강조하는 모습으로 들어가는군요. 개수는 설정할 수 있습니다.

섬네일 리스트1, 섬네일 리스트 2

 

슬라이드 리스트1, 2는 이미지를 세로로 길게 할 것인지 가로로 길게 할 것인지의 차이입니다. 화면을 넘어가는 부분은 마우스로 왼쪽으로 끌거나 손으로는 왼쪽으로 슬라이드 하면 넘어가는 형태입니다. 

슬라이드 리스트1, 2

 

애드센스 일치하는 콘텐츠 광고 넣는 위치

매거진 스킨은 일치하는 콘텐츠 광고를 넣기 위해 찾는 article_rep_desc 치환자가 두 번 나옵니다. 어느 위치가 맞는지 확인해 봅니다.

 

첫번째 위치

△ 첫번째 위치는 608번 행에 나오는데, 아래로 태그가 연결되고 있습니다. 바로 여긴데 다른 스킨들과 다르게 해당 치환자 앞에 공감버튼 등이 들어가는 코드가 들어가 있어서 조금 헷갈릴 수도 있겠네요. 매거진 스킨은 바로 이곳에 넣어야 합니다. 마침 넣기 편하게 609번 행이 비어 있기도 하네요.

 

두번째 위치

△ 두번째 위치는 831번 행에 나오는데, 아래쪽으로 '보호되어 있는 글'이라는 글자가 보입니다. 이런 글자 보이면 맞는 위치가 아닙니다. 

 

요약

  • 블로그 홈은 사이드바 없이 깔끔하고 본문에서 사이드바 등장(PC기준)
  • 스킨 설정 후 별도로 건드리지 않으면 최근글들이 위에 섬네일, 아래 리스트 방식으로 두 번 나오게 됨
  • 블로그 제목 등의 색상은 레드(기본), 블랙, 블루 선택 가능
  • 애드센스 일치하는 광고 코드는 첫번째 나오는 치환자 뒤임

 

 

[다른 스킨 글 보기]

그리드형(광고전용)

댓글