WordPressのStinger8をカスタマイズ。Google Analyticsのコード挿入とgistでNoプラグインでソースコード表示。

WordPressのStinger8をカスタマイズ。先ずは基本的なところ3つをご紹介

先日の記事で、WordpressのStinger8というテーマをインストールするという内容のものを書きました。テーマをインストールする中で、親テーマと子テーマというものがあり、子テーマをカスタマイズすることで、テーマのバージョンアップがあったとしても親テーマを更新することで、子テーマに記載されたカスタマイズ内容がそのまま残るという話までしたと思います。

今回は、3つのカスタマイズを行いたいと思います。具体的にはこちらの3つです。

  1. Google Analyticsのトラッキングコードを入れる
  2. 記事一覧にGoogle Adsenseのインフィード広告を入れる
  3. 記事一覧のカスタマイズ(インフィード広告の下に下線を入れる、各記事にサイトを「サイトを見る」ボタンをつける

この3つについて説明をしていきます。まずは1.のGoogle AnalyticsのトラッキングコードをStinger8のテーマの中に埋め込むということをしていきます。

スポンサーリンク
スポンサーリンク

Google Analyticsのトラッキングコードを入れる

wordpressでブログをする人ならば必ず通る道ですね。自分のサイトにどれだけの人がアクセスしているのかを調べる方法としてGoogle Analyticsは初心者から玄人まで誰もが避けて通れません。

Google Analyticsのコードは、header.phpファイルの中のheadタグの直上に以下のコードを入れます。

そのコードもこのブログでご覧いただくのですが、Wordpressの記事にコードを表示させるためには、ちょっと手間がかかります。プラグインを使っても良いのですが、今回のコードはGithubのいちサービスである、gistというサービスを使いました。

使い方は以下のように行います。

GitHubとは

WordPressのブログの中にプログラムコードなどを入れるときにはプラグインを使用する方が多いようです。かくいう僕も以前はコードをブログの中に入れるときには、Crayon Syntax Highlighterというプラグインを使用していました。これは簡単にWordpress内にソースコードを入れることができるプラグインです。

でも最近の僕はできるだけプラグインの力に借りないようにするという方針ですので、GitHubにお願いをすることにしました。

では、GitHubについてWikipediaで調べてみました。

ソフトウェア開発プロジェクトのための共有ウェブサービスであり、Gitバージョン管理システムを使用する。 Ruby on RailsおよびErlangで記述されており、GitHub社によって保守されている。 主な開発者はChris Wanstrath、PJ Hyett、Tom Preston-Wernerである。 GitHub商用プランおよびオープンソースプロジェクト向けの無料アカウントを提供している。 2009年のユーザー調査によると、GitHubは最もポピュラーなGitホスティングサイトとなった。

要はプロジェクトマネジメント用の共有サービスです。gistはその中でもソースコード単体を共有するためのサービスです。

では、次にGitHubとgistの使い方について順をおって説明します。

GitHubのアカウントを作成しログイン

フリーのアカウントを選択

ここはなんでもいいけど、適当に回答か、Skipか

gistを選択

コードを入力

僕は、tabと2、No wrapを選択しました。tabインデントの種類で、2は半角スペース2文字分という意味だと思います。No wrapはもしソースコードが画面の右まで着てしまっても折り返しなしという意味です。

右上のコピーをクリックする

あとは、Wordpressの記事入力欄にペーストするだけです。ペーストするとこんな感じで表示されます。

こんな感じでソースコードが表示されます

なお、本来は2行目と8行目にトラッキングコードが記載されていますが、僕個人のトラッキングコードですので、「x」に置き換えました。

gistの良いところ

プラグインを使用しないのでwordpressが重くならない、他のプラグインと競合する心配をしなくても良いのがメリットでしょうか。あとはプラグインの作者次第で開発が止まってしまうことで使用できなくなり、途方にくれるということもなくなります。

gistのちょっと、、、という点

GitHubにアクセスして、、、という手間でしょうか。サイトが全て英語ですのでちょっとわかりにくいという点もマイナスポイントかもしれません。

あとは、GitHubがなくなってしまったときに途方にくれてしまいますが、このGitHubは開発者にとってはなくてはならないツールですのでなくなるということはないと思います。

終わりに

僕はGitHubで表示されている英語くらいであれば特に無理なく読むことができるので、gistのサービスは使い勝手は良いと思っています。

次回は、Stinger8の記事一覧の中にGoogle Adsenseのインフィード広告というものを埋め込む作業をしたいと思います。

コメント

タイトルとURLをコピーしました