このページの本文へ

前へ 1 2 次へ

  • twitterでつぶやく
  • はてなブックマークに登録
  • del.icio.usに登録
  • livedoorクリップに登録
  • Buzzurlに登録
  • StumbleUponに登録
  • Google Bookmarksに登録
  • Facebookでシェア
  • Yahoo!ブックマークに登録
  • お気に入りに登録
  • 本文印刷

実践! 今日からはじめるLPO ― 第3回

WordPress&MTにLPOを導入しよう!

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 次へ

この特集の記事

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

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

みんなが買ってる最新アイテムはコレだ!

VOCALOID3 スターターIA ARIA ON THE PLANETES

VOCALOID3 スターターIA ARIA ON THE PLANETES

ヤマハ

17,745円〜

22人が購入

標準HTML5タグリファレンス (WEB PROFESSIONAL)

標準HTML5タグリファレンス (WEB PROFESSIONAL)

アスキー・メディアワークス

2,205円〜

101人が購入

Windows 7 Home Premium 通常版 Service Pack 1 適用済み

Windows 7 Home Premium 通常版 Service Pack 1 適用済み

マイクロソフト

20,271円〜

7人が購入

Speck MacBook Air 13型 See Thru - Clear SPK-MBA13-SEE-CLR

Speck MacBook Air 13型 See Thru - Clear SPK-MBA13-SEE-CLR

スペックコンピュータ

4,291円〜

24人が購入

メモリーカード 32GB (PCH-Z321J)

メモリーカード 32GB (PCH-Z321J)

ソニー・コンピュータエンタテインメント

7,772円〜

12人が購入

iPhone 4S/4 防指紋性・高光沢機能性フィルム PRO GUARD AF for iPhone 4S/4 / PGAF-IPH4

iPhone 4S/4 防指紋性・高光沢機能性フィルム PRO GUARD AF for iPhone 4S/4 / PGAF-IPH4

マイクロソリューション Micro Solution Inc.

65人が購入

Web制作の現場で使う jQueryデザイン入門 (WEB PROFESSIONAL)

Web制作の現場で使う jQueryデザイン入門 (WEB PROFESSIONAL)

アスキー・メディアワークス

3,497円〜

19人が購入

Amazon.co.jp