Home > Web > Movable Type Archive

Movable Type Archive

1 2 3 4

jQuery 版 Last.FM ウィジェットを導入してみた

Last.FM は、PC や iPhone などの DAP で音楽を聴く人にとって必携のツールだ。SNS 的な機能を抜きにしても、自分の音楽嗜好に合わせて似たアーティスト・楽曲を提案してくれる機能は非常に便利。

Flash 版 Last.FM ウィジェット

以前の記事で、Last.FM の情報を表示してくれるウィジェットについて書いた。

Last.fmウィジェットはどこに行った?
http://blog.remora.cx/2010/02/lastfm-widget.html

このウィジェットは Flash を使っており、いまいち好みでなかったこと、また、いつの間にか公式サイトでも非推奨になってしまったことから使用を止めていた *1

jQuery 版 Last.FM ウィジェット

そこでググってみると、Last.FM API を利用したウィジェットを発見。早速利用してみた。

Last.FM for jQuery
http://labs.engageinteractive.co.uk/lastfm/

CD

上記サイトにも導入方法は書いてあるのだが、改めて纏めてみる。

Continue reading

SyntaxHighlighter には pre タグではなく script タグがお得

文字実体参照
<&lt;
&&amp;

SyntaxHighlighter による記述に <pre> タグを使うといろいろと不便な点がある。一番の問題は、<pre> 内では左表に示す文字を直接書き表わせないことだ。

Continue reading

mixi に更新が反映されていなかった件

mixi の外部ブログとしてこのサイトを指定したところ、いっこうに更新状況が反映されていなかったようだ。原因は mixi が“index.rdf”というファイルを見て更新状況を確認しているのに対し、最近の MovableType ではこのファイルを生成しない設定になっているためだ。

Movable Typeを4.23にバージョンアップしたらMixiの日記に更新されない対応 - Mukaer
http://mukaer.com/archives/2009/01/31/movable_type423/

このサイトを参考にして“index.rdf”の設定を行ったところ、mixi へ正常に反映されるようになった。

HTML5 に対応した Youtube 動画を貼る方法

Youtube の動画をブログ等に貼るとき、従来は <object> タグを使って次のように書いていた。

<object width="640" height="385">
    <param name="movie" value="http://www.youtube.com/v/SuY6wrMDptA&hl=ja_JP&fs=1"></param>
    <param name="allowFullScreen" value="true"></param>
    <param name="allowscriptaccess" value="always"></param>
    <embed src="http://www.youtube.com/v/SuY6wrMDptA&hl=ja_JP&fs=1"
        type="application/x-shockwave-flash" allowscriptaccess="always"
        allowfullscreen="true" width="640" height="385"></embed>
</object>

これは Flash による再生にしか対応していないし、お世辞にもきれいなタグとも言えない *1 。そこで、HTML5 版 Youtube にも対応したスマートなタグが推奨されている。

【レビュー】YouTubeビデオの組み込みでHTML5 VideoとFlashの両方をサポートする方法 | ネット | マイコミジャーナル
http://journal.mycom.co.jp/articles/2010/07/26/youtube-for-flash-and-html5/index.html

<iframe class="youtube-player"
    width="640" height="385"
    src="http://www.youtube.com/embed/SuY6wrMDptA"
    frameborder="0"
></iframe>

Continue reading

公式 Tweet Button は HTML5 用?

ページを構成する HTML の正当性を検査してくれるサービスとしては W3C Markup Validation Service が便利だ。

The W3C Markup Validation Service
http://validator.w3.org/

以前このサイトは XHTML 1.0 で構築し、W3C Validation Service でも確認をとっていたのだが、「【MovableType】Twitter のつぶやきをサイドバーに表示する」で紹介した Tweet Button を設置したあたりからおかしくなった。原因はコードに出てくる data-xxxx 属性だ。

Continue reading

【MovableType】Twitter のつぶやきをサイドバーに表示する

Twitter のログをブログに表示してみた記録。基本的には簡単。ジェネレータで生成した HTML を貼り付けるだけだ。

[Movable Type] Twitterウィジェットをサイドバーに追加してみた - No Second Life
http://www.ttcbn.net/no_second_life/2009/02/movable-type-twitter.html

だけどそのままでは味も素っ気もない。読み込みが終わるまで空欄のままだし、表示も白黒になってしまう。ある程度整形して表示するようにしてみた。

Continue reading

【MovableType】Twitter につぶやくボタンを各記事に設置する

アカウントをとったまま放置していた Twitter を使ってみることにした。ちょうどうまいことに公式の“Tweet Button”なるものが発表されて話題になっているところだったので、ついでにこのブログにも設置してみた。こんな感じ。ITmedia の記事に“Twitter Button”なんて書かれてたからそれ採用したけど、よく見たら“Tweet Button”だね。カコワルイので修正しました。

2010-08-13_131026.png

Twitter / ツイートボタン
http://twitter.com/goodies/tweetbutton

このサイトで作成した HTML タグを MT のテンプレートに貼ればいい……のだが、そう簡単ではない。各記事のテンプレートに貼るだけならば次のようなソースで足る *1

<a href="http://twitter.com/share" class="twitter-share-button"
    data-count="none" data-via="delphinus35" data-lang="ja">Tweet</a>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

これはクリックしたページのタイトルと URL を Tweet してくれるボタンを生成する。つまり、トップページやアーカイブページ等、複数の記事が載るページでは細工が必要だ。

と言う訳で、このサイトで使っている MT 用のテーマ“mt.Vicuna”に Tweet Button を設置した経過を書いておく。

Continue reading

【MovableType】一定数の記事ごとにページを分割する

MT には最近のバージョン(4.3 以降?)からページ送り機能がついている。これは長すぎるページを一定間隔に区切って分け、各ページにリンクを付けてくれる機能だ。Google の検索結果の一番下に出てくる「1 2 3 4 5 »」のような表示と考えればわかりやすい。特に月別やカテゴリー別のページは数百個の記事が並ぶこともあるわけで、記事が多くなったら必ず導入しておきたい。……というか、なんで標準のテーマにこれがないのかね?

小粋空間: Movable Type 4.3 の新機能(スタティックページのページ分割)
http://www.koikikukan.com/archives/2009/07/29-005555.php

主に、上のリンクに従って設定した。以下に手順を書いていく。

Continue reading

【MovableType】“関連エントリー”の表示を改善する

カテゴリーの例

今まで記事の最後にある「関連エントリー」の表示は、記事のカテゴリーに属すものを最新のものから並べただけだった。これでは、記事が複数のカテゴリーに属す場合、メインカテゴリーの関連記事が表示されない場合がある。

例えば、前回の記事「」は右図のように 4 つのカテゴリーに属していて、そのうち一番上の「keyhac」カテゴリーがメインカテゴリーだ。

この状態で従来の「関連エントリー」表示を行うと次のようになる。

従来の関連エントリー

Continue reading

【Movable Type】5.0 → 5.02 へのアップグレード

今まで面倒で放置していたのだが、Movable Type を 5.0 から 5.02 にアップグレードしてみた。

Movable Type 5.0 から 5.0x へのアップグレード
http://www.movabletype.jp/documentation/mt5/upgrade/mt5.html

Continue reading

1 2 3 4

Index of all entries

Home > Web > Movable Type Archive

Feeds
CC Licence

Creative Commons License

このブログはクリエイティブ・コモンズでライセンスされています。

W3C Validation

I ♥ validator

Return to page top