티스토리 사이드바 광고, 스크롤해도 고정시키는 방법

티스토리 사이드바 광고, 스크롤해도 고정시키는 방법

 

 

블로그를 운영하시는 분들이라면, 광고 수익을 위해 사이드바 배치에 많은 고민을 하실 겁니다. 특히, 방문자가 스크롤을 내려도 눈에 띄는 고정 광고는 효율적인 수익 증대에 크게 기여할 수 있죠. 오늘은 이런 고정 광고를 티스토리 블로그에서 어떻게 설정하는지에 대해 자세히 알아보겠습니다.

 

 

티스토리 사이드바 광고 고정하는 방법

 

 

 

 

먼저, 이 설정은 북스킨을 사용하는 티스토리 블로그에서만 적용 가능합니다. 북스킨은 그 구조가 CSS 수정을 통한 다양한 커스터마이징을 지원하기 때문에, 광고 고정 같은 기능도 손쉽게 추가할 수 있습니다.

 

본론으로 들어가서, 사이드바에 있는 광고를 스크롤해도 항상 같은 위치에 고정시키려면 몇 가지 CSS 코드를 추가해야 합니다.

 

 

1. 블로그 관리 → 꾸미기 → 스킨편집 클릭

 

 

2. 오른쪽 상단 html 편집 버튼 클릭

 

 

 

3. 상단의 CSS 클릭

 

 

위에서 CSS 클릭 후 보이는 코드들 맨 아래 부분에 아래의 코드를 복사하여 여러분의 티스토리 블로그 CSS 설정에 추가해 주세요.

 

 

#aside{
    position : sticky;
    position : -webkit-sticky;
    top :  -60px;
}

 

#aside는 사이드바를 지칭하는 ID이며, position: sticky;는 스크롤을 내려도 해당 요소가 뷰포트 내에서 고정되도록 하는 속성입니다. top: -60px;는 광고가 화면 상단에서 얼마나 떨어져 있을지를 지정하는 부분입니다. 이 값을 조절하여 광고의 위치를 원하는 대로 조절할 수 있습니다.

 

스크롤 진행해도 사이드바 광고 고정된다.

 

 

 

이렇게 설정을 마치면, 방문자가 페이지를 아무리 스크롤해도 사이드바에 배치된 광고가 항상 보이게 되어, 광고 노출 빈도와 클릭률을 높일 수 있습니다.

 

 

끝으로

이번 글을 통해 여러분의 티스토리 블로그 사이드바에 광고를 고정하는 방법을 알아보았습니다. 이 작은 팁 하나가 여러분의 블로그 운영에 큰 도움이 되어, 더 많은 수익을 창출하는 데 기여하기를 바랍니다. 항상 좋은 콘텐츠와 현명한 광고 배치로 방문자와 수익 모두를 만족시키는 블로거가 되시길 응원하겠습니다.

 

▼ 아래 블로그 정보도 보고가세요! ▼

 

무조건 블로그 방문하게 만드는 제목 후킹 전략 29가지

 

블로그 체류시간 2배로 만드는 어휘력 향상 꿀팁