前回、Twitter RESTAPI1.1で「高速道路渋滞なう」をつくるにあたって、
- 「返信」「リツィート」「お気に入り登録」のアイコンがない（見た目が悪い）
- 各href属性のURL内にある、$tweet[‘id’]では、そのつぶやきにアクセスできない
という2つに問題がありました。今回の記事では、これらの問題を解決する方法をご紹介しましょう。
ツィート埋め込み用の画像素材
TwitterドキュメンテーションのImage Resourcesにアクセスすると、埋め込み用の画像素材が用意されています。
pngファイル（画像）をダウンロードするか、そのURLをコードに貼り付けることで、「Favorite」「Reply」「Retweet」のアイコンを使用することができます。
$tweet[‘id’]ではなくecho $tweet[‘id’];に
前回、tweet_idをそのまま使っていたところを、echo $tweet[‘id’];にします。
[php]
<p><a href="https://twitter.com/intent/tweet?in_reply_to= $tweet[‘id’]" target="_blank">Reply</a></p>
<p><a href="https://twitter.com/intent/retweet?tweet_id= $tweet[‘id’]" target="_blank">Retweet</a></p>
<p><a href="https://twitter.com/intent/favorite?tweet_id= $tweet[‘id’]" target="_blank">Favorite</a></p>
[/php]
ではなく、
[php]
<p><a href="https://twitter.com/intent/tweet?in_reply_to= <?php echo $tweet[‘id’]; ?>" target="_blank">Reply</a></p>
<p><a href="https://twitter.com/intent/retweet?tweet_id= <?php echo $tweet[‘id’]; ?>" target="_blank">Retweet</a></p>
<p><a href="https://twitter.com/intent/favorite?tweet_id= <?php echo $tweet[‘id’]; ?>" target="_blank">Favorite</a></p>
[/php]
です。
ここまでのコードをまとめると…
以上を踏まえると、前回のコードを修正すると、以下のようになります。そのコードを表示させると、画像のような感じになります。
[php]
<?php
if($result[‘statuses’]){
foreach($result[‘statuses’] as $tweet){
?>
<ul>
<li><?php echo date(‘Y-m-d H:i:s’, strtotime($tweet[‘created_at’])); ?></li>
<li><?php echo $tweet[‘user’][‘name’]; ?></li>
<li><img src="<?php echo $tweet[‘user’][‘profile_image_url’]; ?>" /></li>
<li><?php echo $tweet[‘text’]; ?></li>
<li><?php echo $tweet[‘id’]; ?></li>
<script type="text/javascript" src="//platform.twitter.com/widgets.js"></script>
<img src="https://si0.twimg.com/images/dev/cms/intents/icons/reply_hover.png">
<p><a href="https://twitter.com/intent/tweet?in_reply_to= <?php echo $tweet[‘id’]; ?>" target="_blank">Reply</a></p>
<img src="https://si0.twimg.com/images/dev/cms/intents/icons/favorite_on.png">
<p><a href="https://twitter.com/intent/retweet?tweet_id= <?php echo $tweet[‘id’]; ?>" target="_blank">Retweet</a></p>
<img src="https://si0.twimg.com/images/dev/cms/intents/icons/retweet_on.png">
<p><a href="https://twitter.com/intent/favorite?tweet_id= <?php echo $tweet[‘id’]; ?>" target="_blank">Favorite</a></p>
</ul>
<?php } ?>
<?php }else{ ?>
<div class="twi_box">
<p class="twi_tweet">関連したつぶやきがありません。</p>
</div>
<?php } ?>
[/php]
次なる問題…
今回作成中のWebサービスと、見本としている「電車遅延なう」のつぶやきを比べてみると、次の3点のハイパーリンクが足りません。
- 「@~~~~」(スクリーンネーム)
- #ハッシュタグ
- https://t.co/○○○○○○○
次回のブログでは、これらの解決方法について書いてみたいと思います。
〔前の記事〕
〔つづきの記事〕
〔参考サイト〕
