그동안 써왔던 애증의 Square 스킨을 버리고 MaterialT Mark3 스킨으로 갈아타게 되어 새로운 스킨 나름대로 꾸미는 방법을 공유하려고 합니다.
MaterialT Mark3의 사이드바는 카드 형식으로 뭔가 슝~하고 날라와서 달라붙는 느낌입니다. 여기에 애드센스 광고도 넣어 보려고 하는데 사실 화면 제일 아래 내려가 있어서 그다지 광고효과는 크지 않을 것으로 생각되지만 어차피 남는 광고 넣어봤습니다.
위의 사진처럼 사이드바에 애드센스 광고가 나오도록 해볼건데 저 크기와 모양 그대로 사용하려면 아래의 텍스트 파일을 다운받아 사용하면 됩니다.
HTML 다운.txt다운을 받아 실행을 시키면 아래와 같이 보이는데 숫자 부분에 본인의 광고코드를 입력하여 사용하면 됩니다.
보통 데스크탑 화면에서는 336x280크기의 광고가 노출되고
MaterialT Mark3은 브라우저 가로 크기가 768이하가 되면 사이드바가 한줄로 바뀌는데 이때 맞춰서 광고크기가 카드 가로 넓이의 90%로 조절됩니다.
<h3><i class="ic-credit_card"></i> 애드센스</h3>
이부분은 카드 상단의 카드 네임과 아이콘 부분입니다. 아이콘은 credit_card 모양으로 했는데 별로 마음에 안들지는 않을 겁니다. 그래고 애드센스 부분을 수정하면 이름을 바꿀 수가 있습니다. 앞에 한칸 띄워 주는게 포인트!!
이제 이코드를 HTML/CSS 편집창에 넣어주면 됩니다.
HTML 편집창에서 ctrl+F로 검색창을 열어 '기본 사이드바' 를 검색하여 나오는 '이부분에 붙여 넣기' 부분에 붙여 넣은 다음 저장을 하면 됩니다.
이제 사이드바를 적용시키면 되는데 환경 설정의 꾸미기/사이드바에 보면 기존에 없던 '애드센스 모듈'이 추가 되어 있는 것을 볼 수 있다면 지금까지 제대로 한 것입니다.
모듈을 사이드바 1로 옮기고 저장을 하면 화면 아래 애드센스 광고를 볼 수 있을 것입니다.
최근댓글