備忘録: 携帯閲覧対応アーカイブ

備忘録 > MovableType > 携帯閲覧対応

i-modeシミュレータ２でhostsの設定を参照させる

2010年2月 3日 22:49

WZR-HP-G300NHはヘアピンNATに対応していません。
よってhostsファイルの内容を書き換えることによって自宅のネットワーク内からHPを閲覧できるように対応しています。

停止して久しいKurumiStyle携帯版（公開する意味があまり無いので現在停止中）ですが、別の用途でテストしたいことがあるのでi-modeシミュレータ２で確認するとこに。

しかしヘアピンNAT未対応の弊害がここでも・・・どうやらルーターを見に行っているようです。

i-modeシミュレータ２はhostsを参照するように設定できるようなので下記の手順で対応しました。

続きを読む

クリック男爵

コメント(0)

i-modeシミュレータ２でhostsの設定を参照させる

ハイフンを削除して電話番号リンクを設定する

2009年12月16日 17:15

カスタムフィールド<MTTel>に「xx-xxxx-xxxx」もしくは「xxxx-xx-xxxx」といった形式の電話番号が格納されているのですが、携帯コンテンツ向けに電話番号リンクを設定してくれという依頼が来ました。

「だったら設計段階で要求仕様に盛っておいてよ・・・」と思いつつ何とか対応したのでソースを備忘録として残しておこうと思います。

$telno = '<$MTTel encode_php="q"$>';
encode_phpでphpでタグが利用できるようにエンコードして変数$telnoに格納。
qはシングル・クオート、qqはダブルクオート。詳細はマニュアル参照のこと。

$tellnk = str_replace("-","",$telno);
str_replaceは検索文字列に一致したすべての文字列を置換します。詳しくはマニュアル参照のこと。
上のコードでは$telnoの-を削除して変数$tellnkへ格納するように記述しています。

echo '<a href="tel:'. $tellnk .'">'. $telno ."</a>";
上記は電話向けリンクを出力するための記述です。これですでに登録済の電話番号を利用して電話リンクを設定することができましたとさ。爽快爽快・・・。

クリック男爵

コメント(0)

ハイフンを削除して電話番号リンクを設定する

親カテゴリのみ非表示

2009年8月 4日 00:53

MTであるサイトの携帯向けのテンプレートを構築しています。そのサイトは画像を多用しているサイトで、mod_ktaiを使って画像の圧縮などをかけているのですが、親カテゴリで表示するとオーバーフローしてしまう問題に悩まされていました。

サブカテゴリは親カテゴリをさらに細分化したもので件数はたいしたことなく、サブカテゴリ単位なら問題なく画像が表示できていました。

今回実現したかったのは「親カテゴリは表示せずにそれにひも付くサブカテゴリのみ表示させる」ことです。

続きを読む

クリック男爵

コメント(0)

親カテゴリのみ非表示

携帯でサブカテゴリ対応　～解決編？～

2009年7月31日 13:10

以前挫折した携帯でのサブカテゴリ対応ですが、別のサイトを構築している過程で解決できたので自分用の備忘録として残しておこうと思います。

カテゴリは特定の任意の名前のディレクトリをつけて、そこへ保存するようにアーカイブマッピングで指定しているので、そのディレクトリ内のインデックスを参照するには下記のように記述すれば言いようです。

時間をとってKurumiStyleモバイル版に実装して見ようと思います。

クリック男爵

コメント(0)

携帯でサブカテゴリ対応　～解決編？～

携帯サイトの構築はやはり難しい

2009年7月31日 00:05

ライブドアリーダーで情報を収集していて、「ゼロからはじめる携帯サイト構築」というエントリーを見つけました。今日、まさに携帯サイト構築で苦戦していたので目を通しておこうと思います。

職場の連中は簡単に言ってくれるけど、携帯サイトの構築は本当に難しい・・・。勉強になるし先につながると信じたいけど、近いうちに携帯とPCの垣根はなくなって、今習得している技術もきっと陳腐化していくんだろうと思います。

