このページの本文へ

WordPress&MTにLPOを導入しよう! (1/2)

2009年02月09日 08時00分更新

文●sato165(佐藤裕子)

  • この記事をはてなブックマークに追加
本文印刷

 Webサイト運営者の間で急速に関心が高まっている「LPO(Landing Page Optimization:ランディングページ最適化)」。この特集では2回にわたって、LPOの基本的な考え方から必要な技術、自分で手軽に試せる実装方法までを紹介してきました。

 最終回となる今回は、これまでの2回で得た知識を踏まえ、より手軽にLPOを始められる、CMS(Content Management System)を使った簡易LPOの導入を紹介します。取り上げるのは、個人や中小規模サイトの構築でよく使われる「WordPress」と「Movable Type」の2つ。それぞれのツールに対応したプラグイン/テンプレートモジュールを組み込み、自分のWebページに到達するためにユーザーが検索サイトに入力したキーワードに応じて、関連するコンテンツ(エントリ)のリストを表示するシンプルなLPOを紹介します。お使いのツールに合わせて読み進めてください。


WordPressで簡易LPOを実現するプラグイン
「wp-SearchKeyword」

 最初に紹介するのは、WordPress向けの簡易LPOプラグインとして筆者が作成した「wp-SearchKeyword」です。まずはこのプラグインを組み込んだ場合の動作イメージを見てみましょう。次の画面は、実際にこのプラグインを使っている筆者のWebサイト(http://www.de-lab.com/)の例です。

LPOプラグイン

Googleで「MT LPO」と入力した際の検索結果画面。1番目に表示されているリンクをクリックすると、LPOプラグインによって生成された関連エントリの一覧が表示される

 Googleで「MT LPO」と入力すると、検索結果に「MT4で簡易的なLPO対策を実現するモジュール」という筆者のサイトのエントリが出ました。ここから当該ページを開くと、ページの上部に「MT LPOをお探しですか?」というメッセージとともに、関連するエントリの一覧が表示されます。ユーザーが検索エンジンに入力したキーワードをリファラーから割り出し、それに関連するエントリのリストを出力するのがこのwp-SearchKeywordプラグインです。


■プラグインの組み込み

 では、実際にプラグインをWordPressに組み込んでみましょう。

 はじめに、事前準備としてAmaury BALMER氏作のプラグイン「Simple Tags」を導入しておきます。今回のwp-SearchKeywordは、なるべく簡単に動作するプラグインとして作っていますので、関連エントリ情報はタイトルや本文などをキーワードで検索して抽出するのではなく、エントリにつけられたタグ情報を利用しています。Simple Tagsは、WordPressのタグ機能を強化するプラグインで、タグの入力支援や一括編集などのほか、関連エントリを自動的に表示する機能があります。この機能を利用させていただきました。

 Simple TagsはWordPresssユーザーの間で利用率が高いプラグインですので、すでに導入している方も多いと思いますが、まだ導入されていない場合は、あらかじめインストールし、管理画面で有効にしておいて下さい。

 次に、wp-SearchKeyword本体を用意します。筆者のWebサイトで配布していますので、以下のURLからダウンロードしてください。

ダウンロード: wp-searchkeyword

 ダウンロードしたプラグイン「wp-searchkeyword.php」は他のプラグインと同じように、「plugins」フォルダ以下にアップロードし、管理画面のメニュー「プラグイン」で有効にしましょう。続いて、テーマテンプレートの「single.php」(単一記事)を開き、検索結果に応じた関連エントリを自動表示させたい場所に、以下のコードを挿入してください。


<?php wpSearchKeyword(); ?> 


 これでプラグインの組み込みは完了です。このプラグインを組み込むと、指定した場所に以下のようなソースコード(XHTML)が出力されるようになります。


<div class="wpSearchKeyword">
    <h3>「キーワード」をお探しですか?</h3>
    <p>サイト内に「<strong>キーワード</strong>」に関連する情報が見つかりました。</p>
    <ul class="st-related-posts">
        <li>リスト1</li>
        <li>リスト2</li>
        <li>リスト3</li>
    </ul>
</div>



■カスタマイズ

 プラグインで生成する部分のデザインの変更は、クラス名(wpSearchKeyword)のスタイルシートを指定することで対応できます。また、wp-SearchKeywordプラグインは引数で簡単なカスタマイズができます。HTMLのマークアップを変更したいときなどには、先ほどテーマテンプレートに挿入したコードを以下の書式で書き換えてください。


<?php wpSearchKeyword("header" , "title属性" , "footer"); ?> 

header
  • リストの直前に出力するコードやテキスト(文字列)
  • デフォルト値: <div class="wpSearchKeyword">
title属性
  • 見出し要素のレベル(H1,H2,H3...の数値部分)
  • デフォルト値: 3
footer
  • リストの直後に出力するコードやテキスト(文字列)
  • デフォルト値: </div>

 なお、wp-SearchKeywordプラグインの詳しい情報は、筆者のサイトにありますので併せてチェックしてください。

前へ 1 2 次へ

この連載の記事

一覧へ
Web Professionalトップページバナー

この記事の編集者は以下の記事をオススメしています

ASCII.jp会員サービス 週刊Web Professional登録

Webディレクター江口明日香が行く