SNS構築・SNSカスタマイズ

OpnePNEにはCMD（小窓）という便利な機能があり、小窓が用意されているサイトであれば、そのURLを日記等に記載するだけで、自動的に画像やサービス、動画が埋め込まれたりする。（Google Map、YouTube、Amazon、kakaku.com、等々）

最近ではオンラインサービスであるflickrを利用している人も増えているので、flickr用に小窓（cmd）を使いたいという案件や、作りたい場面があるはず。
小窓の作成は一定のルールさえ分かっていれば、簡単に小窓を作ることが出来る。

flickrの画像URLには、登録者や状況により
http://farm1.static.flickr.com
http://farm2.static.flickr.com
http://farm3.static.flickr.com
http://farm4.static.flickr.com
と４種類で始まっている

flickr用の小窓を作る場合の問題点は、OpnePNEのCMD（小窓）がサブドメインのワイルドカードに対応していないこと。
つまり作成するJavascriptは、それぞれ決め打ちのファイル名であることが必要条件となる。

つまり、上記４つのサブドメインに対応するCMD（小窓）を用意したければ、４つのJavascriptをcmdフォルダに入れておく必要がある。

farm1.static.flickr.com.js
farm2.static.flickr.com.js
farm3.static.flickr.com.js
farm4.static.flickr.com.js

一見無駄なようだが、ワイドルカードで探させるよりサーバー負荷を考えると効率的でもある。

それぞれのサーバー（farm1、farm2、farm3、farm4）用にスクリプトを書いてもいいが、
今後サブドメインが追加された際に、ファイル名だけ変えてコピーできるようにスクリプトを作っておくと便利。

そのまま使えるサンプルスクリプトはこれ

---------------------------------------------------------------------

function url2cmd(url){
   var static_flickr_com = url.match(/^http:?/?/farm([0-9]+)?.static?.flickr?.com?/([0-9]+)?/([a-z0-9_]+)?.(jpg|jpeg|png|gif)/);
   if(static_flickr_com){
      var pid1 = RegExp.$1;
      var pid2 = RegExp.$2;
      var pid3 = RegExp.$3;
      var pid4 = RegExp.$4;
      main(pid1,pid2,pid3,pid4);
   }else{
      pne_url2a(url);
   }
}
function main(pid1,pid2,pid3,pid4){
   var html = '<img src="http://farm' + pid1 + '.static.flickr.com/' + pid2 + '/' + pid3 + '.' + pid4 + '">';
   document.write(html);
}

---------------------------------------------------------------------

念のため、画像ファイル名をjpg、jpeg、png、gifの４種類に限定しているが、flickr.comを信頼して簡略化しても構わない。

上記スクリプトを
farm1.static.flickr.com.js
farm2.static.flickr.com.js
farm3.static.flickr.com.js
farm4.static.flickr.com.js
の名前でそれぞれ作成し、cmdフォルダにアップする。

これでflickr.comに対応したCMD（小窓）となる。

OpenPNEでのSNS運用していて、日記等のフォームに新しい項目を追加したいこともあるだろう。
しかし、OpenPNEの場合、単純にテンプレートに追加するだけでは処理されない。
その場合は、以下のファイルを修正していくことで変更することが可能となる。

----------------------------------------------------------------------

まずは、表示のためのテンプレートファイル
フォームの希望する場所（テーブル処理されている部分）に

<tr>
<th>項目</th>
<td>内容</td>
</tr>

と追加する。

■変更ファイル
templates/
h_diary_add.tpl
h_diary_add_confirm.tpl

※項目内容をデータベースから取得する場合や、フォーム内に登録者毎のデータが必要な場合は、以下のPHPファイル内で取得する

----------------------------------------------------------------------

テンプレート用にデータ取得等の処理が必要であれば、以下のPHPファイル内で処理し
$this->set('hoge', $hoge);
といった形でtplに渡せばいい

■変更ファイル
page/
h_diary_add.php
h_diary_add_confirm.php

----------------------------------------------------------------------

項目内での変更や選択肢の追加等の場合は上記page内とtemplates内のファイルのみで良いが、新たに項目を追加しリクエスト変数が増えた場合は、validate内で定義してやる必要がある

■変更ファイル
validate/do
h_diary_add_insert_c_diary.ini

validate/page
h_diary_add.ini
h_diary_add_confirm.ini

上記ファイル内で、欲しいデータ形式に合わせ、新たなリクエスト変数を定義する

type
int→整数
string→文字列

----------------------------------------------------------------------

これでデータの項目表示、フォームデータの受け渡しが可能となる。
あとは、渡されたデータをデータベースに登録するロジックを追加すればいい。

