日曜日コンサルティングのネタ帳でタグ「ムーバブルタイプ」が付けられているもの

ムーバブルタイプの管理画面で強制的にログアウトが続くような状態になりました。

そこで疑った原因は次の通り…

  1. サーバーの混雑/異常
  2. ブラウザのキャッシュ/クッキーの問題
  3. SQLの不具合
  4. MTのバグ

とりあえず、サーバーの混雑状況をチェックしてみました。
日曜日コンサルティングのネタ帳は、コアサーバーを利用しているので、次のWebサイトで確認できます。
http://mainte.coreserver.jp/

混雑や障害がなければ、ブラウザのキャッシュを疑ってみましょう。

firefoxの場合、メニューバーから次の操作でたどり着けます。
ツール>オプション
新しいウィンドウが開くので、プライバシータグのクッキーとプライバシーを全て削除。

これでも状況が改善されなかったので、SQLを疑いました。

SQLは、myphpAdminなるソフトがサーバーにインストールされていることが多いです。
コアサーバーも例に違わず、myphpAdminなのでその手順をメモしておきます。

MTのデータベースにアクセス(MTのデータベースは頭文字にmt_と独特の接頭語が付いています)します。
MTのデータベースにアクセスできたら、とりあえず全てのテーブルにチェックを入れて、下の「修復ボタン」を押してみましょ。
画面が切り替わるので、エラーがないか確認してください。(ぼくはエラーがありました…)
エラーがあったテーブルをメモして、MTのデータベースに再アクセスします。
エラーのあったテーブルをチェックして、下の「修復」ボタンを押しましょう。

僕はコレで直りました。

もし、これでも直らなければ、データベースのバックアップと、MTのバックアップをとって、MTを再インストールする羽目になっていました。恐ろしや恐ろしや。

mtの基本 メモ

|

<mt:SetVarBlock name="title"><$mt:BlogName encode_html="1"$></mt:SetVarBlock>

mt:setvarblockで宣言して

<$mt:Var name="title"$>

引っ張りたいページでvarで呼び出す

<MTArchives archive_type="Category">

<MTArchiveList archive_type="Month" lastn="10">
  <MTEntries lastn="10">
    <MTEntriesHeader>
<h3><img src="<mt:BlogUrl />img-home/t-kouhoushi.gif" alt="広報誌" width="94" height="20" /> <$MTCategoryLabel$></h3><address><$MTEntryModifiedDate format="%b %d, %Y %H:%M" language="en"$></address>
<ul>
    </MTEntriesHeader>

<li>
<h4><$MTEntryTitle$></h4>
<p><$MTEntryBody words="80"$>…   (<img src="img/link.gif" alt="" width="13" height="12" /><a href="<$MTEntryLink archive_type="Individual"$>" target="kouhoushi">続きを読む</a>)</p>
</li>

    <MTEntriesFooter>
      </ul>
    </MTEntriesFooter>
  </MTEntries>
</MTArchiveList>
</MTArchives>

mtで最新カテゴリーへのリンクを張る

|

<MTEntries lastn="1"><MTEntryCategories>
    <a href="<$MTArchiveLink archive_type="Category"$>">最新号の記事一覧</a>
</MTEntryCategories></MTEntries>

<MTPages id="56">
<$MTPageBody templatize="all"$>
</MTPages>

説明不要かな。

WebページのIDは「ログ」画面で確認可能

<div id="wrap">
<MTIf name="page" eq="home">
<p id="vi"><img src="img-home/v.jpg" alt="***" width="777" height="235" /></p>
<p id="messege"><img src="img-home/messege.gif" alt="***" width="519" height="40" /></p>
<MTElseIf name="page" eq="other">
<MTPages lastn="1">
<p id="vi"><img src="img-home/v-<$MTPageBasename$>.jpg" alt="<$MTPageTitle$>" width="777" height="150px" /></p>
</MTPages>
</MTIf>

<div id="contents">


メインページに
<MTSetVar name="page" value="home">

アーカイブテンプレートのウェブページに
<MTSetVar name="page" value="other">

