MovableTypeのススメ - MovableTypeアーカイブ

2007年9月13日

ページの先頭に改行が入る問題（MTRemoveBlank）

MovableType4では出力されたページの先頭に空の改行が入ってしまいます。

これはページの先頭部分、<MTSetVar>を使って変数を定義している箇所で、<MTSetVar>自体は何も出力しないのですが、タグの間に入れる改行が出力されてしまうためです。

そのため、DOCTYPE宣言がページの先頭にならないんですね。

簡単な対策としては<MTSetVar>の後ろに改行を入れないでそのまま続けてしまうことです。

<MTSetVar name="body_class" value="mt-main-index"><MTSetVar name="main_template" value="1"><MTSetVar name="main_index" value="1"><MTSetVar name="sidebar" value="1"><MTSetVar name="module_recent_entries" value="1"><MTSetVar name="module_category_archives" value="1"><MTSetVar name="module_author_archives" value="1"><MTSetVar name="module_monthly_archives" value="1"><$MTInclude module="ヘッダー"$>

でも、この方法だとテンプレートが見づらくなってしまうんですよね。

そこで見つけたのがMTRemoveBlankプラグイン。ページ内のタグとタグの間のスペースやタブを削除してくれます。（ MovableType3.3x、MovableType4 で確認済みとのことです。）

[使い方]
１．MTRemoveBlankプラグインをダウンロード

２．RemoveBlank.plをMTのプラグインディレクトリへアップ

３．テンプレート全体を <MTRemoveBlank></MTRemoveBlank> で囲む

以上です。

配布元はMovableType備忘録さまです。ありがとうございます。

この記事は期待通りの内容でしたか？

Permalink | Category : | Comments [0] | Trackbacks [0]

2007年9月11日

はてなスターを付けてみました。（MTHatenaStar）

はてなスターとは、ブログにワンクリックで☆が付けられるサービスです。
簡易トラックバックといった感じでしょうか。

詳しくはこちらを参照下さい。

はてなスターはじめてガイド

導入方法ですが、通常通り<script>タグを埋め込む方法もありますが
MTのプラグインMTHatenaStarを使う方法で試してみました。

１．Kickstart my heartよりMTHatenaStarプラグインをダウンロード。

２．ダウンロードしたファイルを解凍し、MTHatenaStarフォルダを
pluginsディレクトリへアップロード。

３．はてなスターのページへアクセスしログインします。
アカウントを持っている人はログイン、持ってない人はユーザ登録します。

２．Blogsをクリック、「外部のブログサイトを登録する」にサイトURLを登録

３．表示された<script>コードのトークン部分をコピー

４．プラグインの設定画面で、３で取得したトークンを入力し・保存

５．はてなスターを表示したい場所に<$MTHatenaStar$>を挿入・再構築

以上です。

今回、参考にさせて頂いたのはプラグイン配布元のKickstart my heartさんです。ありがとうございます。

この記事は期待通りの内容でしたか？

Permalink | Category : | Comments [0] | Trackbacks [0]

2007年9月 4日

Ajaxで画像表示（ThickBox3）

~~ThickBox3で利用しているjquery.jsが原因でAjaxカレンダーが表示できなくなったため現在、ThickBox3の使用を止めています。なのでサンプルは動きません。~~
調べたところprototype.jsがjQuery.jsに干渉しているようです。
上記の問題を修正しました。詳しくはコチラ

ThickBox3はAjaxを利用して画像を表示するライブラリです。
同じようなものにLightboxもありますが、今回はThickBoxを使ってみることに。

設置するとこんな感じで表示されます。（サンプル）

それでは設置方法です。

１．下記サイトより必要なファイルをダウンロード

ThickBox 3.1

「Download」の箇所に各ファイルへのリンクがあるので、右クリックし対象をファイルへ保存。必要なファイルは下記の通りです。

・thickbox.js
・jquery.js
・thickbox.css
・loadingAnimation.gif

２．ダウンロードしたファイルを自身のサーバにあわせてアップロード

３．テンプレートの<head>～</head> に下記を追加・再構築

<script type="text/javascript" src="<$MTBlogURL$>js/jquery.js"></script>
<script type="text/javascript" src="<$MTBlogURL$>js/thickbox.js"></script>

<link rel="stylesheet" href="<$MTBlogURL$>thickbox.css" type="text/css" media="screen" />

パス部分は自身のサーバにあわせて書き換えてください。

４．<a>タグのclass属性にthickboxを指定する。

<a href="http://mt.nosusume.com/img/sample_l.gif" title="サンプル" class="thickbox">サンプル</a>

左下のキャプションはtittle属性で指定できます。

以上です。

他にもいろいろと機能があるようです。
詳しくは本家サイトを参照して下さい。

この記事は期待通りの内容でしたか？

Permalink | Category : | Comments [0] | Trackbacks [0]

<<前のページへ 5｜6｜7｜8｜9｜10｜11｜12｜13｜14 次のページへ>>