« イレクショ〜ン！（選挙） | Main | コメントをポップアップ・ウインドウで表示する »
May 13, 2005
トラックバックをポップアップ・ウィンドウで表示する
エントリーの“Posted by”に並んで表示される“TrackBack (0)”をクリックすると、ポップアップ・ウィンドウが表示されるよう、カスタマイズを行ってみよう。
STEP 01: Main IndexテンプレートにJavaスクリプトを記述する
1) MovableTypeの管理画面[mt.cgi]にアクセスし、テンプレート編集画面のIndex Templatesから[Main Index]テンプレートをクリックする。
Main Menu > Your Blog > Templates
2) テンプレート内の<head></head>タグの間に、以下のJavaスクリプトを記述する。青文字で示した数値、属性は、任意に変更してかまわない。
<script language="JavaScript" type="text/JavaScript">
<!--
function OpenTrackback (c) {
window.open(c,
'trackback',
'width=640,height=480,scrollbars=yes,status=yes,resizable=no');
}
//-->
</script>
3) テンプレートをSave & Rebuidして終了。
STEP 02: Main Indexテンプレート内のタグを修正する
1) テンプレートからPosted byで始まるタグの中から、以下の青文字で表示した部分を選択し、
<p class="posted">Posted by <$MTEntryAuthor$> at <a href="<$MTEntryPermalink valid_html="1"$>"><$MTEntryDate format="%X"$></a>
<MTEntryIfAllowComments>
| <a href="<$MTEntryPermalink archive_type="Individual"$>#comments">Comments (<$MTEntryCommentCount$>)</a>
</MTEntryIfAllowComments>
<MTEntryIfAllowPings>
| <a href="<$MTEntryPermalink archive_type="Individual"$>#trackbacks">TrackBack (<$MTEntryTrackbackCount$>)</a>
</MTEntryIfAllowPings>
</p>
2) 以下に示したタグでそっくり置き換える。
<a href="<$MTCGIPath$><$MTTrackbackScript$>?__mode=view&entry_id=<$MTEntryID$>" onclick="OpenTrackback(this.href); return false">TrackBack (<$MTEntryTrackbackCount$>)</a>
3) テンプレートをSave & Rebuidして終了。
TrackBack (0)をクリックすると、ポップアップ・ウインドウが表示される。
STEP 03: TrackBack Listingテンプレート内のタグを修正する
1) STEP 01と同様のテンプレート編集画面から、Special Templatesの[TrackBack Listing Template]をクリックする。
Main Menu > Your Blog > Templates
2) 以下の4カ所に、青文字で示したtarget="new"属性を追加する。この処理を行わないと、ポップアップ・ウインドウ内にリンク先のページが表示されてしまう。
<p>Listed below are links to weblogs that reference <a href="<$MTEntryPermalink$>" target="new">'<$MTEntryTitle$>'</a> from <a href="<$MTBlogURL$>" target="new"><$MTBlogName encode_html="1"$></a>.</p>
<MTPings>
<p id="p<$MTPingID$>">
» <a href="<$MTPingURL$>" target="new"><$MTPingTitle$></a> from <$MTPingBlogName encode_html="1"$><br />
<$MTPingExcerpt$> <a href="<$MTPingURL$>" target="new">[Read More]</a>
</p>
