WPtouchに画像を表示させたくて。モバイル用ページをカスタマイズしてみた。(WordPress)

WordPressでブログを作り始めるようになってずっと迷っていたこと…。
それは『スマートフォン用のモバイルページを作るかどうか』。

自分の中では「モバイル用のページなんてナンセンスだ」という意識がずっとあって、WordPressを導入した時に標準で入っていた「WPtouch」を導入するのをずっとためらっていました。

だって、スマホってPCと同じようにWebページが見れるのがウリなんでしょ？見やすいようなデバイスになっているんでしょ？なのにわざわざスマホ用にページを簡素化するなんておかしいじゃん！
。・゜・(ノД`)・゜・。
なんてことを思いながら…。
できるだけiPhoneで見た時にも見やすいようなブログテーマにし、キャッシュ関連のプラグインで軽くなるようにするなどして抵抗を続けていたんですが…。

とあるAndroidな友人からの一言

「ノリロウのブログ重いよね」

はい。終了しました。ヽ(；▽；)ノ

ということで WPtouchを導入してみる事にしました。（無料版）
ただ、WPtouchのデフォルトの画面ってすごく味気なくて…。

せっかくWebページのデザインいろいろ考えてもこれじゃぁ台無しじゃん。
。・゜・(ノД`)・゜・。
タイトルも途中で切れてなんだかよくわからなくなってるし、WPtouch使ったらみんなこのデザインだから（あたり前）、パッと見誰のブログかわからないじゃん…。
視覚的な要素って大事よ…？T_T

…まぁ、結局 WPtouchの設定画面である程度は変えられるんですが、どうしても唯一できないことが…。
それは、

『 記事ごとのサムネイル画像を表示する 』

ということ。
だって、文字だけじゃぁ何の記事かよくわからないし、パッと見おもしろくないじゃん。>_<
そこそこの大きさのサムネで記事の概要をある程度把握できるようにしたい。

ということでGoogle先生に聞いてみると……やっぱりありました。

WPtouchカスタマイズ番外編 -サムネイル用画像をコントロールしよう- | knk-n.com -けんけんどっとこむ-

おぉ、@knk_nさんのブログだ！
いつも困った時に助けてくれる@knk_nさん。
けんけんさんホント神ヽ(；▽；)ノ

ということで、けんけんさんの仰せのままにFTPを開いてちょこちょこっと指定の文章を追加すると…。

/wp-content/plugins/wptouch/theme/default/function.php の最後に

fnction new_catch_that_image() {
    global $post, $posts;
    $first_img = '';
    ob_start();
    ob_end_clean();
    $output = preg_match_all('/<img.*.src=['"]([^'"]+)['"].alt.*>/i', $post->post_content, $matches);
$first_img = $matches [1] [0];
if(empty($first_img)){ //Defines a default image
        $first_img = "http://knk-n.com/Default.jpg";
    }
    return $first_img;
}

を挿入し、

あと、/wp-content/plugins/wptouch/theme/default/index.php に

<a href="<?php the_permalink(); ?>" >
<img src="aligncenter" src=<?php echo new_catch_that_image(); ?>" alt="" width="200" height="auto" />
</a>

を挿入する箇所を、<div class=”post-author”>~</div> の後に。

※ 画像の大きさ指定を width=”200″ height=”auto” に変更。
alignleft を aligncenter に変更。

おぉ、できた！すごい！ヽ(；▽；)ノ
@knk_nさんホントありがとうございます！神！

…あと変更したところは

日本語表示に変更。
タイトルを省略しない。また、記事の抜粋を表示する。
WordTwitプラグインを導入して、ヘッダーにTwitterリンクを挿入。
アイコンを変更。
メニューに固定ページを表示。

といったところです。それぞれWPtouchの設定画面から変更できました。

いやぁ…、ぜんぜんよくわかってないのがバレバレで毎回お恥ずかしいんですが… >_<
これで少しは前より速くなったかなぁ…。

ちょっとずつちょっとずつ日々前進です…^^;

少しずつ少しずつ日々改造…。