タグを仕込み、セカンドページ以降のビジュアル画像の名前付けルールをWebページのファイル名と同じにすればOK。オルトは、ページのタイトルが入ります。
 

もっと効率的な方法がありそうだけど、この方法は結構シンプルで使いやすい     気がする

メインページに
<MTSetVar name="page" value="home">

アーカイブテンプレートのウェブページに
<MTSetVar name="page" value="other">

仕込んで、各Webページに対応したタグを入れれば、そのページだけ特定のタグを表示させることができます。グループ化したい場合は、グループ化したいWebページに同じタグを付けてください。

まぁフォルダに分別して、そのフォルダー別にルールを縛るって言う方法もあるけどね

 

<MTIf name="page" eq="home">
<p id="visual01"><a name="top" id="top"><img src="<mt:BlogUrl />img/top01.gif" alt="" width="900" height="12" /></a></p>
<div id="containerInner">
<p id="visual02"><img src="<mt:BlogUrl />img/top02.jpg" alt="" width="900" height="268" /></p>
<MTElseIf name="page" eq="other">

<MTPageTags>
<MTPageIfTagged tag="carrecycle">
<p id="visual01"><a name="top" id="top">
<img src="<mt:BlogUrl />img/top01.gif" alt="" width="900" height="12" /></a></p>
<div id="containerInner">
<p id="visual02">
<img src="<mt:BlogUrl />img/top02.jpg" alt="" width="900" height="268" /></p>
</MTPageIfTagged>

<MTPageIfTagged tag="carrecycleschool">
<p id="visual01"><a name="top" id="top">
<img src="<mt:BlogUrl />img/top01.gif" alt="" width="900" height="12" /></a></p>
<div id="containerInner">
<p id="visual02">
<img src="<mt:BlogUrl />img/top02.jpg" alt="" width="900" height="268" /></p>
</MTPageIfTagged>

<MTPageIfTagged tag="iso14001">
<p id="visual01"><a name="top" id="top">
<img src="<mt:BlogUrl />img/top01.gif" alt="" width="900" height="12" /></a></p>
<div id="containerInner">
<p id="visual02">
<img src="<mt:BlogUrl />img/top02.jpg" alt="" width="900" height="268" /></p>
</MTPageIfTagged>

<MTPageIfTagged tag="usedparts">
<p id="visual01"><a name="top" id="top">
<img src="<mt:BlogUrl />img/top01.gif" alt="" width="900" height="12" /></a></p>
<div id="containerInner">
<p id="visual02">
<img src="<mt:BlogUrl />img/top02.jpg" alt="" width="900" height="268" /></p>
</MTPageIfTagged>

<MTPageIfTagged tag="kaitori">
<p id="visual01"><a name="top" id="top">
<img src="<mt:BlogUrl />img/top01.gif" alt="" width="900" height="12" /></a></p>
<div id="containerInner">
<p id="visual02">
<img src="<mt:BlogUrl />img/top02.jpg" alt="" width="900" height="268" /></p>
</MTPageIfTagged>

<MTPageIfTagged tag="company">
<p id="visual01"><a name="top" id="top">
<img src="<mt:BlogUrl />img/top01.gif" alt="" width="900" height="12" /></a></p>
<div id="containerInner">
<p id="visual02">
<img src="<mt:BlogUrl />img/top02.jpg" alt="" width="900" height="268" /></p>
</MTPageIfTagged>

<MTPageIfTagged tag="press">
<p id="visual01"><a name="top" id="top">
<img src="<mt:BlogUrl />img/top01.gif" alt="" width="900" height="12" /></a></p>
<div id="containerInner">
<p id="visual02">
<img src="<mt:BlogUrl />img/top02.jpg" alt="" width="900" height="268" /></p>
</MTPageIfTagged>


<MTPageIfTagged tag="faq">
<p id="visual01"><a name="top" id="top">
<img src="<mt:BlogUrl />img/top01.gif" alt="" width="900" height="12" /></a></p>
<div id="containerInner">
<p id="visual02">
<img src="<mt:BlogUrl />img/top02.jpg" alt="" width="900" height="268" /></p>
</MTPageIfTagged>


