タグ: Ktai Style

  • WordPressの携帯電話プラグインをがっつりカスタマイズしてKtai Styleに移行

    ※この記事は5年以上前に書かれたため、情報が古い可能性があります

    WordPressの携帯電話プラグインについては以前にも書きましたが。

    WordPressのモバイルプラグイン再考 – カイ士伝
    https://bloggingfrom.tv/wp/2008/06/04/192

    WordPressの携帯電話プラグインにはMobile Eye+とKtai Styleがあり、前者はもう開発が止まっているものの外部リンクのGoogle変換や外部画像読み込みが便利。対する後者は絶え間ない更新が続いており、絵文字も豊富で対応機種も幅広いのですが、Mobile Eye+で挙げた特徴は備えていない。なので今はMobile Eye+にパッチを当てて運用していたわけです。

    Mobile Eye+ パッチ導入 – カイ士伝
    https://bloggingfrom.tv/wp/2008/08/15/344

    しかしやんごとなき事情からKtai Styleのある機能が必要になりまして、ちょちょいとヤホーじゃなかったゴーゴルで調べていたらこんなページを発見。

    Ktai Style よくある質問と答え
    http://wppluginsj.sourceforge.jp/ktai_style/qa/

    おお、これ見たら自分がMobile Eye+に求めていたことが全部Ktai Styleでできるじゃないか!

    ということで夜中にいきり立ってしまい一通りカスタマイズしてしまいました。

    外部画像表示

    まずは外部サイトの画像表示。サンプルはAmazonです。以下は該当部分の引用。

    Amazon の画像をそのまま表示したい

    デフォルトでは、外部サイトの画像はリンクに変換されるため、Amazon アフィリエイトの画像もリンクになります。これを画像そのまま表示させるには、image_to-link フックを使います。以下のようなコードを、使用している携帯テーマの functions.php に追加してください (functions.php がなければ作る)。「http://ecx.images-amazon.com/images/」の部分は、実際に挿入される画像 URL にあわせて適宜修正してください。

    function ks_keep_amazon_image($replace, $orig, $src) {
    	if (preg_match('#^http://ecx.images-amazon.com/images/#', $src)) {
    		$replace = $orig;
    	}
    	return $replace;
    }
    add_filter('image_to_link/ktai_style.php', 'ks_keep_amazon_image', 10,3);

    PHPど素人にはfunctions.phpを作ることの意味もわからなかったのですが、要はテキストファイルに上記コードをそのままコピー、そしてPHPファイルの宣言である <?php?> でこのコードを挟み込み、あとは「functions.php」という名前で保存すればOKです。ファイル保存場所は自分が使っているテンプレートのフォルダの中で、初期設定なら/wp-content/plugins/ktai_style/themes/default/ の中ね。

    さらにURLを変更すればほかのサイトも読みこめるとのことなので、こんなかんじでいじってみました。コピペしやすいように <?php つきですよ。

    <?php
    function ks_keep_amazon_image($replace, $orig, $src) {
    if (preg_match(‘#^http://ecx.images-amazon.com/images/#’, $src)) {
    $replace = $orig;
    }
    return $replace;
    }
    add_filter(‘image_to_link/ktai_style.php’, ‘ks_keep_amazon_image’, 10,3);

    function ks_keep_flickr_image($replace, $orig, $src) {
    if (preg_match(‘#^http://static.flickr.com/#’, $src)) {
    $replace = $orig;
    }
    return $replace;
    }
    add_filter(‘image_to_link/ktai_style.php’, ‘ks_keep_flickr_image’, 10,3);

    ?>

    赤字が上のAmazonから変更したところ。プログラミングの知識ないまま見よう見まねでやってみましたが、これでFlickrの画像も無事読み出せました。モバイルで表示したい画像なんてAmazonとよく使う画像共有くらいだろうから、いくつか自分で設定すれば十分まかなえそう。あとはフォト蔵を設定しとこうかな。

    外部リンクのGoogle変換

    つづいては外部リンクをGoogleに変換する方法です。素材はこちら。

    外部サイトへのリンクを通勤ブラウザ等の変換サービス経由にしたい
    external_link フックに独自の変換関数を割り当ててリンク先 URL を変更すれば、いきなり変換サービス経由リンクにできます (バージョン 1.00 から利用可能)。もしくは、redir フックで中継ページの文言を変更することも可能です (バージョン 1.20 から利用可能)。以下のようなコードを、利用中テーマの functions.php に書けば、MT4i と似た中継ページにできます。
    function ks_sjk_redir($html, $url) {
    	$html = '<p>別のサイトへジャンプしようとしています。</p><p>↓クリック<br /><a href="'
    	. attribute_escape($url) . '">' . attribute_escape($url) . '</a></p>';
    	$sjk_link = 'http://www.sjk.co.jp/c/w.exe?y=' . rawurlencode(preg_replace('|^http://|', '', $url));
    	$html .= '<p>上記URLのサイトは携帯電話で正しく表示できないかもしれませんが、下記URLであれば表示できるかもしれません。</p>'
    	. '<p>↓クリック<br /><a href="' . $sjk_link . '">' . $sjk_link . '</a>'
    	. '</p><hr /><p>前のページへは携帯電話の戻るボタンで戻ってください。</p>';
    	return $html;
    }
    add_filter('redir/ktai_style.php', 'ks_sjk_redir', 10, 2);

    すでに functions.php は作成済みなので、その中に上記ソースをペタっと張るだけなのですが、注意点が2つほど。1つは文字コードの問題で、UTF-8で保存してあげないと文字化けします。最初おもいっきりこれにひっかかった……。

    もう1つは、上記は通勤ブラウザがサンプルで使われているので、URLをGoogleに変更する必要があること。具体的にはこんなかんじ。

    function ks_sjk_redir($html, $url) {
    $html = ‘<p>別のサイトへジャンプしようとしています。</p><p>↓クリック<br /><a href=”‘
    . attribute_escape($url) . ‘”>’ . attribute_escape($url) . ‘</a></p>’;
    $sjk_link = ‘http://www.google.com/gwt/n?_gwt_noimg=1&u=‘ . rawurlencode(preg_replace(‘|^http://|’, ”, $url));
    $html .= ‘<p>上記URLのサイトは携帯電話で正しく表示できないかもしれませんが、下記URLであれば表示できるかもしれません。</p>’
    . ‘<p>↓クリック<br /><a href=”‘ . $sjk_link . ‘”>’ . $sjk_link . ‘</a>’
    . ‘</p><hr /><p>前のページへは携帯電話の戻るボタンで戻ってください。</p>’;
    return $html;
    }
    add_filter(‘redir/ktai_style.php’, ‘ks_sjk_redir’, 10, 2);

    これでリンク先がGoogleのモバイル変換になりました。あとはこれを funtcions.php の中にいれればいいだけ。並び順はあまり関係ないっぽいので、一番最後の ?> の前においておけばいいのかな。

    ただ1つ課題は、変換の際にURLがうまく認識されないみたいで、/%2F になっちゃうんですよね。これなんとか回避できないかなあ。せっかくMobile Link Discovery設定しているブログでもそれがうまく認識されなくなっちゃうのでここはなんとかしておきたいところ。

    しかしまあMobile Link DiscoveryしていたらURLに直接アクセスすれば変換してくれるし、とりあえずやりたいことはやれたのでKtai Styleへの移行を確定。ついでにAdSenseやうごくひともまとめて設定しました。こちらは footer.php のファイルに、モバイルGoogle Adsenseは <!–end paging–> 直下に <hr> を入れてからコピペ、うごく人は最後の </body> の前にコピペすれば設定完了です。おつかれさま!

  • WordPressのモバイルプラグイン再考

    ※この記事は5年以上前に書かれたため、情報が古い可能性があります

     以前、WordPressのモバイル対応プラグインとしてMobile Eye+を導入したわけですが。

    カイ士伝 ? Blog Archive ? WordPressでモバイル対応
    https://bloggingfrom.tv/wp/2008/05/06/176

     その導入紹介エントリーでこんなコメントいただいておりました。

    リンクしているURLを携帯用に変換する機能なんかもあっていたれりつくせり。

    この機能 (URLGATE) は外部サービスを使うのですが、実はその外部サービスは「ポルノ・出会い系広告を出す」という問題があります。Mobile Eye+ を紹介されるのであれば、ぜひともこの点についても触れて頂きたいと思います。
    貴サイトでも、URLGATE 機能をオンにされていますが、実際にアダルト広告が出てきますので、それが自身の意図に合うのかどうか、よく検討されるとよいかと思います。

     んでこのコメントいただいたのは、もう1つのWordPressモバイルプラグインである「Ktai Style」を作っている方なんですね。直々のコメント恐縮です。

     実はKtai StyleはMobile Eye+よりも前に知っていたんですが、当時はPHPが4だったので導入できなかったのでした。

    はてなブックマーク – カイ史伝 / 2008年02月12日
    http://b.hatena.ne.jp/kai3desu/20080212#bookmark-5936228

    PHP5にアップデートしたのは、さくらインターネットが移行していることに加えて、5にすればKtai Styleを使えるからというのもあったんですな実は。

    カイ士伝 ? Blog Archive ? さくらインターネットでPHP5にバージョンアップした時のフレッシュリーダー設定方法
    https://bloggingfrom.tv/wp/2008/05/11/180 

     そんなわけでついにKtai Style入れてみたんですが、正直Mobile Eye+と一長一短な感じ。

     Ktai Styleは絵文字をふんだんに使っていておしゃれなのと、対応ハードの動作確認が幅広い。PSPでの閲覧もちゃんとモバイル表示してくれます。そして何より便利なのが簡易ログイン機能で、携帯電話からWordPressにログインして記事を修正したりできます。ただし、URLにログイン情報が含まれてしまうため、管理画面からどこかへリンクで飛んでしまうとログイン情報がばれる、という注意点がありますが、まあ管理画面からリンク飛ぶことはないだろうし、基本的にいざというときの管理機能にすればいいかなと。

     ただ、残念なのはサーバーに直接アップロードした画像は表示できるけど、フォト蔵やFlickrのような外部画像やAmazonの画像などはテキストリンクでしか表示されないこと、そして何より上述の外部リンクを携帯電話用に変換してくれる機能がKtai Styleにはないんですね。

     一方、Mobile Eye+はフォト蔵やAmazonの画像も記事に表示できるし、外部リンクを携帯電話用に変換してくれる機能も便利。

     で、一長一短ある両者をどうやって導入決めるかなあと考えたとき、管理機能は自分だけのメリットなんだけど、外部リンクの変換は自分に加えてブログを読んでくれる人の両方にメリットがあるんですね。なのでMobile Eye+をうちでは使うことにしました。

     外部リンク変換サービスにアダルト広告が出るという件は、それいいだすと2ちゃんねるのリンクも張れない(2ちゃんねるからの外部リンクはアダルト広告だらけ)なんですが、まあ出ないにこしたことはないというのは確か。なのでURLGATEのファイルからアダルト系広告を表示する外部リンクサービスを削除し、Google Website Transcoderだけにしてみました。

     こういう改造がいいのかどうかが謎なのですが、その筋に詳しい人に聞いてみると、プログラムの中には配布に関する記述がなく、個人利用であって再配布するわけでないのなら平気ではないかというご意見いただき、とりあえずこの改造したまま使ってみたいと思います。他にもアダルト広告出る場所とかあったら直したいと思いますし、そんな改造すんなという意見もありましたらぜひご一報いただけると幸いです。

     個人的にはKtai StyleにGoogle Website Transcoderが導入されたらそっちに乗り換えたいんですけどねえ。ブログのエントリーは紹介リンクも含めて1つの内容なので、リンク先がモバイル対応してなくて見られないというのは寂しいし。

     なお、WordPressの携帯プラグインについては「ならべて」にこんな比較表があったのでご参考まで。私が作った表じゃないんですけど情報細かくてわかりやすいかな。欲を言えばKtai Styleの簡易ログイン機能も触れてあげてほしいとは思いますが。

     

    携帯電話用WordPressプラグインの比較 by ならべて
    ? PHP4対応 WordPress2.5系対応 ライセンス有り リンク先を携帯ページのURLに置換 広告が出ない 日本のケータイに特化 日本製 日本語解説 配布元が存在する
    Ktai Style × ×
    Mobile Eye × × × ×
    Mobile Eye+ × ×
    WordPress Mobile Edition × × × ×