まぁプラットフォームを気にせずにサイト構築ができるのならそれに越したことはありませんが・・・

クリック男爵

コメント(0)

携帯サイトの構築はやはり難しい

悔しいが携帯は妥協・・・

2009年7月21日 23:58

紆余曲折ありましたが、携帯サイトは内容が閲覧できればよいと自分に言い聞かせ、悔しいですがだきょうすることにしました。「mod_ktaiを動かすとphp文がおかしくなる？」現象は現時点では解決できていません。

それよりも、他に進めたい案件があるのでそちらの優先順位を上げたいと思います。

クリック男爵

コメント(0)

悔しいが携帯は妥協・・・

前後の記事タイトルへ遷移

2009年7月 9日 10:20

携帯用ブログの記事詳細のテンプレートに前後のエントリーへのリンクを追加しました。

mobile用のブログ記事のアーカイブマッピング設定を「mobile」フォルダ以下に日付ベースで生成するように組んでいるので、「MTEntryPermalink」は使用していません。

少しはユーザビリティがよくなったかしら・・・。

クリック男爵

コメント(0)

前後の記事タイトルへ遷移

携帯でサブカテゴリ対応

2009年7月 8日 11:12

【追記】
根本的な解決ができず、結局カテゴリ表示は見送りました。無念です・・・。
「SeeSaaブログ」あたりのUIを参考にもう少し作りこんでみようと思います。

通常リンクの設定は「mt:EntryPermalink」タグを使用すると思いますが、アーカイブマッピングの設定で、モバイルフォルダ以下へ記事を生成するように設定しているので、携帯サイトでは「mt:EntryPermalink」を使用できません。

そこで、「ブログ記事概要」テンプレートに下記のような記述で携帯向けに生成したページへ遷移するようにしていました。

しかし、この記述だと、サブカテゴリに設定した記事に遷移することができず、リンク切れになってしまいます。そこでgoogleで調べでたどり着いたのが、「MTHasSubCategories」タグを使う方法です。

続きを読む

クリック男爵

コメント(0)

携帯でサブカテゴリ対応

mod_ktaiで携帯対応

2009年7月 7日 22:21

YUMEMILabsというところで公開されている携帯向けApacheモジュールを設定してみました。
今回の目的は「画像を携帯用に最適化」することです。

結果「画像の最適化」はうまくいったので、インストール手順などを備忘録として残しておこうと思います。

続きを読む

クリック男爵

コメント(0)

mod_ktaiで携帯対応

mod_ktaiを設定してみました

2009年7月 7日 14:14

携帯サイト構築簡易化Apacheモジュール「mod_ktai」をインストールし、設定してみました。

今まで携帯に表示された画像がオーバーフローしたりしていましたが、そのような不具合などが解消されたので、おおむね順調に動作していると思われます。

しかし、いままで携帯対応で実装していた「MT-I18Nプラグイン」の記述があると文字化けを起こしたり、一部に不具合が発生しているので、そちらの対応を急いだほうがよさそうです。

今回は、端末情報取得モジュールである「mod_ktai_info」と画像変換モジュールである「mod_ktai_image」を設定したのですが、忘れないうちに備忘録として手順を残しておこうと思っています。

クリック男爵

コメント(0)

mod_ktaiを設定してみました

携帯用の画像変換とか

2009年7月 6日 14:36

よくよく考えたら、携帯サイト向けに画像変換の仕組みを実装していませんでした。他にも、ユーザーエージェント判断もトップページのみで、途中のページからくるとPC向けのページを表示してしまっています。

実用レベルに持っていくには、まだまだ動作確認や機能を実装する必要がありそうです。ページ分割プラグインの「PageBute」は携帯でも動作するのかな～？

クリック男爵

コメント(0)

携帯用の画像変換とか

KurumiStyle携帯対応

2009年7月 5日 11:05

