PC에서 티스토리 블로그에 글을 읽을 때 사이드바가 계속 따라다니는 걸 볼 수 있다. 대체 왜? 사이드바를 따라다니게 하는 걸까? 그 이유는 애드센스 광고를 사이드에 넣고 고정을 시키면 글을 읽을 때마다 따라다니며 노출이 되기 때문이지 않을까 한다. 그래서 나도 한번 해보고자 알아보게 되었다.
그래서 대체 어떻게 하는걸까? 일단 폭풍 구글링.. 검색을 잘 못한 건지 북클럽 스킨에 대해서는 정보가 엄청 많았는데 오디세이 스킨은 신규 스킨이라 그런지 정보가 많이 없었다.
이것저것 검색하다가 상단 고정하는 방법도 찾아봤지만 필요하지 않을 것 같아 적용하지 않았다. 그럼 아래 코드를 어디에 적용하면 사이드바가 고정되는지 알아보자.
css 코드로 사이드바 고정하기
▼ 코드를 적용하기 전엔 아래와 같이 사이드가 스크롤을 내리면 고정되지 않고 내려간다.
여기서 사이드바만 고정하고 싶다면 아래 경로를 통해 코드를 넣어주면 간단하게 해결 가능하다. 우선 [블로그관리] > [스킨 편집] > [HTML수정] > [CSS] 경로로 이동해준다. 그 후 아래와 같이 수정해 주면 끝난다. 코드만 알면 너무 쉽..다..
/* 사이드바 고정*/
@media screen and (min-width: 1061px)
{.wrap-right .area-aside { align-self: flex-start; position: sticky; top: 32px; height:100%}}
#wrap {overflow: auto; overflow-x: hidden; height:100%;}
/* 사이드바 고정 끝*/
▼ 코드 적용 후 사이드바 고정된 화면이다.
이상 티스토리 블로그 오디세이 스킨 사이드바 고정 방법에 대해 알아봤다. 어려울 줄 알았는데 생각보다 너무 쉬웠다. 나중에 스킨을 수정할 때 까먹지 않도록 계속 기록해 두어야겠다.
▶티스토리 블로그 관련 글
티스토리 블로그 구글 서치 콘솔 검색등록으로 노출량 늘리기
티스토리 블로그 네이버 웹사이트 검색 등록 하기 (feat. 검색로봇 오류해결)
티스토리 블로그 줌 (ZUM), 빙 (Bing) 검색 등록 하기
티스토리 블로그 구글 애널리틱스, 네이버 애널리틱스 설정하기
티스토리 애드센스 광고 설정방법 (feat. 사이드바 수동설정)
티스토리 애드센스 인피드 광고 설정방법 (feat. Odyssey 스킨)