Movable Type 備忘録

 Yahoo! Site Explorer / Badge

こんにちわ^^

今日も暑いですね (;￣∇￣A
ウチのネコたんも毛皮を着てるせいで暑いようで、廊下でだらしなぁ～く寝そべっております。

夏になると、毎年同じ格好、同じ場所で涼んで!? ます。
もぅ少ししたらカットに連れてってあげなきゃいけないんだけど･･･憂鬱です (´Д｀；) はぁ

わたしが未熟者のせいか、良からぬ気配を感じるらしく異常な拒否反応を示します。
カット当日はわたしとネコたんの壮絶なバトル(鬼ごっこ)でして、わたしはいつもキズだらけです（つω-`｡）

さて、遅ればせながら今年になってリニューアルされた Yahoo! Site Explorer の新サービス、Yahoo! Site Explorer / Badge をサイト内に貼り付けてみました。

Yahoo! Site Explorer / Badge は、リンク数を表示してくれるブログパーツです。

ページごとのリンク数、サイトへのリンク数表示が選択可能となってます。

Links to Site

左のバッジは、わたしのサイトへのリンク数を表示しています。

使い方

  1. Yahoo! Site Explorer にログインします。
    サービスを利用するには、Yahoo! Site Explorer にアカウントを作成する必要があります (￣∇￣)b
    ヤフージャパンのヤフー ID とは異なります。

    お持ちでない人は、こちらのヤフーに申請してクロールしてもらうを参考にアカウントを登録してください。

  2. 次にリンク表示のタイプを選択します。

    • Track the number of links to the Page on which the badge is placed
      ページごとのリンク数を表示させたい場合には、こちらを選択します。

    • Track the number of links to the Site on which the badge is placed
      サイトへのリンク数を表示させたい場合には、こちらを選択します。

  3. バッジのサイズを選択します。

  4. 最後に表示されてる JavaScript のコードをコピーして、各自のサイトの任意の場所に貼り付けます。

以上です。
キャッシュでなくて情報が表示されないことがあるようです。
しかも、XHTML 1.1 だと Markup 的にエラーしちゃってます (´Д｀；) う～ん･･･困った。 以下のようにスクリプトを変更することで問題解決しました。

  1. <!-- START CODE -->
  2. <script src="https://sec.yimg.com/us.yimg.com/lib/s2/yschx_siteexplorer_badge_20070619.js" type="text/javascript"></script>
  3. <div id="ybadge" style="position:relative;left:0px;top:0px;width:110px;height:55px;z-index:1;border: 1px solid #8ea9ba;background: url(https://sec.yimg.com/us.yimg.com/i/us/sch/el/siteex_badgebig_bg.gif) repeat-x;overflow: hidden;cursor:pointer;" onclick="Goto()">
  4. <div id="ylogo" style="position:absolute;left:6px;top:5px;width:18px;height:10px;z-index:1;">
  5. <img src="https://sec.yimg.com/us.yimg.com/i/us/sch/el/siteex_badgebig_logo.gif" alt="Yahoo!" width="96" height="12" />
  6. </div>
  7. <div id="ynum" style="position:absolute;left:2px;top:21px;width:106px;font:bold 14px Arial, Helvetica, sans-serif;color: #2d2a25;height:15px;z-index:2;text-align: center;">
  8. <script type="text/javascript">
  9. <!--
  10. document.write("<scr");
  11. document.write("ipt type=\"text/javascript\" src=\"http://search.yahooapis.com/SiteExplorerService/V1/inlinkCount?appid=YahooBadge&entire_site=0&query="+selfurl+"&output=json&callback=ws_results\"></scr");
  12. document.write("ipt\>");
  13. -->
  14. </script></div>
  15. <div id="ytxt" style="position:absolute;height:15px;z-index:3;font:normal 11px Tahoma, Verdana, Arial;left:2px;top:38px;width:106px;color: #2d2a25;text-align: center;">
  16. Links to Page </div></div>
  17. <!-- END CODE -->

青い字の部分を追加することで、Markup 的に問題解決です (●＞∀＜●)／ やりっ!!
ブログの PHP 化を行っている人は以下の方がもっと良かです (￣∇￣)b

  1. インデックス・テンプレートを新規作成(たとえば、yahoo-badge.php)して、以下のコードを貼り付けます。

    yahoo-badge.php

    1. <?php
    2.     if (!isset($_REQUEST['url'])) return;
    3.     $url = $_REQUEST['url'];
    4. ?>
    5.  
    6. <!-- START CODE -->
    7. <script src="https://sec.yimg.com/us.yimg.com/lib/s2/yschx_siteexplorer_badge_20070619.js" type="text/javascript"></script>
    8. <div id="ybadge" style="position:relative;left:0px;top:0px;width:110px;height:55px;z-index:1;border: 1px solid #8ea9ba;background: url(https://sec.yimg.com/us.yimg.com/i/us/sch/el/siteex_badgebig_bg.gif) repeat-x;overflow: hidden;cursor:pointer;" onclick="Goto()">
    9. <div id="ylogo" style="position:absolute;left:6px;top:5px;width:18px;height:10px;z-index:1;">
    10. <img src="https://sec.yimg.com/us.yimg.com/i/us/sch/el/siteex_badgebig_logo.gif" alt="Yahoo!" width="96" height="12" />
    11. </div>
    12. <div id="ynum" style="position:absolute;left:2px;top:21px;width:106px;font:bold 14px Arial, Helvetica, sans-serif;color: #2d2a25;height:15px;z-index:2;text-align: center;">
    13. <script type="text/javascript">
    14. <!--
    15. document.write("<scr");
    16. document.write("ipt type=\"text/javascript\" src=\"http://search.yahooapis.com/SiteExplorerService/V1/inlinkCount?appid=YahooBadge&entire_site=0&query=<?php echo $url; ?>&output=json&callback=ws_results\"></scr");
    17. document.write("ipt\>");
    18. -->
    19. </script></div>
    20. <div id="ytxt" style="position:absolute;height:15px;z-index:3;font:normal 11px Tahoma, Verdana, Arial;left:2px;top:38px;width:106px;color: #2d2a25;text-align: center;">
    21. Links to Page </div></div>
    22. <!-- END CODE -->

    変更点は赤い字の部分です。
    外部から表示中の URL をもらって、その URL を Yahoo! Site Explorer / Badge のスクリプトに渡すことでリンク数を表示させています。

  2. Yahoo! Site Explorer / Badge を表示させたいテンプレートに以下のコードを貼り付けます。

    1. <script type="text/javascript">
    2. <!--
    3. document.write('<iframe src="<$MTBlogURL$>widget/yahoo-badge.php?url='+escape(location.href)+'" width="120" height="70" scrolling="no" frameborder="0" hspace="0" vspace="0" marginheight="0" marginwidth="0"></iframe>');
    4. //-->
    5. </script>

以上のことで、平行して Yahoo! Site Explorer / Badge を表示させることができます (￣∇￣)b

 Trackback Pings(0)

No trackbacks found.

 Comments(0)

No comments found.

 Post a Comment

 

コメント用フィード