<MTPageIfTagged tag="map">
<p id="visual01"><a name="top" id="top">
<img src="<mt:BlogUrl />img/top01.gif" alt="" width="900" height="12" /></a></p>
<div id="containerInner">
<p id="visual02">
<img src="<mt:BlogUrl />img/top02.jpg" alt="" width="900" height="268" /></p>
</MTPageIfTagged>

<MTPageIfTagged tag="otoiawase">
<p id="visual01"><a name="top" id="top">
<img src="<mt:BlogUrl />img/top01.gif" alt="" width="900" height="12" /></a></p>
<div id="containerInner">
<p id="visual02">
<img src="<mt:BlogUrl />img/top02.jpg" alt="" width="900" height="268" /></p>
</MTPageIfTagged>

<MTPageIfTagged tag="nagare">
<p id="visual01"><a name="top" id="top">
<img src="<mt:BlogUrl />img/top01.gif" alt="" width="900" height="12" /></a></p>
<div id="containerInner">
<p id="visual02">
<img src="<mt:BlogUrl />img/top02.jpg" alt="" width="900" height="268" /></p>
</MTPageIfTagged>


</MTPageTags>
</MTIf>

<div id="container">
<MTIf name="page" eq="home">
<h1>山形県山形市の島田</h1>
<MTElseIf name="page" eq="other">
<h1><$MTPageExcerpt$></h1>
</MTIf>

メインページに
<MTSetVar name="page" value="home">

アーカイブテンプレートのウェブページに
<MTSetVar name="page" value="other">

タグを仕込んでおくと、表示を切り分けられます。

上記のスクリプトは、画面の一番左上に出現させる(SEO目的の)キーワードをだすスクリプトです。

<$MTPageExcerpt$>はWebページの概要欄に入力したモノが表示されます。

手順2.5

まずは、再構築ボタンを押して、再構築します。

MTインストール直後は、Webサイトを構築するフォルダが作られていません。

再構築後、ホームページを格納するフォルダができているはずなので、そのなかにWebサイトで利用する画像をFTPソフトで画像をフォルダにアップロードする。

手順3

HTMLヘッダーを作る

おおむね、これだけ知っていればいいだろう。的なタグを寄せ集めてヘッダーを作成しました。
まずはご覧下さい。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<$mt:PublishCharset$>" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="<$mt:Link template="rsd"$>" />
<link rel="alternate" type="application/atom+xml" title="Recent Entries" href="<$mt:Link template="feed_recent"$>" />

<link href="<mt:BlogUrl />tag-format.css" rel="stylesheet" type="text/css" />
<link href="<mt:BlogUrl />common.css" rel="stylesheet" type="text/css" />

<link href="<mt:BlogUrl />initialaize.css" rel="stylesheet" type="text/css" />
<link href="<mt:BlogUrl />common.css" rel="stylesheet" type="text/css" />

<MTIf name="page" eq="home">
<meta name="keywords" content="島田,山形" />
<meta name="description" content="山形の島田です" />
<title>山形の島田ページ</title>
<link href="<mt:BlogUrl />home.css" rel="stylesheet" type="text/css" />
<link rel="alternate stylesheet" type="text/css" href="<mt:BlogUrl />home.css" title="standard" />
<link rel="alternate stylesheet" type="text/css" href="<mt:BlogUrl />home-small.css" title="small" />
<link rel="alternate stylesheet" type="text/css" href="<mt:BlogUrl />home-big.css" title="big" />

<MTElseIf name="page" eq="other">
<meta name="keywords" content="<$MTPageKeywords$>" />
<meta name="description" content="<$MTPageExcerpt$>" />
<title>島田|<$MTPageTitle$></title>
</MTIf>

 

<MTIf name="page" eq="home">
<link href="<mt:BlogUrl />home.css" rel="stylesheet" type="text/css" />
<MTElseIf name="page" eq="other">
<MTPageTags>
<MTPageIfTagged tag="column"><link href="<mt:BlogUrl />second.css" rel="stylesheet" type="text/css" /></MTPageIfTagged>
<MTPageIfTagged tag="nocolumn"><link href="<mt:BlogUrl />second02.css" rel="stylesheet" type="text/css" /></MTPageIfTagged>
</MTPageTags>
</MTIf>