OpenPNEをカスタマイズしている時、独自コンテンツの追加等で、参加しているユーザーの情報を取得したい場合がある。
そんな時、オリジナルの関数を作ってもいいが、

OpenPNE/webapp/lib/db/member.php

内にいろいろな関数が用意されているので、それを上手に使うといい。

前回、足あとツールからSNS（OpenPNE）を守る方法（その1）で足あとツールの目的を紹介したが、そういった無駄なアクセスを排除するためには、不自然アクセスを検出することが大切。

mixi等の大手SNSではログ解析の専用ツールを用意しているが、無料レンタルのSNSや、中小規模のSNSや個人で運営しているSNSでは、わざわざ解析ツールを用意するのは難しいだろう。

そこでOpenPNEの管理画面であらかじめ用意されている統計情報を取得するためのプログラムを利用する。

方法は簡単。個人で導入しているOpenPNEはもちろん、無料レンタルSNSの場合でも、現行バージョンに近ければ、同じ方法が使える可能性があるから試してもらいたい。

まずは、管理画面から「統計情報」を選択
「PC版ページ月次集計」を選択
『アクセスメンバー数』にある「今月最もアクセスをしたメンバーを表示する」を選択
これで
「PC版 2009年07月にアクセスしたメンバー」の情報が得られる

この段階で明らかに不自然なアクセス数があれば、そのユーザーをチェックすればいい。

なお、登録してすぐのユーザーはあちこち見てまわってアクセスしていることも多いから、日ごとのログを調べるのが確実。
上記の例「PC版 2009年07月にアクセスしたメンバー」を表示した時のURLを見ると、以下のようになっているはず。

http://xxxxxxxxxx.com/?m=admin&a=xxxxxxxxxx&ktai_flag=0&ymd=2009-07-01&month_flag=1&page_name=all&orderby2=-2

このURLに含まれる引数の中で「&month_flag=1」に注目して欲しい。
これは7月にアクセスしたメンバーであるが、「&month_flag=1」を「&month_flag=0」にすることで、「&ymd=」の日付のみのログデータを取得できる。


例：2009年7月17日

アクセス数多い順に並べる
〜&ktai_flag=0&ymd=2009-07-17&month_flag=0&page_name=all&orderby2=-2

アクセス数少ない順に並べる
〜&ktai_flag=0&ymd=2009-07-17&month_flag=0&page_name=all&orderby2=2

ID番号の大きい順に並べる
〜&ktai_flag=0&ymd=2009-07-17&month_flag=0&page_name=all&orderby1=-1

ID番号の小さい順に並べる
〜&ktai_flag=0&ymd=2009-07-17&month_flag=0&page_name=all&orderby1=1

上記のような引数に変えることで、希望日のユーザーアクセス数が取得できる。
この結果を参考にし、アクセス数が異常に多いユーザーについて調べるといい。


上記の表示が可能なように管理者ページのカスタマイズも有償で承ります。
お気軽に、デジタルゲートまでお問い合わせを。

アフィリエイト、MLM、アダルトサイト、アダルトSNS、出会い系サイト、動画サイト、販売サイトといった商業目的から、個人サイトや個人ブログの宣伝目的といった理由でSNSに参加する登録者は大量に存在する。

それらのユーザーは目的の告知やURL、キャッチコピー、セールストークを読ませる為に各SNSのマイページにアクセスさせることが必要であるため、様々な手段を用いてアクセスさせる。
例えば女性名で登録し、可愛いプロフィール写真やセクシーなプロフ画像と刺激的な日記を掲載し、最新日記や日記検索から誘導するといった方法。
この手法は男性を相手とする場合（ホストや男性のアダルト画像・動画のように女性向けもあるが）には有効だが、アフィリエイト、MLM、情報商材の販売には向かない。
そこで、mixiを始め、多くのSNSに機能として存在する足あと機能（足跡・あしあと）を利用する。

方法は簡単で、目的のユーザー（無差別であったり、特定の検索キーワードで絞ったユーザーであることもある）のページにアクセスして「あしあと」を残す。SNSユーザーの多くは、SNSにログインすると最新日記とあしあとリストをチェックする場合が多いので、自分に残された「あしあと」の名前をクリックして向こうから訪問してくれる。あとは、自己紹介やプロフィールに美味しい言葉を並べておくだけでいい。

この方法はお金もかからず相手も簡単に探せるが、唯一の問題は手間がかかること。
そこで巷には、「足あとツール」「足跡ツール」といったものが存在する。
販売サイト「寝ている間にどんどん稼げる」「mixiで毎月何百万儲ける」といった、まさに美味しい言葉が書いて、それ自体が商材でもある。
ご丁寧にアクセスして、メッセージを送ってくれるものも存在する。