携帯用のテンプレートを作成し、とりあえず携帯版（β）が完成しました。

きになるところとかあれば適宜修正していく予定です。

今のところ、Docomoの機種でしか確認していませんが、一番制限が多いキャリアだと認識しているので、まぁDocomoで表示に問題がなければ、他のキャリアでもとりあえずは大丈夫という認識です。

クリック男爵

コメント(0)

KurumiStyle携帯対応

月別アーカイブ

2009年7月 3日 13:30

携帯サイトの構築で月別アーカイブを表示させたところ、2バイト文字のところで文字化けが発生してしまいました。

ようするに「2009年7月」と表示されないということです。

そこで、携帯サイトでは「2009.07」といった具合に表示できないかと考えたわけですが、

<mt:ArchiveTitle>には属性がないのでどうすればいいか悩みました。

結局のところgoogleと以前購入した本で調べ無事解決することができました。

続きを読む

クリック男爵

コメント(0)

月別アーカイブ

携帯用テンプレート作成中　その2

2009年7月 2日 23:38

いろいろと便利そうなApacheモジュールがあったのですが、結局うまくインストールすることが出来ませんでした。

私の機種では画像のリサイズ（ImageMagicのおかげ？）もなんとなくうまくいっているので、急いでインストールすることもなさそうです。

そんなわけで、相変わらずドコモベースで、テンプレートの作成を進めています。

クリック男爵

コメント(0)

携帯用テンプレート作成中　その2

携帯用テンプレート作成中

2009年7月 2日 01:01

htaccess設定による携帯サイトへの振り分け、文字コードの自動変更、全角→半角文字への変更処理と、概ね携帯サイトを構築するにあたり実装したい機能はつけたので、ひたすらサイトを構築しています。

画像を扱いと絵文字対応が当面の課題です。今のところ、対応するモジュールを見つけることができていません。

クリック男爵

コメント(0)

携帯用テンプレート作成中

.htaccessリダイレクト

2009年6月24日 15:40

携帯からのアクセスを判断して携帯用サイトへ飛ばすやり方は複数存在しますが、
私はこちらで紹介されていた方法で解決しました。

1.vi .htaccess　でファイルを開き、下記のｿｰｽを記載。

RewriteEngine On RewriteCond %{HTTP_USER_AGENT} ^(DoCoMo|KDDI|DDIPOKET|UP\.Browser|J-PHONE|Vodafone|SoftBank) RewriteRule ^$ 携帯用のURL [R]

2.公開しているサイトのindexファイルと同じ場所へ1.で作成したhtaccessファイルを移動させる。

3.念のためApache再起動

4.i-modeシュミレータでアクセスした場合、1で指定した携帯サイトが表示されました。

これは使えるぞ～。キャリア別対応が必要になってきたらこちらのサイトで紹介されている方法も試してみよう。

クリック男爵

コメント(0)

.htaccessリダイレクト

MTOSで携帯用テンプレートを作る　～その2～

2009年6月18日 15:27

紆余曲折あったものの何とか携帯閲覧用テンプレート製作の勘所が見えてきました。
本来なら、3キャリア分用意しておいてユーザーエージェント判定で切り替えるといった方法が好ましいのでしょうが、一人で作業をやってるとそういうわけにも行かないので、外部CSSが使えない等制約の多いDocomoを基準に製作を進めています。

携帯サイトではカタカナはまぁ大体半角ｶﾅで表示されているサイトが多いです。私の製作しているサイトでもこの機能が実装できないかと思い検索したところ「ConvertHanZen」という素敵なプラグインを見つけました。

何とかうまい具合に動作したので備忘録として残しておこうと思います。

続きを読む

クリック男爵

コメント(0)

MTOSで携帯用テンプレートを作る　～その2～

font-sizeの設定値

2009年6月15日 16:04

文字コードの壁を突破し、ようやくモバイルサイトのコーディングができるところまでこぎつけました。