<script type="text/javascript" src="<mt:BlogUrl />styleswitcher.js"></script>
<script type="text/javascript" src="<mt:BlogUrl />smartRollover.js"></script>
<link REL="stylesheet" type="text/css" HREF="<mt:BlogUrl />print.css" media="print">

</head>
<body>
<div id="head">
<h1><a href="<mt:BlogUrl />"><img src="<mt:BlogUrl />img-common/home.gif" alt="" width="300" height="28" /></a></h1>

<p><img src="<mt:BlogUrl />img-common/moji-title.gif" alt="文字サイズを変更できます" width="161" height="27" /><a href="javascript:void(0);" onclick="setActiveStyleSheet('big'); return false;"><img src="<mt:BlogUrl />img-common/moji-big.jpg" alt="文字を大サイズにします" width="23" height="27" /></a><a href="javascript:void(0);" onclick="setActiveStyleSheet('standard'); return false;"><img src="<mt:BlogUrl />img-common/moji-mid.jpg" alt="文字を中サイズにします" width="18" height="27" /></a><a href="javascript:void(0);" onclick="setActiveStyleSheet('small'); return false;"><img src="<mt:BlogUrl />img-common/moji-small.jpg" alt="文字を小サイズにします" width="20" height="27" /></a></p>

<ul id="globalnavi">
<li><a href="<mt:BlogUrl />"><img src="<mt:BlogUrl />img-common/01-off.jpg" alt="ホームへ戻る" width="133" height="77"/></a></li>
<li><a href="<mt:BlogUrl />koe.html"><img src="<mt:BlogUrl />img-common/02-off.jpg" alt="お客様の声" width="133" height="77"/></a></li>
<li><a href="<mt:BlogUrl />map.html"><img src="<mt:BlogUrl />img-common/03-off.jpg" alt="周辺地図" width="131" height="77"/></a></li>
<li><a href="<mt:BlogUrl />boshu.html"><img src="<mt:BlogUrl />img-common/04-off.jpg" alt="職員募集" width="132" height="77"/></a></li>
<li><a href="<mt:BlogUrl />vo.html"><img src="<mt:BlogUrl />img-common/05-off.jpg" alt="ボランティア募集" width="133" height="77"/></a></li>
<li><a href="<mt:BlogUrl />shiteki.html"><img src="<mt:BlogUrl />img-common/06-off.jpg" alt="ご指摘ご要望" width="138" height="77" border="0"/></a></li>
</ul>
</div>

解説は、次回にします

手順1?

MTでWebサイトを作る前に、DWでレイアウトを完璧に整える

…っというのも、MTでWebサイトを作ってからCSS変更するのって大変なんですよ。ですから、小規模なWebサイトならすべてDWでもホームページビルダーでもいいから先にWebサイトを作成指定した方が遠回りなようで近道です。

ちなみに僕は50ページ程度のWebサイトなら先に作り込んでしまって、納品前にMT化します。

手順2

テンプレートを作成する

作成するテンプレートは次の通り。
※インストール時からあるテンプレートは削除しないように!

インデックステンプレート
DWで作成したWebページのCSSを適当なテンプレート名を付けて保存してきます。
僕なら次の表のようなテンプレートを作成します。このあたりは、作成する人それぞれでしょうね。
既存のテンプレートは削除しないようにお願いします。

ちなみに、CSSを登録するときに背景画像の指定をしている場合、オーサリングソフトはおおむね相対指定になっているはずです。絶対指定の方が、安心できるかなぁと思いますので、相対指定の前に<mt:BlogUrl />を入力してください。<mt:BlogUrl />は、ブログを作成したときに指定したURLに変換されます。

テンプレート名出力ファイル名
CSS:スタイルシートの初期化initialize.css
CSS:レイアウトcommon.css
CSS:トップページ  home.css
CSS:セカンドページの書式設定second.css
css:印刷用CSS  print.css

