jQuery Mobileというのを使います。ドキュメントはここ。僕もそろそろ考えた方が良いかも。Androidでは全く問題なくブラウズ出来たけど、iPhoneだとどうなんだろうこのサイト。取り合えず大まかな手順を下記にサンプルとしてメモしておきます。
header.php
jQueryとjQuery Mobileのjsファイルへのリンクとcssを追記<link rel="stylesheet" href="/css/jquery.mobile-1.0a1.min.css" /> <script src="/js/jquery-1.4.3.min.js"></script> <script src="/js/jquery.mobile-1.0a1.min.js"></script>
div
data-roleとdata-themeとidを振る<body <?php body_class(); ?>>
<div data-role="page" data-theme="b" id="jqm-home">
<div data-role="header">
<h1><?php bloginfo('name'); ?></h1>
</div>
<div data-role="content">
footer.php
下記コードを追加したり変更したり</div><!-- data role content--> <div data-role="footer" class="ui-bar"> <a href="#jqm-home" data-role="button" data-icon="arrow-u">上へ</a></div> <?php wp_footer(); ?> </div> </body>
各ループ
index.php、search.php、archive.php等のループを以下に変更<ul data-inset="true" data-dividertheme="b" data-role="listview" data-theme="c"> <?php if (have_posts()) : while (have_posts()) : the_post(); ?> <li><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></li> <?php endwhile;endif ?> </ul>ざっくりとこんな感じです。
やる気出ない。
参考：かちびと
