ブログの更新情報をウェブサイトに表示するJavaScript × JSON を作ってみた

Twitterのツイートをウェブサイトやブログに表示するJavaScript × JSON に触発されて、ブログの更新情報も同じように表示する JavaScript × JSON を作ってみた。


    1. 更新情報の json ファイルを出力。
    Movable Typeの「インデックステンプレートを作成」から
    タイトル「MTCallback」
    出力ファイル名「mt.json」
    テンプレートの種類「カスタムインデックステンプレート」
    で以下のソースを貼り付けて保存。json ファイルを出力。

    MTCallback([
    <mt:Entries glue=",">
    {
      "created_at":"<$mt:EntryDate format="%x %X">",
      "title":"<mt:EntryTitle escape="url">",
      "url":"<mt:EntryPermalink>"
    }
    </mt:Entries>
    ]);

    記事を更新するごとに公開日時、タイトル、URLを含んだ json ファイルを出力してくれる。タイトルは URLエンコード化。

    2. あとは、ページにjsonファイルまでのブログURLを設定した三行のソースを貼り付けるだけ。JavaScriptファイル (blogger.js) はダウンロードして使ってもOK。

    <ul id="blog_update_list"></ul>
    <script type="text/javascript" src="http://project.thingslabo.com/MTCallback/blogger.js"></script>
    <script type="text/javascript" src="ブログURL/mt.json?callback=MTCallback"></script>
    

    JavaScriptのソース (blogger.js) は、こんな感じの10行。

    function MTCallback(MT) {
    var statusHTML = [];
    for (var i=0; i<MT.length; i++){
      var title = decodeURIComponent(MT[i].title);
      var url = MT[i].url;
      var date = MT[i].created_at;
      statusHTML.push('<li><a href="'+url+'">'+title+'</a> '+date+'</li>');
    }
    document.getElementById('blog_update_list').innerHTML = statusHTML.join('');
    }
    

    ブログサービスでも json ファイルで更新情報の出力に対応してほしいゾ。

    Twitterのツイートをウェブサイトやブログに表示するJavaScript × JSON

    Twitterのツイートをウェブサイトやブログに表示するには、ウィジェットを貼り付ける方法がありますが、JavaScript × JSON を使ってTwitterのツイートを表示する方法も。

    こんな感じに。


      やり方は、Twitterのユーザー名と表示件数 (count) を設定した

      http://twitter.com/statuses/user_timeline/ユーザー名.json?
      callback=twitterCallback2&count=5
      

      を含む以下の三行のソースを貼り付けるだけ。

      <ul id="twitter_update_list"></ul>
      <script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
      <script type="text/javascript" src="http://twitter.com/statuses/user_timeline/ユーザー名.json?
      callback=twitterCallback2&count=5"></script>
      

      JavaScriptファイルをダウンロードして表示項目を変えたり、スタイルシートでデザインできたりとカスタマイズも自在にできる。

      ブログ記事を自動で公開する指定日投稿

      ブログ記事を指定した日時に公開してしてくれる指定日投稿。テストもかねて。

      cron の設定

      Movable Typeでは、記事を日時指定で公開する機能がありますが。使う前に設定が必要です。スクリプトやプログラムを自動実行するための cron を利用します。設定ファイル crontab にプログラムを登録することで自動的に公開してくれます。

      登録するプログラムは、toolsディレクトリにある run-periodic-tasks です。まずは、run-periodic-tasks に実行権限を与えます。

      $ chmod +x /path/to/mt/tools/run-periodic-tasks
      

      cron に登録。

      $ crontab -e
      

      crontab には、分 時 日 月 曜日コマンド の書式で設定。毎時間ごとに更新するように設定してみる。

      0 * * * * cd /path/to/mt/; ./tools/run-periodic-tasks
      

      注意点としては、まず mt までのディレクトリに移動後、プログラム run-periodic-tasks を指定すること。

      0 * * * * /path/to/mt/tools/run-periodic-tasks
      

      と横着しちゃうと

      Can't locate MT/TheSchwartz.pm in @INC (@INC contains: ./lib ../lib extlib ../extlib
      ....
      

      モジュールがないとエラーが出る。

      共用サーバの管理画面で cron の設定管理が用意されている場合はそれを使えばかなり楽に設定できます。

      Movable Typeでの指定日投稿は、cronのほかに複数の方法でできる。

      ブログ記事の編集画面で書いた記事を公開状態「日時指定」を選んで、公開日を設定保存するだけで、指定した日時に記事を公開してくれる。厳密には、cronに登録した日時に更新されるわけですが。

      データベースMySQLを64bit版に置き換える (Mac OS X Snow Leopard)

      Mac OS X を Leopard から Snow Leopard にアップグレードすると、MySQL の 32bit 版は動かないようだ。エラーに。

      Software error:
      install_driver(mysql) failed: Can't locate DBD/mysql.pm in @INC (@INC contains:
      /Library/Perl/Updates/5.10.0 /System/Library/Perl/5.10.0/darwin-thread-multi-2level
      /System/Library/Perl/5.10.0 /Library/Perl/5.10.0/darwin-thread-multi-2level
      /Library/Perl/5.10.0 /Network/Library/Perl/5.10.0/darwin-thread-multi-2level
      /Network/Library/Perl/5.10.0 /Network/Library/Perl
      /System/Library/Perl/Extras/5.10.0/darwin-thread-multi-2level
      /System/Library/Perl/Extras/5.10.0 .) at (eval 11) line 3.
      Perhaps the DBD::mysql perl module hasn't been fully installed,
      or perhaps the capitalisation of 'mysql' isn't right.
      Available drivers: DBM, ExampleP, File, Gofer, Proxy, SQLite, Sponge.
      at test.cgi line 12
      For help, please send mail to the webmaster (you@example.com),
      giving this error message and the time and date of the error.
      
      $ cd /usr/local/
      $ ls
      apache2				man
      bin					mysql-5.1.36-osx10.5-x86
      include				share
      lib
      

      ということで、64bit 版 MySQL にアップグレード。

      から Mac OS X ver. 10.6 (x86, 64-bit) - mysql-5.1.42-osx10.6-x86_64.dmg をダウンロード。そして、展開。

      mysql-5.1.42-osx10.6-x86_64.pkg をクリックしてインストール。MySQLStartupItem.pkg をクリックしてインストール。MySQL.perfPane をクリックして置き換え。

      インストールの確認。

      $ cd /usr/local/
      $ ls
      apache2				mysql
      bin					mysql-5.1.36-osx10.5-x86
      include				mysql-5.1.42-osx10.6-x86_64
      lib					share
      man
      

      アップルメニュー「システム環境 > MySQL」 で「Start MySQL Server」ボタンを押してサーバを再起動。stopped から running になったことを確認。

      ほか、mysql gem のインストール。オプションを指定して。

      $ sudo env ARCHFLAGS="-arch x86_64" gem install mysql --
      --with-mysql-config=/usr/local/mysql/bin/mysql_config
      

      32bit版MySQLで使っていたデータに置き換え

      32bit版MySQLで使っていたデータは、64bit 版 MySQLでも使えるようなので。

      そのままコピー。

      $ sudo cp -pfR /usr/local/mysql-5.1.36-osx10.5-x86/data /usr/local/mysql-5.1.42-osx10.6-x86_64/
      

      で、データベースの置き換え完了!!

      マックのOSをMac OS X Snow Leopardにアップグレード

      動かないアプリがあるのではないかぁと思いつつ、Mac OS を Leopard から Snow Leopard にアップグレード。アップグレードは、Leopard からでは 3,300円でできる。

      インストールは、
      1. インストールディスクを入れて、「Mac OS X インストール」をクリック。

      2. インストーラーの「続ける」ボタンをクリック。
      3. 使用許諾契約に同意・インストール先のディスクを指定して、インストール開始。
      一時間ほど待つと、インストール完了。

      再起動すると、ムービーか流れて Snow Leopard にアップグレード完了。

      Mac OS X の開発環境 Xcode をインストール

      フォルダ「オプションインストール」から「Xcode.mpkg」をクリックしてインストール。

      30分ほど待つと、インストール完了。

      そのあと、アップルメニューから「ソフトウェア・アップデート...」を2回ほどしてOS を最新の状態に更新。

      基本的に Leopard と変わりはないが、内部的には 64bit に対応。

      一通り動作を確認したアプリで動かなかったのは、ATOK2007 と Fetch。
      ATOK は ATOK2009 にアップグレードし、Fetch はベータ版のリリースだけで、Snow Leopard にまだ対応していないようだ。

      ほか、mySQL が動いていない。どうやら 64bit バージョンの mySQL が必要のようだ

      最近の投稿

      カテゴリー

      アーカイブ