テンプレートモジュール
次のテンプレートモジュールを作成します。
どのページでも同じような内容ならテンプレートモジュール化してしまった方が効率的です。
分割しすぎるとワケ分からなくなりますけどね。

  • HTMLヘッダー
    HTMLタグから大体共通しているところまでざっくりモジュール化します。
    第三回くらいから、詳細に説明します。
       
  • HTMLフッター 
    おおむね終わりそうなところからHTMLタグ終了までをモジュール化します。
    これも同じく第三回くらいから詳細に説明します。
     
  • グローバルナビ 
    Webサイトを横断的にまたいでいるリンク集
    カテゴリーやフォルダーでわければ自動的にリンクを生成できるけれども、情報をたくさん取り扱うようなサイトならいざ知らず、通常のWebサイトなら固定で十分。てなわけで、Webページを直接指定したWebサイトを構築します。
      
  • 左ナビゲーション
    グローバルナビゲーションの下にローカルリンクなんて欲しい場合があるじゃないですか、そのために用意しました。なくても問題はありません。               

修正するテンプレート

  • インデックステンプレート
    メインページ index.htmlページ
  • アーカイブテンプレート
    ウェブページ

おまけ

僕が使っている初期化CSSはこんな感じ。
YAHOOのライブラリでダウンロードしてきたモノにimgへのスタイル追加したモノを使っておりまする。

では、また次回。

/* タグの初期化用CSS */

html{
 margin: 0px;
 padding: 0px;
 border-top-width: 0px;
 border-right-width: 0px;
 border-bottom-width: 0px;
 border-left-width: 0px;
 border-top-style: none;
 border-right-style: none;
 border-bottom-style: none;
 border-left-style: none;
}

