블로그

티스토리 스킨 CCZ-CROSS 사이드바 구글 광고 애드센스 가운데 정렬

탁이 2017. 8. 30. 11:54

안녕하세요. 탁이입니다. 티스토리 블로그의 스킨을 copycatz 님이 만드신 반응형 스킨인 CCZ-CROSS 으로 변경했습니다. 다시 구글 어널러틱스의 코드를 삽입하고 이것 저것 설정을 하다가 보니, 사이드 바의 애드센스가 다른 사이드바의 모듈과 같이 마진이 들어가서 한 쪽으로 치우쳐 있더군요. 돌아서면 잊어 버리는 저의 저용량 메모리를 위해, 혹은 같은 문제를 겪는 분들을 위한 포스팅입니다.




플러그인을 통해서 사이드바에 300폭의 광고를 넣으면 위의 이미지처럼 다른 사이드바 모듈과 같이 정렬이 돼 버립니다. 이럴 때는 아래와 같이, 관리화면의 HTML 편집화면으로 들어가서 직접 광고를 입력 (HTML) 하고, 위치를 모양좋게 수정 (CSS)해야 합니다.



먼저 위와 같이 HTML수정화일로 들어가, 사이드바의 부분을 찾습니다. 원하는 위치를 확인하시고 구글 애드의 소스코드를 입력합니다. 입력할 때 이 구글 애드가 사이드바의 요소임을 알려주기 위해 

<s_sidebar_element> </s_sidebar_element>로 싸아 주시면 됩니다. 


위와 같이 수정하면 아래와 같이 다른 사이드바 요소들로 부터 빠져나와(?) 이번에는 홀로 디폴트인 왼쪽정렬이 되게 됩니다. 혹시 처음접하시는 분들을 위해 한가지 더 알려드리자면, 이 요소가 다른 사이드바 요소(워드프레스에서는 위젯)와 별도로 css화일로 모양(위치)을 컨트롤하기 위해서는 아래와 같이 태그를 붙여놔야 하는데요.

<div class=module module_ad> </div>

    로 클래스를 지정해 둡니다.



여기서 모양을 잡아주는 CSS 로 들어가셔서, 

.module-ad {margin-left: 10px; margin-right: 15px} 

를 입력합니다.



그러면 짜잔~하고 아래와 같이 보기 좋게 가운데로 정렬된 광고를 보게 되실 겁니다.