次に、そういったツールを使った無駄なアクセスを排除するための方法を説明する。

OpenPNEでは、ページのデザインと，ロジックのコーディングを分離する目的で、SmartyというPHPプログラムのテンプレートエンジンを使用しています。
Smartyを使用していることにより、アプリケーションのロジックが分からない人でも、ある程度のHTMLの知識があれば、OpenPNEのレイアウトを変更（カスタマイズ）することができます。

具体例を示しながら、実際に進めていく手順を説明

レイアウトを修正したいページを表示させるURLが以下の場合
http://iphone-sns.com/?m=pc&a=page_fh_diary&target_c_diary_id=2

レイアウトテンプレートの場所は
（config.phpがあるディレクトリ名）/webapp/modules/pc/templates/
ディレクトリ内にある、
fh_diary.tpl
となる。
これに習えば、修正・レイアウト変更・カスタマイズしたいページの引数の文字を見れば、他のテンプレート名が分かる。

さて、一番簡単なのは、このテンプレートファイルをFTP等でダウンロードし、エディターで修正し、再びアップロードすれば良いのだが、修正に失敗したりした場合や、元に戻したい時に問題がある。

OpenPNEは、その点も良く考えられており、
・webapp
・webapp_ext
という二つのディレクトリが用意されている。

先ほどダウンロードしたテンプレートファイルはwebappにあったものだが、修正したテンプレートファイルをアップする場所を元の場所では無く、webapp_ext内にあるtemplatesの中にアップする。
OpenPNEは、webapp_extに同ディレクトリ同名のファイルが存在した場合、webapp_ext内にあるファイルの方が処理される。

このことにより、元のテンプレートファイルをそのままにして、レイアウトの修正・カスタマイズが可能となる。
修正に失敗したり、レイアウトが崩れてしまったりしたら、webapp_ext内のテンプレートファイルを削除してしまえば、デフォルトのテンプレートファイルを読み込み表示される。

なお、このwebapp_extの機能を使いたい場合は、config.phpを開き

///
// webapp_ext ディレクトリ使用設定
///

define('USE_EXT_DIR', false);
↓
define('USE_EXT_DIR', true);

falseをtrueにする。

これをしないと、webapp_extを使用しないので注意。

iPhoneオーナーのためのSNS『iPhoneStyle』はiPhoneユーザー専用のため、新規登録できるユーザーをi.softbank.jpのアドレスに限定していますが、登録はパソコン（PC）からも可能です。

登録や利用はすべて無料なので、iPhoneを買ったら、まず最初にiPhoneStyleに登録しましょう。

『iPhoneStyle』
http://iphone-sns.com/

下のリンクから直接登録ページを開くことができます。
iPhone SNSの新規登録はこちら

OpenPNEは今のところiPhoneからのアクセスには配慮されていないため、iPhoneでOpenPNEを使ったSNSを利用するのはとても不便です。

■iPhoneからからOpenPNEを利用した場合の問題点

1.OpenPNEへのログインページを含めページが縮小されていて見難い（拡大する必要がある）
2.携帯版のOpenPNEの利用しようとした場合、キャリア制限で携帯版ページは表示されない。
3.OpnePNEではiPhoneの固有メールアドレス@i.softbank.jpはOpenPNEにおいては携帯として登録できない。
4.日記に画像がアップできない。
5.プロフに画像がアップできない。
6.コミュニティに画像がアップできない。

他にも「不便」といった部分を含めると数多くあります。

そこで、OpenPNEを使ったSNSでiPhoneユーザーを考えた場合にいくつかの方法が考えられます。

■OpnePNEをiPhone対応にする方法

1.iPhone専用のSNSにする
2.PC版のレイアウトをiPhone対応にする
3.携帯版のレイアウトをiPhone対応にする

1.のiPhone専用のSNSにする場合はCSS（スタイルシート）のカスタマイズ、及びsmarty用tpl（テンプレートファイル）のカスタマイズをすることで快適なレイアウトにすることが可能となります。
デジタルゲートが運営する『iPhoneStyle』（http://iphone-sns.com/）はiPhoneオーナー専用SNSという特化したSNSであるためこの方法で構築しています。