/* Yahoo!User Interface Libraryの初期化CSSを利用 */
body {color:#000;background:#FFF;margin:0;padding:0;}
div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
li {list-style:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
abbr,acronym {border:0;font-variant:normal;}
sup,sub {line-height:-1px;vertical-align: text-top;}
sub {vertical-align:text-bottom;}
input, textarea, select{font-family:inherit;font-size:inherit;font-weight:inherit;}

/* イメージをリンクした際に、囲い線がでないようにする */
a img {
 border:0;
 overflow: hidden;
}
 

※僕のMT構築のメモ書き程度の記事です。
チラシの裏よりかは役に立ちます。。。と思う。

Webサイトの仕様

基本的に初心者でも更新できる

変なプラグインは使わない
※初心者が更新できなくなります

Webページ機能だけでWebサイトを構築
ブログ機能を使うと、記事が多くなりすぎて直感的に修正できなくなるためです。
 ブログ機能も後付けできます。
 マルチブログタグ未使用で、簡単設置

FCKエディタのアイコンをかわいくする方法

トップ1%様のブログに記事があったのでメモ。

FCKエディタのアメリカンコミック調のキャラクターをDoCoMoの絵文字に切り替えられます。

http://www.dakiny.com/archives/movable-type/movable_type_4_fckeditortypepad/

っというカテゴリーを作ってみました。

ムーバブルタイプでWebサイトを構築しますってなった場合、書店で販売しているムーバブルタイプのカスタマイズの本ってちょっと使いづらいんですよね。お客様が求めているWebサイトってのはもっとシンプルなものが多いような気がします。

んなわけで、ムーバブルタイプで構築する超簡単なWebサイトの構築手順をご紹介します。(まぁ僕のメモとして残しておきたいわけですけどね。)我流の構築方法なので、つっこみどこ満載ですが閲覧してくださっている方の参考になれば幸いです。

構築するWebサイトの概要

  • トップページ
  • 商品紹介
  • 採用募集ページ
  • お問い合わせページ(メールフォーム)
  • 社員ブログ※オマケで付けます

用意するもの

構築方法手順

ムーバブルタイプがインストールされた状態からスタートです

  1. トップページ作成
  2. Webページ作成(商品紹介、採用募集)
  3. お問い合わせページ作成(メールフォーム作成)
  4. ブログの設定をいじる

以上!なんて簡単なWebサイトでしょうw

中小企業のWebサイトなんて、おおむねこのレベルで満足してくれるお客様が多い気がしますよ。

まぁ僕の営業努力が足りていないだけかもしれませんが…。。。。

ぼちぼち更新してきますノシ

MTにFCKエディタを3つの簡単ステップでインストールしてみますよ

ムーバブルタイプのエディタ強化かんたんにしちゃいましょう。

(カスタマイズってなると話が違うんだけどね ちょっと面倒です)

 

手順1:男なら黙ってダウンロード

次のWebサイトから、MT-Plugin-FCKeditor-1.2.ja_v2.zipをダウンロードしてください。これがムーバブルタイプに簡単にFCKエディタをインストールするファーストステップになります。

http://sourceforge.jp/projects/fckeditor/releases/

fckエディタ00

手順2:ファイルを解凍し、アップロード

FCKエディタのファイルを圧縮した「MT-Plugin-FCKeditor-1.2.ja_v2.zip」がダウンロードできたはずです。それを解凍し、「mt-static」「plugins」のフォルダをムーバブルタイプをインストールしたフォルダにアップロードしてください。FTPソフトが「上書きしちゃうよ?」と聞いてくるのでOKボタンを押してください。

なお、補足で画像をアップロードしていますが、僕はmtのインストール先を「system」ってフォルダにしています。さくらインターネットさんやロリポップさんのムーバブルタイプ標準インストールマニュアルに従ってインストールした場合「mt」になっているはずです。その場合は、「mt」フォルダに、「mt-static」「plugins」フォルダをぶち込んでください。

fckエディタ01

手順3:mt-config.cgiに呪文を記述w

ムーバブルタイプをインストールしてるフォルダから「mt-config.cgi」をダウンロードして、下記の呪文を追記します。んで、「mt-config.cgi」を同じフォルダにアップロードして上書きしてください。

これにて、ムーバブルタイプにFCKエディタがインストールされました。簡単簡単。

#======== RichTextEditor =======================

RichTextEditor FCKeditor

fckエディタ02

<MTIf name="page" eq="home">

<MTElseIf name="page" eq="other">

<MTPageTags>
<MTPageIfTagged tag="products"></MTPageIfTagged>

<MTPageIfTagged tag="capacity"></MTPageIfTagged>

<MTPageIfTagged tag="map"></MTPageIfTagged>

<MTPageIfTagged tag="inquiry"></MTPageIfTagged>

<MTPageIfTagged tag="aboutus"></MTPageIfTagged>

<MTPageIfTagged tag="recruit"></MTPageIfTagged>

<MTPageIfTagged tag="recruit_middle"></MTPageIfTagged>

<MTPageIfTagged tag="recruit_new"></MTPageIfTagged>

</MTPageTags>
</MTIf>

ムーバブルタイプの超便利プラグインを発見

エントリーやウェブページ内でMTタグが使える「Templatize」プラグイン
http://www.skyarc.co.jp/engineerblog/entry/3969.html

 

追記

インストール先は次の通り

解凍したファイルをそのままつっこんだらOK

/www/mt/plugins/

藤本壱様が作成されたムーバブルタイプのメールソフトプラグイン(ver.2.1)、非常にすばらしいのですがカスタムにちょっとだけ手間がかかりました。原因は、僕の力量不足です。ですが、お困りの方もいらっしゃるかもしれませんので、まとめを書き残しておきますよ。
※一部、藤本様の説明を使わせて頂きます。

!この記事は以下の内容について書かれています。
プラグインにWebサイトのスタイル適用させつつ、好きな項目を設定する方法です。
なお、プラグインはムーバブルタイプ4.x対応です。(3.x系では動作しないとのこと)

手順1.プラグインをムーバブルタイプにインストール
藤本壱様のサイトからプラグインをダウンロードして下さい。
ファイル名はMailForm_2_10b.zipです。(2008/10/28現在)
http://www.h-fj.com/blog/mtplgdoc/mailformv2.php

ダウンロードしたファイルを解凍。解凍後、次のフォルダをムーバブルタイプをインストールしたフォルダにアップロードする。
  • mt-static
  • plugins
FFFTPでアップロードすると「上書きしますか?」って聞いてきます。
上書きして下さい。無問題です。

サーバーの「plugins」>「MailForm」にある「mt-mail-form.cgi」のパーミッションを705等に変更して、実行可能な状態にします。

インストール後にはじめてMovable Typeにログインする際には、データベースのアップグレードのメッセージが表示されます。
画面上の「アップグレード開始」のボタンをおして、アップグレードを行います。

ログイン後、システムメニューからメールソフトプラグインをインストールしたいブログを選びます。
なお、メールソフトプラグイン(ver.1.2)をインストールしているならば、この段階でプラグインを除く次のファイルを削除して下さい。(必須項目の設定など、設定の方法がver1.xとver2.xで異なるので記憶も消して下さいw)

ブログメニューの「設定」から「プラグイン」を選びます。
プラグインの一覧が表示されるので、「Mail Form 2.00」をクリックし、「設定」のリンクをクリックします。
「サンプルのメールフォーム用テンプレートをインストール」の箇所の「インストール」のボタンをクリックします。

次のような入力項目が出てきます。それぞれについて藤本様の説明を使いながら書きます。

入力項目:テンプレートセット
サンプルテンプレートセットの種類を選びます。
Movable Typeの標準テンプレートセットと組み合わせる場合は、お使いのMTのバージョンに合わせて「Movable Type 4.1標準テンプレート用」または「Movable Type 4.2標準テンプレート用」を選びます。
MTのバージョンにあっていないテンプレートをインストールすると、テンプレートを再構築する際にエラーが発生しますので、ご注意ください。

入力項目:メールフォームの出力ファイル名
メールフォームを複数持たないのであるならば、特に変更する必要はありません。
デフォルトのままでOK。

入力項目:メールフォームテンプレートの名前(○○○の名前シリーズ)
メールフォームを複数持たないのであるならば、特に変更する必要はありません。
デフォルトのままでOK。
単なるテンプレート名ですので、メールフォーム内のタイトルなどには影響しません。

インストールが完了すると、「ブログメニュー」>「テンプレート」にメールフォーム関連のテンプレートがインストールされているはずです。(以後、説明ではデフォルトのままインストールしたことを前提にご説明します)
次のファイルがインストールされていることを確認して下さい。

インデックステンプレート
  • mail_form:メールフォーム(ファイル名はmailform.html)
テンプレートモジュール
  • mail_body:メール本文
  • mail_common:メールフォーム共通部分
  • mail_error:送信エラー
  • mail_post:送信完了
  • mail_preview:送信確認
  • mail_reply:返信メール
一応、このあたりまででプラグインのインストールは無事に終わりました。

手順2.メールフォームの初期設定
メールフォームの設定を始めるには、ブログのメニューで「新規作成」→「メールフォーム」を選びます。
ブログメニューで「新規作成」>「メールフォーム」を選びます。

メールフォームの設定を行うページが開きます。
ムーバブルタイプインストールできる方なら、読めば特に分かる項目ばかりだと思います。
適当に名前を書いて、メールアドレスを設定して下さい。

ただ1点注意して頂きたい点があります。
メールフォームテンプレート項目の「メールフォームテンプレートに、必須のMTSetVarタグを追加」のボタンを押して、mailform.htmlに追加して下さい。
ボタンを押すだけで自動的に登録されます。(偉い!)

手順3.メールフォームの作成(カスタマイズ)
「mail_common:メールフォーム共通部分」を開いて、メールフォームのカスタマイズをしまっしょい!
基本的なフォームの書き方は次のようになります。

1.フォーム要素のname属性に適当な名前(例:seikaku)を付ける
※名前、本文、メールアドレスは専用の名前が割り当てられています。
  自分が定義したname属性と重複しないように気を付けて下さい。

2.value属性に特定のタグを入れる。タグのname属性はフォームのname属性と同じ。

<$MTMailPreviewExtParam name="seikaku"$>とか
<$MTMailPreviewAuthor$>等
※名前、本文、メールアドレスなどは既に専用のタグが用意されていますよ。
 面倒なら全て「MTMailPreviewExtParam」タグでvalue属性を埋めて良いと思います。

ね、簡単でしょ?

具体的には次のように書き換えて下さいまし。
name属性は英数字でお願いします。

 <form method="post" action="<$MTCGIPath$>plugins/MailForm/mt-mail-form.cgi" name="mail_form" id="mail_form">

氏名
<input type="text" id="mail_author" name="mail_author" size="30" value="<$MTMailPreviewAuthor$>" />※必須

性別
<input type="radio" name="sex" id="onna" value="<$MTMailPreviewExtParam name="sex"$>" />
<label for="onna">女</label>
<input type="radio" name="sex" id="otoko" value="<$MTMailPreviewExtParam name="tourokureki"$>" checked="checked"/>
<label for="otoko">男</label>

住所
<input type="text" id="adress" name="adress" size="60" value="<$MTMailPreviewExtParam name="adress"$>" />

電話番号
<input type="text" id="tell" name="tell" size="30" value="<$MTMailPreviewExtParam name="tell"$>" />※必須

メールアドレス
<input type="text" id="mail_email" name="mail_email" size="60" value="<$MTMailPreviewEMail$>" />※必須

お問い合わせ内容:
<textarea id="naiyou" name="naiyou" rows="7" cols="60"><$MTMailPreviewExtParam name="naiyou"$></textarea>

<input type="hidden" name="mail_blog_id" value="<$MTBlogID$>" />
<input type="hidden" name="mail_setting" value="<$MTGetVar name="mail_setting">" />
<input type="submit" accesskey="v" name="mail_preview" id="mail_preview" value="確認" />
<input type="submit" accesskey="s" name="mail_post" id="mail_post" value="送信" />
</form>

</form>前にあるhidden書いているプロパティは削除しないで下さいね。

んで、必須項目にしたい項目は、nameに書いた英数字をメモして下さい。
メニュー>一覧>メールフォームを選択し、「未入力エラーをチェックするフィールド」項目にカンマで区切って羅列します。
上記の例だとこんな感じ。
未入力エラーをチェックするフィールド:mail_author,tell,mail_email

手順4.確認画面他の記述
メニュー>デザイン>テンプレートの「メール本文」「送信確認」のテンプレートをいじります。
まずは、「メール本文」からいじりますか。
次のような特定のタグで入力した内容を読み出せるみたいです。

<$MTMailPreviewExtParam name="  name属性が入る "$>
<$MTMailPreviewAuthor$>他
※名前、本文、メールアドレスなどは既に専用のタグが用意されていますよ。

んで、上記事例を取り上げたらこんな感じ。

名前:<$MTMailPreviewAuthor$>
性別:<$MTMailPreviewExtParam name="sex"$>
住所:<$MTMailPreviewExtParam name="adress"$>
電話番号:<$MTMailPreviewExtParam name="tell"$>
E-mail:<$MTMailPreviewEMail$>
お問い合わせ内容:
<$MTMailPreviewExtParam name="naiyou"$>

ね、簡単でしょ?
もうちょっと凝れば、メールアドレスを2回入力させて確認を取るなんてこともできそうですよ。
後日、記入します。
「The blog of H.Fujimoto」様からメールフォームプラグインをいただきました。
ひじょーーーに使いやすくて、すばらしい!商用利用でもたった1000円という驚きの安さ!
10倍の1万円でも支払っても良いくらいです。(出世払い的な意味で)

ただ、一部バグ?があり、インストールが4時間ほど中断しました。
Google先生に相談してみたところ、あんがい同じ悩みの人がいて驚き。

僕が遭遇したバグは、「starbrother.net」さんと同じエラーです。

再構築エラー: テンプレート「mail_form:メールフォーム」の再構築中にエラーが発生しました: <mtIncludeMailFormCommon>タグでエラーがありました: 「mail_common:メールフォーム共通部分 (Backup from 2008-09-04 20:50:44)」というモジュールテンプレートが見つかりませんでした。
対処方法は次の通り(こちらも「starbrother.net」さんから)
<mtIncludeMailFormCommon>を消し、代わりに、そこへテンプレートモジュールmail_common:メールフォーム共通部分をそのままカットアンドペーストしてから再構築するとメールフォームが構築できます。

タグ

2010年9月

      1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30    

相互リンク