Nikon | NIKON CONNECT!のブログパーツです。

トレンドつながり系プロモ。光のFlashがちょっと心地良いです。

沖縄産のミニパインの木をもらってから育ててます。このパイナップルは丸4年目くらい。未だに実がならず。。

星の王子様のバオバブの木です。バオバブの種から育てて丸3年目くらい。

最近、オープンソースの写真(画像)管理システムを探していてローカルで動かした中でようやくいいのがあったのでインストールして使ってみています。

Phormerというオープンソースなのですが、phpとajaxを使った写真管理WEBシステムでmysqlなどのデータベースは使用しておらず非常に軽くて、RSSも標準装備でデザインも弄りやすいです。インストールも簡単です。オープンソースの写真管理システムをお探しならぜひ。

インストールしたバージョン（ver）はPhormer 3.31です。

Phormer 3.31のインストール手順

こちらからダウンロード。

ドキュメントルートを707にして、手動でdata、images、temp、の３つのフォルダを作成し707にindex.xmlを606にします。その後、ブラウザでアクセス。

ダウンロード後、解凍ファイルをサーバーにアップした後は以下のような流れです。

1.ドキュメントルート（アップロードした場所）のパーミッションを707に変更。

2.手動で「data」「images」「temp」の三つのフォルダを作成。

3.「data」「images」「temp」の三つのフォルダのパーミッションを707に変更。

4.index.xmlのパーミッションを606に変更。

5.ブラウザからアクセスしてインストール。

ソースは以下のような構成です。

FILES ARCHITECTURE:
===================
  /{Installation Directory}
   |
   +- data/ 			# Keeps a set of .xml files like a database
   |   |
   |   +- adminPass.php		#    MD5-ed version of Administration Password
   |   +- basis.xml		#    Basic configurations like theme
   |   +- basis.xml.bku		#    A backup of last saved basis.xml
   |   +- ...
   |   +- p_00000i.xml		#    Data of Photo #i
   |
   +- files/			# Phormer's own files, like css
   |   |
   |   +- adminfiles/		#    Administration area's files
   |   |   |			
   |   |   +- addphoto.js	#        Javascript of adding photos
   |   |   +- admin.css		#        CSS of admin.php
   |   |   +- photos.xml.def	#        Default XML file of data/photos.xml
   |   |   +- ...
   |   |   +- help.js		#        Help messages
   |   |   +- skeleton.js	#        Thumbnail skeleton picker js
   |   |
   |   +- cssfiles/		#    Images of different themes
   |   |   |
   |   |   +- black_hbg0.jpg
   |   |   +- ...
   |   |
   |   +- externalcss/		#    Additional External CSS Files
   |   |
   |   +- phorm.js		#    JavaScript file of index.php
   |
   +- images/
   |   |
   |   +- 00000i_j.jpg		#    j-th thumbnail of photo #i
   |   +- ...
   |
   +- temp/			# Temporary/Draft photos/files which ain't public
   |
   +- admin.php			# Administration area 
   |
   +- css.php			# CSS file of index.php, generates upon theme
   |
   +- funcs.php			# Functions of admin.php and index.php
   |
   +- index.php			# Viewable file for public
   |
   +- index.xml			# RSS feed file, auto-generated
   |
   +- readme.txt		# This file!
   |
   +- upload.php		# PHP files of uploading photos (AJAX)
   |
   +- wv.php			# Word Verification PHP

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

いつか行った阿佐ヶ谷のワインバーです。昼間はイタリアン＆ドックカフェと化していたような。店の名前は覚えてないな。

検索エンジンへのseo対策ということもあってMovableTypeのtitleタグ、metaタグ｢description｣｢keywords｣をページごとに最適になるよう動的化してみました。

metaタグ｢keywords｣ - MovableType4

メタキーワードの最適化には、 meta要素のkeywordを、変数を用いて分岐処理・最適化 のサイトを参考にしています。

MovableTypeのヘッダーは、全てのMovableTypeのテンプレートから同じようにインクルードされていますが、エントリテンプレートの場合のみキーワードにエントリに与えられたキーワード・タグを追加するように記述しています。

MovableType4のテンプレートのヘッダーに以下を追加してます。

↓

