WordPress で特定キーワードの検索結果をリスト表示する

WordPress で生成される URL には、たいていの物に RSS フィードが生成されます。
例えば「claudia」で検索した結果は、以下の url で参照できますが

dogmap.jp を「claudia」で検索した結果
https://dogmap.jp/?s=claudia

© 2011 Microsoft Corp. All Rights Reserved.

これの RSS フィードは、以下の URL から取得できます。
https://dogmap.jp/feed/?s=claudia
これと Google Ajax Feed API を利用すると、JavaScript でリスト表示することができますね。
参考: Google AJAX Feed API

また、私が作った Feed JSON プラグインを使えば JSON で出力できるので、さらにらくちんです。
生成される JSON Feed は、こんな感じ。
https://dogmap.jp/feed/json/?s=claudia

以下にサンプルソースを置いておきます。

<div id="search-results"></div>
<script type="text/javascript">
function callback(results) {
    var ul = document.createElement("ul");
    for (var i = 0; i < results.length; i++) {
        var entry = results&#91;i&#93;;
        var li = document.createElement("li");
        var a  = document.createElement("a");
        a.setAttribute("title", entry.title);
        a.setAttribute("href",  entry.permalink);
        a.appendChild(document.createTextNode(entry.title));
        li.innerHTML = entry.date.replace(/&#91;0-9&#93;+:&#91;0-9&#93;+:&#91;0-9&#93;+/, '');
        li.appendChild(a);
        ul.appendChild(li);
    }
    var container = document.getElementById("search-results");
    container.appendChild(ul);
}
</script>
<script type="text/javascript" src="https://dogmap.jp/feed/json/?s=claudia&callback=callback"></script>

動作サンプル、この下に dogmap.jp を「claudia」で検索した結果が表示されます。


Feed JSON は thumbnail とか category, tag なんて情報も返すので、色々できまっせ。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください