WIZARD-CODEウィザード・コードJavaScriptとAjaxメインのサイトです。ShoppingSearch今回はYahoo!ショッピングの商品一覧を表示するウィジェットです。楽天バージョンと同じく入力したキーワードで商品検索を行い、ヒットした内容を表示します。これはjQueryのプラグインとして動作します。Sidebar.cssまずは前準備このプラグインはjQueryの最新バージョン1.4以上を必要とします。APIを利用しています。ShoppingSearchのJavaScriptファイルをscriptタグに記述します。ShoppingSearchのCSSファイルをインクルードします。APIを利用する方が手軽です。次のURLのjqueryui/の後にバージョンの数値、themes/の後にテーマ名を入れるだけです。画像フォルダの用意はいりません。上記の準備ができたら、body要素の終了タグ直線などに次のような短いスクリプトを書きます。});jQueryオブジェクトの代わりにショートカットの$を使用できます。ID名がshopping_boxという要素内に結果を最大10件まで表示します。キーワードはウィジェットを設定したページ内容に関連したものにすると効果的です。最後の引数に渡した文字列はYahoo!デベロッパーネットワークのアプリケーションIDです。引数の最後に必ず指定してください。オプションとして、最後の引数にハッシュを渡すことができます。affiliateIdプロパティはYahoo!のアフィリエイトIDかバリューコマースアフィリエイトIDを取得しているときに指定します。このプロパティを指定すると、紹介した商品が購入されたとき成果報酬が支払われます。Yahoo!アフィリエイトについて詳しくはこちらをご覧ください。affiliateTypeプロパティは利用するアフィリエイトを指定します。Yahoo!アフィリエイトはyid、バリューコマースアフィリエイトはvcです。デフォルトはyidです。sizeプロパティは一度に表示する商品の数を指定します。初期値は10で最大値が50です。検索にヒットした商品が多いと表示まで時間がかかることがあります。sortプロパティは商品をソートする基準を指定します。初期値は"-score"おすすめ順(降順)です。詳細はYahoo!ショッピング商品検索APIのリクエストパラメータの項をご覧ください。categoryIdプロパティは検索範囲をカテゴリで指定します。初期値は1(全商品)です。カテゴリ毎のIDはこちらのサイトが参考になります。baseFontSizeはウィジェットの基準となるフォントサイズを指定します。初期値は12pxです。defaultKeywordsは配列形式です。デフォルトで検索ワードに入れておきたい単語を配列にして入れます。始めから"ファッション"、"腕時計"、"DVD"、"ゲーム"が登録されているので、この部分は自由に好きな単語に変えてください。});ウィジェットを埋め込む箇所に記述するタグは次のようになります。ID属性名は自由ですが、スクリプトのjQueryオブジェクトに渡すものと必ず同じにしてください。アフィリエイトが関係するので一応利用規約を作っておきます。・このウィジェットを利用するにはYahoo!デベロッパーネットワークのアプリケーションIDが必要です。・アフィリエイトIDを指定すると、商品のリンクは常にそのアフィリエイトIDを経由して作られます。・Yahoo!ショッピングの送料に「条件付き無料」という区分がありますが、文字数の関係で「送料別」に分類しています。・短時間に大量のアクセスがかかると、一定時間利用できなくなる場合があります。・Yahoo!ショッピングのサーバー状況によって、リクエストに不具合を生じる場合があります。・このプラグインはYahoo!ショッピングのAPIに依存しています。その際にウィジェットが正常に動作しなくなる場合があります。・このウィジェットを利用したことにより生じるいかなる損害に関して管理人は責任を負いかねます。0.1ベータ版最初バージョン。※このプラグインはまだ開発中のベータ版です。不具合等ありましたら、ブログコメントやメール等でお知らせください。