<MTSetVar name="GetKeywords" value="Movable Type,MT4,MT4.1,MT,解説,ブログ">
<MTIf name="entry_template">
<MTIfNonZero tag="MTEntryKeywords">
<MTSetVarBlock name="AddEntryKeyWord">,<MTEntryKeywords></MTEntryKeywords>
<$MTSetVar name="GetKeywords" value="$AddEntryKeyWord" append="1">
</MTSetVarBlock>
<MTEntryIfTagged>
<MTSetVarBlock name="AddEntryTags">,<MTEntryTags glue=","><$MTTagName$></MTEntryTags></MTSetVarBlock>
<$MTSetVar name="GetKeywords" value="$AddEntryTags" append="1">
</MTEntryIfTagged>
</MTIfNonZero>
<meta name="keywords" content="webデザイン,webサービス,cms,seo,アフィリエイト,<$MTGetVar name=" getkeywords="" $="">" />
</MTIf>
<meta name="keywords" content="webデザイン,webサービス,cms,seo,アフィリエイト,<$MTGetVar name=" getkeywords="" $="">" />

metaタグ｢description｣ - MovableType4

metaタグのdescription最適化には、 中小企業診断士ブログのサイトを参考にしています。

MovableType4インクルードモジュールの「ヘッダ」のメタディスクリプションをMTifで並べて組み換えます。

MovableType4のテンプレートのヘッダーに以下を追加してます。

↓

<MTIf name="entry_template">
<meta name="description" content="<$MTGetVar
name=" page_title="" $=""><itle><$MTGetVar name="page_title"$> - <$MTBlogName encode_html="1"$>webデザイン、webサービス、検索エンジン対策、アクセス解析、CMS、SEO、ユーザー視点デザイン、キーワード広告、アフィリエイト、クチコミなどのマーケティング手法を実践しています。：entry_template" />

<MTElse>
<MTIf name="main_index">
<meta name="description" content="webデザイン、webサービス、検索エンジン対策、アクセス解析、CMS、SEO、ユーザー視点デザイン、キーワード広告、アフィリエイト、クチコミなどのマーケティング手法を実践しています。：main_index"><title><$MTBlogName encode_html="1"$>

<MTElse>
<meta name="description" content="<$MTGetVar
name=" page_title="" $=""><title><$MTGetVar name="page_title"$> - <$MTBlogName encode_html="1"$>webデザイン、webサービス、検索エンジン対策、アクセス解析、CMS、SEO、ユーザー視点デザイン、キーワード広告、アフィリエイト、クチコミなどのマーケティング手法を実践しています。：entry_main_other" />

</MTElse>
</MTIf>
</MTElse></MTIf>

これで、MTのメインページ、カテゴリページ、エントリーページがそれぞれ、タイトルとメタディスクリプションがセットで最適に更新されるようになった。

◆MovableType4のオススメ本5冊

Movable Type 4 新しいWebサイトの黄金則-MTで実現するCMSサイト構築のすべて- 仲座 恵美 宮永 邦彦 芝 陽一郎 ソフトバンククリエイティブ 2008-04-05 売り上げランキング : 4998 Amazonで詳しく見る

Webプロフェッショナルのための黄金則 Movable Typeテンプレートタグ虎の巻 Movable Type 4.x対応 (Web Designing BOOKS―Webプロフェッショナルのための黄金則) エ・ビスコム・テック・ラボ 毎日コミュニケーションズ 2008-03-15 売り上げランキング : 42620 Amazonで詳しく見る

Movable Typeで作る絶妙なブログサイト―4.1対応 蒲生 睦男 シーアンドアール研究所 2008-03 売り上げランキング : 8856 Amazonで詳しく見る

Movable Typeで今日から始めるカスタムブログ―4.0完全対応 岡田 庄司 秀和システム 2007-10 売り上げランキング : 13508 Amazonで詳しく見る

基本からしっかりわかる Movable Type 4.1 カスタマイズブック Movable Type 4.1/MTOS 4.1対応 大藤 幹 毎日コミュニケーションズ 2008-05-21 売り上げランキング : 42574 Amazonで詳しく見る

アマゾン・アソシエイトのチェック用モバイル版です。

モバイル用個別商品リンク - Amazonアソシエイト モバイル用リンク作成

テキストまたは商品画像を使用し、 Amazon.co.jp のカタログにある特定の商品へリンクします。おすすめ商品を直接ビジターに紹介できます。

テキスト

商品イメージ　小 (jpg)

商品イメージ　中 (jpg)

商品イメージ　大 (jpg)

モバイル用テキストリンク - Amazonアソシエイト モバイル用リンク作成

Amazonモバイルのカテゴリーページ、サーチ結果へのリンクを作成できます。

お気に入りリンク

検索結果へのリンク

モバイル用バナーリンク - Amazonアソシエイト モバイル用リンク作成

特定の商品カテゴリーのグラフィックバナーを使用するリンクです。

