今月のいらんことしい（2013年 2月）

今月（2013年 2月）、サイト内の管理上の変更、カスタマイズした点をまとめたエントリです。

Movable Type を4.x から 5.x にアップグレード
MovableType カテゴリーページに Twitter 検索のタイムラインのウィジェット設置
Tag archive ページにて、記事内に画像のあるときサムネイル表示
Hatena Bookmark Button の Retinaディスプレイ対応版が表示できるようにした
Twitter ウィジェットを Join the conversation 表示のものを新しいウィジェットに変更
mt.config の DBSocket を明示的に指定

アップデート関連の記事について

Twitter 検索タイムラインウィジェット作成までの手順は下記のとおりです（*2013年2月時点仕様変更等で名称など変わるかもしれません）。

Twitter にログインします
Twitter 検索のページで任意の(検索保存ずみでないもの)キーワードをいれます
結果が表示されたら、ギヤアイコンをクリックして、「この検索をサイトに埋め込む」をクリックします
使用するドメインに設置するドメインをいれます。複数の場合は,(カンマ)で区切ります
ウィジェットを作成でウェジェット設置のコードが表示されます
作成後の編集は、Twitter アカウントの設定の項目のウィジェットのところからおこなえます。フォーム内で指定できるものを変更していきます。「変更を保存」で右のプレビューに反映されます。

<mt:CategoryLabel setvar="catLabel"> <mt:Ignore>カテゴリラベルを変数セット</mt:Ignore>
<mt:If name="catLabel" like="使用するページのカテゴリラベル">
<div id="twWidget_time_line">
__ Twitter ウィジェットのスニペット __
</div></mt:If>

記事内に画像のあるやなしやの改造について

<li class="textBody">
<mt:EntryAssets type="image" lastn="1"><img src="<$MTAssetThumbnailURL height="64" square="1"$>" alt="<$mt:AssetLabel escape="html"$>" width="64" height="64" /> </mt:EntryAssets><$MTEntryExcerpt escape="html"$>
</li>

Hatena Bookmark Button の Retina 対応画像のバージョンですが、 data-* 属性をきちんとしていしてあげていないと昔のほうの画像ででてくるようなので、無理やり data-* 属性をセットするようにして動作させました (頑にHTML5 にしない)。

// require jQuery
$(document).ready(function(){
    $(".hatena-bookmark-button").attr('data-hatena-bookmark-layout','standard-balloon');
})
// attr() の第2引数は、ボタンのタイプ (はてなブックマークボタン作成のページを参照)setTimeout (function(){
 var h = document.getElementsByTagName("head")[0] || document.documentElement;
 var script = document.createElement("script");
 script.src = 'http://b.st-hatena.com/js/bookmark_button.js';
 script.type = 'text/javascript';
 script.async = 'true';
 h.appendChild(script);
} ,800);
// はてなブックマークボタンの画像リンクの a 要素には class="hatena-bookmark-button"を付与しておきます

環境変数 DBSocket の設定は、Can't connect to local MySQL server through socket '/tmp/mysql.sock'が出ることがあったためです。

エラーについては、「Can't connect to local MySQL server through socket」エラーについてが参考になりました。

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

当ブログのカスタマイズ記録

今月のいらんことしい（2013年 2月）

アップデート関連の記事について

記事内に画像のあるやなしやの改造について

Comments: