携帯サイトの検索エンジン対策 ・リンクされてもクロールされにくい(非確実) ・携帯サイトのリンクはめんどう(携帯から登録限定とかある) ・アクセス数=携帯というインターフェースの親和性×携帯を好むユーザーの親和性(分野による) ※あくまで主観です 携帯サイトをYahoo!の検索結果に出したいんだけど...と思いまして、 色々と方法を探したのですが、情報商材とかうざったいものばかりがでてきて困りましたが、ちゃんと正攻法で登録する方法を見つけてきました。 ■Googleウェブマスターツール https://www.google.com/webmasters/tools/siteoverview?hl=ja&pli=1 ■Yahoo!サイトエクスプローラー https://siteexplorer.search.yahoo.com/mobilesubmit どちらもアカウントを取得しなければ使えません。 サイトの認証のためにダミーのHTMLファイルをアップするか、タグをHTMLに埋め込むかしなくてはいけないので、メンテナンスを考慮するとHTMLファイルのアップがおすすめです。 サイトのトップページを登録してやるだけでも構いませんが、細かいページまでクロールさせたい場合は、Feedというところがあるので、サイトマップのXMLを作成するようにして、それをアドレスを入れてやれればベストです。
ついに画像に対応しました。 携帯から管理画面にアクセス→写真アップロード→写真のURLをエントリー画面に渡す というフローにしました。というかそれ以上はムリでした。 ファイルのアップロード画面は標準のテンプレートから「削り」出しました。画像は「続き」につっこむようにしています。 公開できるシロモノではありませんので、欲しい人は直接言ってください(笑)
MT4LP5でアルファサードの野田さんがやっていたことの真似をしてみます。
iMTをカスタマイズすることで、MovableTypeの携帯用の管理画面(仮)ができました。「携帯から投稿をしたい!」という圧倒的なニーズに応えている途中です(嘘)ファイルの再配布は禁止なので、どうやったら可能なのかを書いておきます。まずはIMTを導入しておいてください。
※今回のやり方ではUTF-8のページを表示できる携帯でしか使えません。そもそもSHIFT_JISのブログにしてしまうことでしか抜本的な対応は難しそう。
【1】携帯のキャリアを判別して管理画面の切り替えをできるようにします
iMT.plの80行付近を下記のコードに丸ごと入れ替えます。ユーザーエージェントの判別の正規表現を見つけるのに手間取りました。
---
sub init_request {
my $plugin = shift;
my ($app) = @_;
$enabled = 0;
if ($app->isa('MT::App::CMS')) {
#携帯のキャリアを判別する
$agent = $ENV{'HTTP_USER_AGENT'};
#i-mode
if ($agent =~ /DoCoMo/){
$enabled = 1;
$app->mode('iphone_main')
if ($app->mode eq 'default') || ($app->mode eq 'dashboard');
$app->config('AltTemplatePath', $plugin->path . '/tmpl');
}
#EZweb
elsif ($agent =~ /UP.Browser/){
$enabled = 1;
$app->mode('iphone_main')
if ($app->mode eq 'default') || ($app->mode eq 'dashboard');
$app->config('AltTemplatePath', $plugin->path . '/tmpl');
}
#J-Sky
elsif ($agent =~ /J-PHONE/){
$enabled = 1;
$app->mode('iphone_main')
if ($app->mode eq 'default') || ($app->mode eq 'dashboard');
$app->config('AltTemplatePath', $plugin->path . '/tmpl');
}
#Vodafone
elsif ($agent =~ /Vodafone/){
$enabled = 1;
$app->mode('iphone_main')
if ($app->mode eq 'default') || ($app->mode eq 'dashboard');
$app->config('AltTemplatePath', $plugin->path . '/tmpl');
}
#SoftBank
elsif ($agent =~ /SoftBank/){
$enabled = 1;
$app->mode('iphone_main')
if ($app->mode eq 'default') || ($app->mode eq 'dashboard');
$app->config('AltTemplatePath', $plugin->path . '/tmpl');
}
#iphone
elsif (my $ua = $ENV{HTTP_USER_AGENT}) {
if (( $ua =~ m!AppleWebKit/! ) && ( $ua =~ m!Mobile/! )) {
}
}
#ユーザーエージェントが上記外の場合はPCサイトを表示
else {
}
}
}
---
【2】テンプレートをiphone用から携帯で表示可能な形式に書き換えます
改善の余地はものすごいありますが、3時間程度で構築したので甘く見てください。
文字コードの部分はUTF-8のMT用なのでブログにあわせてください。
テンプレートがShift_JISのため、UTF-8で出力するようにしている場合はテンプレートファイルの中で日本語を使うと文字化けします。文字コード変換プラグインを導入して、日本語の部分の前後を挟んでやって、SHIFT_JISをUTF-8に変換しています。
■login.tmpl
---
<TMPL_INCLUDE NAME="header.tmpl">
<MTEncodeText from="Shift_JIS" to="utf-8">
<h1>ブログ管理画面</h1>
<TMPL_IF NAME=ERROR>
<p><TMPL_VAR NAME=ERROR ESCAPE=HTML></p>
</TMPL_IF>
<form name="login_form" method="post" action="<TMPL_VAR NAME=SCRIPT_URL>">
<p>
<label for="username">ユーザー名</label>
<input id="username" name="username" size="14" />
</p>
<p>
<label for="password">パスワード</label>
<input id="password" name="password" type="password" size="14" />
</p>
<input type="submit" value="サインイン" class="button" />
</form>
</MTEncodeText>
<TMPL_INCLUDE NAME="footer.tmpl">
---
■main.tmpl
---
<TMPL_INCLUDE NAME="header.tmpl">
<TMPL_IF NAME=USER_HAS_WEBLOG>
<TMPL_IF NAME=BLOGS>
<TMPL_LOOP NAME=BLOGS><h1><TMPL_VAR NAME=BLOG_NAME ESCAPE=HTML></h1>
<ol type="1">
<li>
<a href="<TMPL_VAR NAME=SCRIPT_URL>?__mode=edit_entry&blog_id=<TMPL_VAR NAME=BLOG_ID>"><MT_TRANS phrase="New Entry"></a>
</li>
<li class="menu-item">
<a href="<TMPL_VAR NAME=SCRIPT_URL>?__mode=list_comments&blog_id=<TMPL_VAR NAME=BLOG_ID>"><MT_TRANS phrase="Manage Comments"></a>
</li>
<li class="menu-item">
<a href="<TMPL_VAR NAME=SCRIPT_URL>?__mode=list_entries&blog_id=<TMPL_VAR NAME=BLOG_ID>"><MT_TRANS phrase="Manage Entries"></a>
</li>
</ol>
</TMPL_LOOP>
</TMPL_IF>
</TMPL_IF>
<hr>
<TMPL_INCLUDE NAME="footer.tmpl">
---
■header.tmpl
---
<html lang="ja">
<head>
<MTEncodeText from="Shift_JIS" to="utf-8"><title>管理画面</title></MTEncodeText></head>
<body>
---
■footer.tmpl
---
<TMPL_IF NAME=USER_ID>
<p><a href="<TMPL_VAR NAME=SCRIPT_BASE_URL>?__mode=logout"><MTEncodeText from="Shift_JIS" to="utf-8">ログアウト</MTEncodeText></a></p>
</TMPL_IF>
</body>
</html>
---
とりあえずこれだけで管理画面のダッシュボードには入れると思います。
後は他のテンプレートファイルにも同じように応用すれば携帯投稿ができるはずです
まだ写真を添付できるようになっていないとメール投稿に及んでいないので、
添付するフィールドを追加する方法を考えて実装してみます。
ちゃんと綺麗に作り終わったら、やり方をまとめます。
何とか実現できているのも、いろんなプラグインがあるおかげですね。
携帯から投稿しています。
ではでは、FLASHを使ったXMLフォトギャラリーの導入方法について。
MTで画像ファイルのXMLファイルを出力して、Flashに読み込ませます。
まずはFlashの素材ファイルをダウンロードします
ダウンロードボタンが2つありますが、デザインが違うので両方見てみるといいでしょう。
下の方は再生用のHTMLが付いているので、そちらをおすすめします。
The Flash XML Gallery - Free Download
次にMTのブログ公開パスに解凍したファイルをアップロードします
HTMLファイル(gallery.htm)にアクセスしてみて再生されるか確認します。
---
では、MTの管理画面に移りまして、XMLを出力するインデックスアーカイブを作成します
---
<gallery title="Image Gallery" thumbDir="" imageDir="" random="False">
<MTAssets type="image">
<category name="<MTAssetTags><$MTTagName$></MTAssetTags>">
<image>
<date><$MTAssetDateAdded language="en" format="%d.%b.%Y"$></date>
<title><$MTAssetLabel$></title>
<desc><$MTAssetProperty property="description"$></desc>
<thumb><$MTAssetThumbnailURL width="200" $></thumb>
<img><$MTAssetURL$></img>
</image>
</category>
</MTAssets>
</gallery>
---
category nameの部分をいじるとカテゴリが設定できます。titleはタイトル。descは説明。imgとthumbにファイル名を指定しています。ディレクトリの設定は絶対パスのURLを指定できるように空欄にしています
サムネイル画像の横幅は200pxでした。
※カテゴリを使いたい場合、MTAssetsを「指定したTagの画像を出力する」ように設定。Tag=カテゴリと考えて、テンプレートを作成するとよいでしょう
<カスタマイズの参考に>
http://www.movabletype.jp/documentation/appendices/tags/assets.html
http://www.movabletype.jp/cgi-bin/mt4/mt-search.cgi?tag=asset&blog_id=3
---
■最初の画面ですべての画像を表示するXMLテンプレート
---
<gallery title="Image Gallery" thumbDir="" imageDir="" random="False">
<MTAssets type="image">
<category name="<MTAssetTags><$MTTagName$></MTAssetTags>">
<image>
<date><$MTAssetDateAdded language="en" format="%d.%b.%Y"$></date>
<title><$MTAssetLabel$></title>
<desc><$MTAssetProperty property="description"$></desc>
<thumb><$MTAssetThumbnailURL width="200" $></thumb>
<img><$MTAssetURL$></img>
</image>
</category>
</MTAssets>
</gallery>
---
この方が一覧で写真を表示できるのでいいかも
---
・保存するファイル名は「gallery.xml」としてください
Flashのswfファイル(実行ファイル)が読み込んでいるファイル名が同じディレクトリに存在している「gallery.xml」なので、面倒を避けるためにデフォルトの名前にしてしまいましょう。
・UploadDirプラグインを使って、画像のアップロード 先を統一しましょう
画像のアップロード先は常に統一がオススメ。トップディレクトリに画像が散乱しているのはよくありません。例えばいつも「/images」にアップするようにしておけばラクチンです。
---
次にウェブページかインデックスアーカイブにギャラリー用のページを作成します。ファイル名は自由に付けてかまいません。Flashのswfファイルを再生するスクリプトを入れます。
■Flash再生用のスクリプト
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="810" height="720" id="test" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="gallery.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#d0d0cc" /><embed src="gallery.swf" quality="high" bgcolor="#d0d0cc" width="810" height="720" name="gallery" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
※サイズも変更できますが、小さくすると文字も小さくなって読めなかったりします。
アクセスしてみて再生されたら成功です。出力するXMLのフォーマットを変えれば、他のFlashフォトギャラリーにも対応します。このやり方を応用して各種XMLを出力すれば、FlashのみならずPHPやCGIへ渡すデータとして使ってみることができます。
◆Flash XML
http://www.dezinerfolio.com/2007/05/21/the-flash-xml-gallery-free-download/
XMLを読み込んで、写真集として表示するフリーのFlash素材。
MTを使う場合、インデックスアーカイブで画像のアイテムをXMLのリストとして出力するようにして、Flashで読み込めばMTの機能として取り込めるはず。もちろん、ウェブページの作成でFlashの再生部分を入れたページを作れば、写真集ができるはず。
こちらもXMLをそのFLASHにあわせて出力してやれば使えると思います。こうしたギャラリー系のFlashは結構たくさん配布されているので、MTとの連携に使ってみてはいかがでしょうか。
[N] 「Yahoo! Pipes」の超簡単な使い方 を実験してみました。デリシャスを翻訳するパイプ
Yahoo!Pipesでは、作った仕組みをjavascriptでサイトに貼り付けることができます。指定したサイズにもできるので、コンテンツの充足に使えることでしょう。 しかし。。。どの機能が何なのかがいまいちわかりにくい 使い道は無数っぽいですが、使い道を考えるために必要な情報を集めるのが大変ですね後、アルファサードの社長さんから携帯用の管理画面テンプレートが3時間くらいでできたという話もあって、それ公開してくれないかなーと思った。MTはモバイル対応が弱いし。技術がオープンになればなるほど、便利になるからMT使う人は増えるだろうし。でも商売やし。
まあ、iMTを参考にして作るのは誰にでもできそうなので、いずれ標準化すると予想。
参考:http://www.zelazny.mydns.jp/archives/001030.php
<想像する手順>
・判別するユーザーエージェントを携帯にする
・iMT用のテンプレートのjava周りが携帯じゃ動かないので、
携帯で動く程度のHTMLに劣化改造(デチューン)する
・神に祈る → モニターにらめっこ → 「治す」
・仕組みがわかったらオリジナルのものを作りなおす(笑)
4/5に開催されたMT4LP5に参加してきました
自分はすべてB面を受けてきたので、A面の方はどうだったのかはわかりません
では、個人的な感想を。今回のセミナーで特に希少度の高いものは「管理画面のカスタマイズ」でした。今までさすがに自分でMTの管理画面を変えてしまおうという人は少なかったと思います。今まで、どこを変更すればできるのかという情報がなかったのでとても参考になったのではないでしょうか
内容を知りたい方は、今回のイベントに併せて出版されたMovabletypeプロフェッショナルスタイルを買ってくださいな
なんか大変だったみたいなんで(笑)
私は「他の人が真似できないこと」をできる人は素晴らしいと思います
ですが、「誰にもできないことを誰にでもできるようにする」ことができる人は、さらに素晴らしいと考えています
MP4TP5のようなセミナーはMovabletypeの他に真似できない技術持った人達が他の人が真似できるように教えてくれる良いものでしたので、今後も続くことを期待しています
http://cssnite.jp/archives/post_974.php
得られたTIPSの活用はまた後日。
普通にPHP化した場合、プラグインが動かなくなったりして最悪
だったりしますが、「PerlDynamic」というプラグインを使うことで、他のプラグインの使用の制限を受けずにユーザーがページにアクセスするたびに再構築されるようにできます。制作側としては再構築しなくても更新ができてしまうので、更新に必要な時間が大幅に縮小されるでしょう。また、「ファイルへのリンク」機能を使って、Dreamweaver上での更新とテンプレートの更新を連動させることで、「DreamweaverからFTPにアップロード」→「