광고배너를 삽입(포스트: hexo블로그에 쿠팡광고 적용하기)해보면서 Hexo 프레임워크에 대해 훨씬 더 이해를 하게되었다. ejs 파일 형식에 대해 잘 모르지만, ejs 파일들을 보니 자바스크립트 코드로 구성되어 있었다. 짧게 구글링해보니 ejs는 Embedded JavaScript의 약자로 자바스크립트가 내장된 템플릿엔진이라는 설명을 보았다. 그래서 <% %> 안에 자바스크립트를 넣어서 사용할 수 있었다.
음 자바스크립트를 적용할 수 있다면 광고배너도 여러가지를 넣어두고 조건에 따라 배너를 노출시킬 수 있지않을까? 라는 생각이 들었다. (자본주의 러버)
현재 블로그엔 광고 배너 3개를 노출하고 있다. 두개는 사이드바에, 하나는 아티클 안에서 노출하고 있는데, 시험삼아 사이드 상단에 노출되는 광고를 시간에 따라 다르게 출력해보려고 한다.
퇴근시간 전에는 책과 사무용품을 보여주는 광고를 출력하고, 퇴근시간 이후에는 뽐뿌를 부르는 애플제품을 노출하기로 했다.
사이드바 상단의 광고는 layout/common/sidebar.ejs에 작성하면 된다.
각 영역별 코드는 이렇게 된다. 따라서 이 사이(빨간색으로 마크한 영역)에 광고코드를 작성하면 된다.
자바스크립트에서는 Date() 함수를 통해 현재 시간을 가져올 수 있다. Date() 함수엔 시각(시간/분), 요일 등을 가져올 수 있는 함수를 내장하고 있는데, 시간을 가져올것이므로 여기서는 getHours를 사용하면 현재 시간을 가져올 수 있다.
localhost에서 테스트해보니 원하는대로 광고가 출력됨을 확인할 수 있었다.
지난해에 hexo 블로그를 시작하면 처음에 번거로웠던 기억이 나는데, 노출이 쉽지않다는점을 제외하면 혼자 독학하며 운영하기엔 괜찮은 블로그 툴이라고 생각한다. 언젠가 비개발자들도 따라할 수 있는 hexo 프레임워크 강좌를 유튜브에 올려볼까 한다..^^ (언젠가…)