2.OpenPNEのPC版のレイアウトをiPhone対応にする場合、ユーザーエージェントを取得して（Mozilla/5.0 (iPhone; U; CPU iPhone OS 2_0 like Mac OS X; ja-jp) AppleWebKit/525.18.1 (KHTML, like Gecko) Version/3.1.1 Mobile/5A345 Safari/525.20）といった文字列からiPhoneであることを識別し、専用のCSSで表示させます。
この場合、PCと共存させるためtpl（テンプレートファイル）のカスタマイズはしない方が楽です。
この方法は携帯ユーザーは何も変わらないため、導入しやすい方法とも言えます。

3.PC版は標準のままOpenPNEの携帯版をiPhone対応にする
この方法は一般携帯からのユーザーが不便になるだけでなく、構築方法によっては通常のPCユーザーからのメールによる日記投稿が不可能に場合があるため、デメリットの方が多いと思われます。

さて、表示（閲覧）には上記方法で対応できますが、「1.iPhone専用のSNSにする」および「2.OpenPNEのPC版のレイアウトをiPhone対応にする」どちらにも共通する問題としてiPhoneからフォームを使った画像のアップロードはできないということがあります。
これは現行のiPhoneの仕様としてローカルファイルへのアクセスが出来ないこと、フォームの利用を制限していることなので、iPhoneの仕様が変わるまで解決しません。
また、同じく仕様により、iPhoneではPCのメールソフトや携帯のメーラーでは普通に存在する「画像の貼付」が存在しません。
そのため唯一の方法として「写真」アプリから画像付きのメールを作成できることを利用してOpenPNEにiPhoneから画像付きの日記を投稿すること、プロフィール用画像をiPhoneから設定する方法が考えられます。
ただし、OpenPNE標準ではメールでの画像アップは「携帯」と決まっているので、別途のスクリプト（プログラム）を用意する必要があります。
プログラムに必要なのはユーザー情報の取得からユーザー認証、日記のデータベースへの書き込み
処理となります。現行のiPhoneではコピー＆ペーストができないため、送信アドレスにも配慮する必要があります。『iPhoneStyle』（http://iphone-sns.com/）では、iPhoneからメールで画像をアップする専用のプログラムを組み込み、iPhone本体から直接メールでの日記の投稿、iPhone本体から直接メールでのプロフ画像の設定・変更を可能としています。

以上、いずれiPhoneユーザーが増え市場のニーズが高まればOpenPNEもiPhone対応していく可能性がありますが、それまでは運営側の工夫が不可欠です。

OpenPNEの管理画面の、SNS設定で
cmdタグ使用設定を「使用する」にしているにも関わらずCMD設定に何も表示されないときは、

config.phpファイルの設定で、以下の部分が間違っていることが多い。

208行目

define('OPENPNE_PUBLIC_HTML_DIR' OPENPNE_DIR . '/public_html');

のpublic_htmlを公開ページのディレクトリに変更

define('OPENPNE_PUBLIC_HTML_DIR' '/home/hoge/www/sns');

OPENPNE_DIR . の部分を削除

「/home/hoge/www/sns」の部分は相対パスでは無く絶対パス

OpenPNEで使われているSmartyは、通常HTMLタグが無効になるようにエスケープされる。
文字データを取得し表示する場合等はこのままで構わないが、アフィリエイト用タグやGoogleアドセンス、Google Analytics、RSSデータ等、タグをエスケープして欲しくない場合もある。
そんな場合は以下のようにnodefaultsを使うことでHTMLタグを有効にすることができる。

■SmartyでHTMLタグを有効にするサンプル

({$hoge:nodefaults})

※通常のSmartyでは、{$hoge}が置き換わるようになっているが、OpenPNEの場合、({$hoge})と表記する。

有効にしたい部分にnodefaultsを使うだけで、読み込むデータがそのまま表示されるようになる。

iPhoneを使っている人たちのSNS(ソーシャルネットワークサービス)『iPhoneStyle』を2月1日オープンしました。

ベースになっているのはOpnePNE。
ログインページを含め、iPhoneに合わせたCSSに変更することでiPhoneでの縦横での利用を可能としました。
現在は最小限のカスタマイズですが、徐々にデザイン及び機能の追加カスタマイズをしていく予定です。


なお、本SNSの性質上、登録及び招待可能なアドレスはiPhoneユーザーのみに与えられられる、「@i.softbank.jp」のアドレスが必要です。

iPhone SNS 『iPhone Style』
http://iphone-sns.com/

会員数1,000万人を越すmixiを代表とするSNSを、ネットワークに活用してみませんか？
オープンソースで作られたOpenpneによる、SNSの構築なら、開発費用を抑えることが可能です。

インストールから、各種デザインカスタマイズまで、ご希望に合わせて承ります。
また、社内snsや携帯snsを視野に入れたsns導入・sns構築も承りますので、お気軽にお問合せ下さい。