バナーリンク Amazon.co.jpロゴ116x32 (4) (gif)

別途画像をサーバーにアップする必要あり。画像の種類とサイズは豊富。

192x53 (1)

192x53 (2)

192x53 (3)

192x53 (4)

116x32 (1)

116x32 (2)

116x32 (3)

116x32 (4)

94x26 (1)

94x26 (2)

94x26 (3)

94x26 (4)

モバイル用サーチボックスリンク - Amazonアソシエイト モバイル用リンク作成

Amazonモバイルのサーチボックスをそのまま設置できます。

キーワード検索ボックスのみ

キーワード:

カテゴリプルダウン付きキーワード検索ボックス

キーワード: 全商品 本洋書エレクトロニクスホーム＆キッチンミュージックDVDビデオソフトウェアゲームおもちゃ＆ホビースポーツヘルス＆ビューティー時計ベビー＆マタニティアパレル＆シューズ

各カテゴリのベストセラーへ遷移するプルダウン

選択する:
本洋書エレクトロニクスホーム＆キッチンミュージックDVDビデオソフトウェアゲームおもちゃ＆ホビースポーツヘルス＆ビューティー時計ベビー＆マタニティアパレル＆シューズ
トップ100 ニューリリース

検索ボックスではないが使い勝手はいい。アマゾンアソシエイトのモバイルサイトで一番使いやすそう。

表示が重いこと間違いなしですが、アマゾン・アソシエイトの流入テストチェック用にデザインを一通り見たかったので自分用に一式貼り付けました。

アマゾン・アソシエイトのサイトで発行できるリンク/ウィジェットの一覧です。

モバイル用とwebサービス系のアマゾン・アソシエイトはまたまとめる予定。

くるくるウィジェット(TM) - Amazonアソシエイト

使いどころがわからんが、安っぽさはなくいいかも。

スライドショーウィジェット - Amazonアソシエイト

アマゾンのサイトで標準で発行できる中では一番使ってもいいと思わせる。

プロダクトクラウドウィジェット - Amazonアソシエイト

自サイトのタグと思わせてアフィリエイトとか。。。使わないな。

お気に入りウィジェット - Amazonアソシエイト

広告っぽいのは好みじゃないけどこの見せ方で有効な場面はあるのか。。。結局サイトとあってればいいんだろうけど。

ウィッシュリストウィジェット - Amazonアソシエイト

クイックリンク ウィジェット - Amazonアソシエイト

動的な場面で有効に使えそう。

サーチ ウィジェット - Amazonアソシエイト

インスタントストア ウィジェット - Amazonアソシエイト

流行のサイズですね。使えそう。

個別商品リンク - Amazonアソシエイト

商品プレビュー - Amazonアソシエイト

bodyの終了タグの前に挿入すれば使えるようです。見せ方はお気に入りウィジェットの横バナーみたいな感じ。

テキストリンク - Amazonアソシエイト

基本のテキストリンク。

おまかせリンク（R) ベータ版 - Amazonアソシエイト

イージーリンク - Amazonアソシエイト

サーチボックス（標準） - Amazonアソシエイト

Amazonライブリンク - Amazonアソシエイト

mt4i 3.0.4 をインストールしてMovableTypeをモバイル化してみました。

MT4iは、MovableTypeのデータベースからデータを読み込み、文字コードを Shift_JIS に変換、携帯電話向けにレイアウトして出力し、ケータイ電話に対応させる為のPerl スクリプトです。

MT4iをインストールした当ブログのモバイルサイト

MT4iをインストールして携帯サイト対応した当ブログのモバイルサイトです。

↓

ププアモバイル

MovableType4のデータをそのまま取ってくるので、コンテンツの作り方は携帯サイト用に気にする必要もありそうですがこのままインストールして使用しても十分使えそうです。

これからテンプレートとかモバイルのseoまわりとか少しずつ触ってみたいと思います。

mt4i 3.0.4 注意事項インストール前の注意事項

• MT4iは文字コード EUC-JP（*.cgi, *.pl）及び Shift_JIS（*.tmpl）、改行コードLFで書かれています。
• Encode と HTML::Template が必須です。（リンクは現時点での最新のバージョン。インストールされる時点での最新のもので問題ないかと。）

mt4i 3.0.4 インストール準備アップロード前の準備

