Google AJAX Search APIを使って「YouTube」の動画の検索結果を組み込む事が出来るらしい。
デフォルトでも、Wizard使ってもいいのですが、念のため、備忘録・・・
いつものようにAPIキーをこちらから取得。
以下、<Head>部分
ここからが問題部分。
同じく<Head>には入るのですが、
<style type=”text/css”>
#videoBar-player .playerInnerBox_gsvb .player_gsvb {
width : 480px;
height : 380px;
}
</style>
サムネールをクリックした時に表示される動画のサイズのCSSを変更。
公式のガイドによると・・・・
・180px x 135px – small player
・260px x 95px – medium player
・320px x 260px – large player
・480px x 380px – extra large player
らしい。
ここからがイロイロな設定。
var videoBar;
var options = {
string_allDone : “動画のウィンドウを閉じます”,
largeResultSet : !true,
horizontal : false,
autoExecuteList : {
cycleTime : GSvideoBar.CYCLE_TIME_SHORT,
cycleMode : GSvideoBar.CYCLE_MODE_RAMDOM,
executeList : [ "任意のキーワード", "任意のキーワード２" ]
}
}
videoBar = new GSvideoBar(document.getElementById(“videoBar-bar”),
document.getElementById(“videoBar-player”),
options);
}
GSearch.setOnLoadCallback(LoadVideoBar);
</script>
string_allDone : デフォルトでは無いが、プレーヤーを閉じる部分のセリフを替えられる。
horizontal : trueなら横型。falseなら縦型。
CYCLE_TIME_SHORT : 「Auto Execute List」ってもんらしい。サムネールの切り替え時間。
後は、自分が組み込みたいところに
を追加。
CSSは細かいところをイジらなくても、とりあえずは動作しますね。