HexoにGoogle Adsenseをセットアップする
はじめに
こんにちは。インフラエンジニアレベル１のf_prgです。 Hexoに、Google Adsenseを設定して広告をつけようと思います。
HexoにGoogle Adsenseをセットアップする
Google Adsenseの広告設定は済ませている前提で進めていきます。 HTMLのコードは取得できる状態ということです。
組み込む方法は？
EJSテンプレートエンジンを使っていますのでテーマに テンプレートを追加します。
テンプレートに新規のフォルダを作ります。
後で管理しやすいように、新規のフォルダにして customと名前をつけておきます。
themes/landscape/layout/_custom_ad/google_adsense.ejs
ad.ejsの中身には、Google AdsenseのHTMLのコードだけです。
layout.ejsを編集する
themes/landscape/layout/layout.ejs
<%- partial('_partial/head') %><body> <div id="container"> <div id="wrap"> <%- partial('_partial/header', null, {cache: !config.relative_link}) %> <!-- ad start --> <%- partial('_custom_ad/google_adsense') %> <!-- ad end --> <div class="outer"> <section id="main"><%- body %></section> <% if (theme.sidebar && theme.sidebar !== 'bottom'){ %> <%- partial('_partial/sidebar', null, {cache: !config.relative_link}) %> <% } %> </div> <%- partial('_partial/footer', null, {cache: !config.relative_link}) %> </div> <%- partial('_partial/mobile-nav', null, {cache: !config.relative_link}) %> <%- partial('_partial/after-footer') %> </div></body></html>これでおしまいです。
まとめ
広告をはると、ブログっぽくなりますね。 今回紹介した方法が、ページに自由度が生まれて活用できそうです。
補足、おまけ
今回は、ありません。