1. ダウンロードした「mt4i3x.zip」または「mt4i3x.tgz」を解凍してください。
2. mt4iを解凍してできるファイルは以下の通りです。

   mt4i.cgi    ----- MT4i本体。
   mt4imgr.cgi ----- MT4i Manager。MT4i設定プログラム。
   purge_old_cache.pl ----- 古いキャッシュをクリアする為のスクリプト
   lib
    ∟mt4i
    　∟Ad.pl     ----- バナーエクスチェンジ。
    　∟Cache.pl  ----- キャッシュ読み書き。
    　∟Config.pl ----- 設定ファイル読み込み。
    　∟Log.pl    ----- ログ読み書き。
    　∟Func.pl   ----- その他外部関数。
   plugins
    ∟mt4i-purge-cache.pl ----- キャッシュをクリアする為のプラグイン
   tmpl
    ∟mt4i
    　∟blog_list.tmpl
    　∟comment.tmpl         ----- コメント一覧テンプレート
    　∟comment_form.tmpl    ----- コメント投稿フォーム
    　∟error.tmpl           ----- エラーページ
    　∟footer.tmpl          ----- フッター
    　∟header.tmpl          ----- ヘッダー
    　∟image.tmpl           ----- 画像表示ページ
    　∟index.tmpl           ----- インデックステンプレート
    　∟individual.tmpl      ----- 個別記事ページテンプレート
    　∟post_comment.tmpl    ----- コメント投稿フォームテンプレート
    　∟recent_comments.tmpl ----- 最近のコメントページ
    　∟redirector.tmpl      ----- リダイレクトページ
    　∟trackback.tmpl       ----- トラックバック一覧テンプレート

3. 「mt4i.cgi」及び「mt4imgr.cgi」をエディタで開き、一行目のPerlパスをインストールする環境に合わせて編集、保存して下さい。配布時は以下のようになっています。

   #!/usr/bin/perl

   さくらインターネット、ロリポップでは、このままで変更の必要はありません。環境によっては以下の場合もあります。

   #!/usr/local/bin/perl

   良く分からない場合は、サーバの管理者に問合せてください。

mt4i 3.0.4 インストールインストール手順

1. mt4iはテンプレートのキャッシュを溜め込む為のディレクトリが必要です。MTホームディレクトリの直下に、以下の構成でディレクトリを作成して下さい。

   MTホームディレクトリ
    ∟mt4i
    　∟cache
    　∟tmpl
   

2. ファイル「mt4i.cgi」「mt4imgr.cgi」、ディレクトリ（フォルダ）「mt4ilib」、「tmpl」をサーバーにアップロード（すべて同階層に置くこと）。
3. 「mt4i.cgi」と「mt4imgr.cgi」のパーミッションを「705」あるいはプロバイダ等で指定されているCGIプログラムを動かす際のパーミッション値に変更。
4. Webブラウザより「mt4imgr.cgi」にアクセス。
5. 「まず最初に、MT4i Manager にログインする為のパスワードを設定してください。」と表示されるので、希望のパスワードを入力して「保存」ボタンを押下。
6. 「MT4i Manager のパスワードを設定しました。」と表示されるので、「戻る」ボタンを押下。
7. パスワードを入力してログイン。
8. 「メニュー」の「設定を編集する。」にチェックをして、「ENTER」ボタンを押下。
9. 設定を編集して保存。設定値にはすべてデフォルト値が用意されているので、MovableTypeと同階層（mt.cgiのある場所）にインストールする場合は、何もしないで保存してもOK。ただし管理者モードを使用する場合は、「AdminPassword? - 「管理者向けURL取得」の為のパスワード」の変更が必須となるので注意。
10. PCのWebブラウザより「mt4i.cgi」にアクセスして動作確認。

※2.0β6 以上からのアップグレードやFAQは こちらのMT4i本サイトをご確認ください。

mt4i 3.0.4 モバイルのGoogleAdsense（アドセンス）モバイル向けGoogleAdsense（アドセンス）の設置方法

• モバイル向け GoogleAdsense（グーグルアドセンス）のコードを取得。
  • GoogleAdsense（アドセンス）の文字エンコードには「日本語（Shift_JIS）」、サーバー サイドのスクリプト言語には「CGI/Perl」を選択すること。
  • マークアップも本当なら「chtml」なのだけれど、配色なんかとの兼ね合いがあるので各自調整要。
  ul> /li>
  • GoogleAdsense（アドセンス）の取得したコードを、ディレクトリ「lib/mt4i」以下に「Adsense.pl」というファイル名で保存。ソースコードの変更は一切しないこと。

    lib
     ∟mt4i
       ∟Adsense.pl
    

  • テンプレートの任意の場所に、下記のタグを挿入。

    <TMPL_VAR NAME="ADSENSE">