투명한 기부를 하고싶다면 이 링크로 와보세요! 🥰 (클릭!)
바이낸스(₿) 수수료 평생 20% 할인받는 링크로 가입하기! 🔥 (클릭!)
에드센스..로 말할 것 같으면 검토중에 무한 검토에 빠지는 문제가 생겼거나,
부적합 판정을 받았을 때 혹은 중도에 광고 중단, 정책위반이나 컨텐츠 부족 등의 여러이유로 광고 개제가 되지 않는 문제가 생길 수 있는 광고주이다.
따라서 대체제로 다양한 광고를 생각해 볼 수 있는데 그 중 하나가 클릭몬이다.
우선 이전 포스트에서 텐핑을 추천했는데, 텐핑과 마찬가지로 처음 광고를 달기 전 심사까지 소요되는 시간이 없고, (심사를 하기는 하는데 광고 노출 자체는 그 전부터 시켜줌)
그렇기 때문에 심사에 지친 우리들을 위해서 딱 알맞다고 생각했기 때문이다.
이제 클릭몬에서 사이드바 광고를 달기 위해서 필요한 절차들을 하나씩 소개하도록 하겠다. ( + 꿀팁 포함 )
1. 가입하기
당연히 가입을 해야한다.
https://www.clickmon.co.kr/
으로 가서 가입을 진행하자.
뭐 이렇게 저렇게 적당히 쓰면 가입이 진행된다.
2. 스크립트 받아오기
가입을 한 후에
상단에 보면 Web 배너라는 곳으로 들어가자.
그리고 나면 자기 web 광고물 선택 란에서 적당한 크기를 선택하자.
나는 일반형 250*250을 선택했다.
기호에 따라서 다양한 선택을 할 수 있다.
알맞은 사이즈를 선택했다면, 해당 자바 스크립트 형식의 소스 코드를 복사 해놓자.
3. 티스토리 세팅
우선 배너 출력 티스토리 플러그인을 활성화 시켜 놓자.
그러면 티스토리 관리에 사이드바 부분을 들어갔을 때
HTML 배너출력이라는 것이 활성화 되어 있을 것이다.
그렇다면 이 + 버튼을 클릭하고 알맞은 사이드바 위치를 선택한 후에 [ 편집 ] 을 들어가자.
그리고 HTML소스 창 안에 아까 복사했던 스크립트를 붙여 넣으면 된다.
붙여넣고 저장을 한 후 내 홈페이지에 가보면 제대로 광고가 출력되는 것을 볼 수 있다.
4. 디자인 꿀팁
나같은 경우에는 그냥 불여넣었을 때에는 디자인적으로 마음에 안드는 부분이 있어 조금 수정을 했다.
- 가운데 정렬
기본적으로 스크립트를 붙여 넣으면 왼쪽 정렬인 상태로 유지 되는데 가운데 정렬을 하기 위해서는 스크립트를 붙여넣을 때,
<div style="text-align:center;width:100%;font-size:0px;">
<span style="display:inline-block;">
스크립트 내용
</span>
</div>
이렇게 세트로 묶어서 전부를 붙여넣으면 된다.
- 테두리 둥글게
또한 내 블로그 사이드바는 테두리가 둥글기 때문에 가운데 정렬을 하고 광고창 자체에도 테두리 둥글게가 필요해서 모서리 또한 둥글게 바꿔주었다.
다만 이 경우에 모서리만 둥글게 바꿔주면 원래 오리지날 광고에 네모난 테두리가 있을 경우에 모서리 귀퉁이만 사라지는 현상이 발생해서 자체적으로 얇은 테두리를 추가적으로 만들어 주었다.
max-width:250px;max-height:250px;
아래 소스 코드의 이 부분의 픽셀을 본인의 광고 픽셀 크기로 바꾸면 된다.
<div style="text-align:center;width:100%;">
<span style="border:1px solid #ccc;border-radius:10px;overflow:hidden;max-width:250px;display:inline-block;max-height:250px;">
스크립트 내용
</span>
</div>
그러면 원래 이렇게 테두리가 있던 광고 또한 무리없이 예쁘게 볼 수 있게 된다.
+ 쓸데없는 디자인 욕심. 사이드바 두개 예쁘게 이어붙이기.
그냥 또 이런 저런 디자인적인 도전이 하고 싶어서 또다른 시도를 해보았는데
이렇게 두 개의 광고를 마치 하나처럼 이어붙여서 양쪽으로 보이게 하고 싶었다.
이건 120*600짜리 세로 광고바 두개를 이어 붙인것이다.
역시 아까와 같이 아래 픽셀만 본인의 광고 크기에 맞게 수정하자.
max-width:120px;max-height:600px;
<div style="text-align:center;width:100%;font-size:0px;">
<span style="border-width:1px 0px 1px 1px ;border-style: solid;border-color:#ccc;border-radius:10px 0px 0px 10px;overflow:hidden;max-width:120px;display:inline-block;max-height:600px;">
스크립트 1
</span>
<span style="border-width:1px 1px 1px 0px;border-style: solid;border-color:#ccc;border-radius:0px 10px 10px 0px;overflow:hidden;max-width:120px;display:inline-block;max-height:600px;">
스크립트 2
</span>
</div>
그럼 우리도 짱짱 사이드바 광고를 달고 있는 블로그를 운영해보도록 하자 ^0^7
질문은 댓글로 !