スタイルシートで文字の大きさを設定するときfont-sizeプロパティを使用しますが、私はpx指定で
サイトを構築することが多く、キーワードで設定することがないので、記録しておこうと思います。

font-sizeプロパティは以下の通り、xx-smallが最小でxx-largeが最大になります。
xx-small,x-small,small,medium,large,x-large,xx-large

しかし、Docomoだとこの指定では文字の大きさを変えることができませんでした。どうやら宣言文等にコツがいるようです。

続きを読む

クリック男爵

コメント(0)

font-sizeの設定値

文字コードの変換 MT-I18Nプラグイン

2009年6月15日 10:42

昨日設定した文字コード変換プラグイン「TransEncoding」ですが、私の用途ですと問題が発生してしまいました。

SEOTOOLSなどでサイトのチェックを実施すると「タイトル」・「Description」・「Keyword」に設定した文言がすべて文字化けして表示されていたのです。これだとせっかくSEO対策を施しても意味があるとは思えません。

そこで、携帯用のテンプレートのみ「TransEncoding」で文字コード変換ができないか試行錯誤してみましたが、私のスキルでは実現することができませんでした。

続きを読む

クリック男爵

コメント(0)

文字コードの変換 MT-I18Nプラグイン

MTOSで携帯用テンプレートを作る　～その1～

2009年6月12日 14:47

pc2mを使った構築はひとまずおいておいて、携帯用のテンプレート製作に取り掛かったわけですがまぁはまりました。

今回、何とか突破口を見つけたので忘れないうちに備忘録として残しておこうと思います。

続きを読む

クリック男爵

コメント(0)

MTOSで携帯用テンプレートを作る　～その1～

文字コードの変換

2009年6月11日 15:48

pc2mは今回構築したサイトでは制約が多く、実用的ではないという判断に至り、結局
自力で携帯用のテンプレートを作成することにしました。

で、utf-8でサイトを構築していたのでいきなり文字コードの壁にぶち当たってしまいました。
しばらくgoogleをさまよった末に、出力ファイルの文字コードを変換してくれる「TransEncoding」という
素敵なプラグインを見つけたので早速活用させていただきました。

以下備忘録です。

続きを読む

クリック男爵

コメント(0)

文字コードの変換

MTEntryPermalinkの設定。

2009年6月10日 11:06

先日pc2mで携帯からの閲覧できることを確認しました。サイトはMTOSで構築したので、さっそく携帯向けのテンプレートを構築することにしました。

携帯用のインデックステンプレートとブログ記事用のテンプレートはすぐできたのですが、記事のリンクをクリックするとPC用のブログ記事テンプレートに遷移してしまい、こちらの意図する動作をしてくれません。

購入した本やgoogleで調べたところ、下記のように記述してやれば、任意のテンプレートへ遷移させることができるようです。

この例で言えば、エントリーのリンクをクリックすると、「ブログ記事mobile」のテンプレートの内容が表示されます。

携帯サイト構築に向けひとつ課題を解決することができましたとさ。爽快爽快・・・

クリック男爵

コメント(0)

MTEntryPermalinkの設定。

携帯対応

2009年2月17日 06:53

pc2mという変換スクリプトを使ってこのサイトを携帯で閲覧できるように手を入れています。
とりあえず、文字化けなどの問題もなく動いていることは確認したので、ぼちぼちすすめていきます。
あと、RSSをうまく活用して自分仕様のニュース閲覧ページも作りたいな・・・。

クリック男爵

コメント(0)

携帯対応

« プラグイン | メインページ | アーカイブ

ツートップインターネットショップ(twotop.co.jp)

NEC Direct（NECダイレクト）

Sony Style（ソニースタイル）

フェイスインターネットショップ(faith-go.co.jp)

マウスコンピューター／G-Tune

Mac で Windows を動かすなら act2.com

【サンワダイレクト】Paleta de Colores（パレタ・デ・コローレス）