タグクラウドが 3D 空間で回転する WordPress のプラグイン WP-Cumulus を BlogEngine.NET ベースの自分のブログにも導入したくて、どうすれば可能か検討していました。

作者のサイト に有益な情報があって、公開されている tagcloud.swf をそのまま利用すれば WP-Cumulus と同様な 3D タグクラウドを BlogEngine.NET で実現するのは難しくないようです。

問題は日本語の表示で、オリジナルの tagcloud.swf は日本語のフォントに対応しておらず、日本 語のタグを設定すると表示されないことです。下の左側がそれです。

（注）右側の tagcloud.swf は Joomler!.net さんのサイト からダウンロードさせていただきました。有難うございました。

日本語を表示するには以下の３つの方法がありますが、どれも一長一短です。

1. フォントを tagcloud.swf に埋め込む。問題はサイズが大幅に増えることで、全部埋め込むと 2MB 近くになり、第一水準に制限しても 700 kB を超えてしまいます。作者も自分の ブログ で言っていますが、そもそもオモチャなのに 700 kB は重すぎます。
2. デバイスフォントの使用（埋め込まないで、クライアントの OS のフォントを使う）。上の右側がそれです。数 kB で済むみますが、問題は動きが極端に悪くなることと、後ろに行くほどモヤがかかったようになる本来の表現が失われることです。
3. （上記の折衷案として）ひらがなとカタカナのみ埋め込む。オリジナルの倍程度のサイズ（約 70 kB）ですみます。でも、漢字が使えないのでは・・・

オモチャと割り切って、かつ自分的には見栄えが一番大切ということで、とりあえずオリジナルのままのまま進めてみようと思っています。問題は、BlogEngine.NET の Widget にどのように統合するかですね。今度の週末にでもじっくり考えて見ます。

Tag cloud の中で日本語の Tag をクリックすると、Tag に関連するポストは正しく表示されるものの、ブラウザのタイトル表示が文字化けします。

例えば、Tag cloud の中の "湘南" をクリックすると、タイトルは All posts tagged '湘南' となるべきところ、All posts tagged 'e6b998e58d97' となってしまいます。

タイトルは、アプリケーションルート直下にある Default.aspx.cs の DisplayTags メソッドの中で、以下のように設定されます。

base.Title = " All posts tagged '" + 
    Request.QueryString["tag"].Substring(1) + "'";

ところが、このクエリ文字列は、UrlEncode してから '%' を除去しているので、上記では UrlDecode されません。（UrlEncode と '%' の除去は、widgets\Tag cloud\widget.ascx.cs の中で Utils.RemoveIllegalCharacters メソッドを使って行っています）

これは DisplayTags メソッドを以下のように直して対応しました。

private void DisplayTags()
{
  if (!string.IsNullOrEmpty(Request.QueryString["tag"]))
  {
    PostList1.ContentBy = ServingContentBy.Tag;
    List<Post> posts = 
      Post.GetPostsByTag(Request.QueryString["tag"].Substring(1));
    PostList1.Posts = 
      posts.ConvertAll(new Converter<Post, IPublishable>(p => p as IPublishable));
    foreach (string t in posts[0].Tags)
    {
      if (Utils.RemoveIllegalCharacters(t).Equals(
         Request.QueryString["tag"].Substring(1),
         StringComparison.OrdinalIgnoreCase))
      {
        base.Title = " All posts tagged '" + t + "'";
        break;
      }
    }
    base.AddMetaTag("description", 
      Server.HtmlEncode(BlogSettings.Instance.Description));
  }
}

ところが、ポスト欄の左下に「Tag: XXXX」というリンクがありますが、この URL のクエリ文字列は UrlEncode がされたのみになっています。（'%' は除去されていない。例えば、"湘南" は "%e6%b9%98%e5%8d%97" となります）

これをクリックすると、Tag cloud の中のリンクをクリックしたのと同様に、Default.aspx.cs の DisplayTags メソッドの中で処置されます。そこで、GetPostsByTag メソッドで再度 RemoveIllegalCharacters が引数の文字列に適用され、'%' は除去されるので、正しく Tag に関連する posts が得られますが、foreach の中で一致する t がない（if 文の条件が true にならない）のでタイトルが設定されません。

その結果、ブラウザのタイトルは、All posts tagged 'XXXX' としたいところ、 http://surferonwww.info/BlogEngine... のようになってしまいます。

これは、BlogEngine.Core の中の Web\Controls\PostViewBase.cs の TagLinks メソッドを以下のように直して対応しました。

protected virtual string TagLinks(string separator)
{
  if (Post.Tags.Count == 0)
    return null;

  string[] tags = new string[Post.Tags.Count];
  string link = "<a href=\"{0}/{1}\" rel=\"tag\">{2}</a>";
  string path = Utils.RelativeWebRoot + "?tag=";
  for (int i = 0; i < Post.Tags.Count; i++)
  {
    string tag = Post.Tags[i];
    // 以下で、オリジナルの HttpUtility.UrlEncode(tag) を変更。
    tags[i] = string.Format(CultureInfo.InvariantCulture, 
      link, path, BlogEngine.Core.Utils.RemoveIllegalCharacters(tag), 
      HttpUtility.HtmlEncode(tag));
  }
  return string.Join(separator, tags);
}

クエリ文字列は UrlEncode だけでよさそうな気がしましたが、わざわざ Widget の Tag cloud の方で RemoveIllegalCharacters を使うように変更したのは何か理由がありそうなので、それに合わせることにしました。