WordPress内に、twitterを表示するということで、Twitterで提供している@AnywhereサービスをJQueryで表示するプラグインを利用。
1.ダウンロード
jtweetsanywhereからまずは、スクリプトをゲット。
2.twitterにアプリ登録
@Anywhereサービスを利用するには、登録してkeyコードを発行する必要あり。
各項目は、適宜、入力してOK。
自分のアカウントに下記のように登録されるので、「consumer key」を控えておく。
3.jtweetsanywhereの読み込み
Wordpressでは、既に多くのJavaScriptを読み込んでおり、整然とロードする関数(wp_enqueue_script)が用意されている。
(1) functions.php
$jtweets = get_bloginfo('home') . "/wp-content/themes/bp-moripower/js/jquery.jtweetsanywhere-1.2.0.js";
wp_enqueue_script('jquery.jtweetsanywhere', $jtweets, array('jquery'), "1.2.0");
wp_enqueue_script('jquery.jtweetsanywhere', $jtweets, array('jquery'), "1.2.0");
(2) header.php
・jtweetsanywhereで用意されているcssを読み込み
・上記2で登録したconsumer keyをkeyコードに記載
<link rel="stylesheet" type="text/css" media="all" href="<?php get_bloginfo('home'); ?>/wp-content/themes/bp-moripower/js/jquery.jtweetsanywhere-1.2.0.css" />
<script type="text/javascript" src="http://platform.twitter.com/anywhere.js?id=keyコード&v=1"></script>
<script type="text/javascript" src="http://platform.twitter.com/anywhere.js?id=keyコード&v=1"></script>
(3) JavaScript
・表示パターンは色々有り。
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('#jTweetsAnywhereSample1').jTweetsAnywhere({
username: ['user1', 'user2'],
count: 5,
showTweetFeed: {
paging: { mode: 'prev-next' }
}
});
});
</script>
jQuery(document).ready(function(){
jQuery('#jTweetsAnywhereSample1').jTweetsAnywhere({
username: ['user1', 'user2'],
count: 5,
showTweetFeed: {
paging: { mode: 'prev-next' }
}
});
});
</script>
以上です。