16
ワードプレスをスマホ表示させるのに便利なプラグイン「WPtuch」
最近のワードプレステーマはレスポンシブデザインがほぼ標準となっている為、こちらのプラグインの存在意義は以前に比べると薄らいでいるだろうと思う。
恐らくそのせいなのだが現在WPtouchのカスタマイズをしようとネットで検索してもヒットするのはまだレスポンシブがそこまで浸透していなかった時代の古い情報ばかりである。
その為、自分の為にも、また私と同様の気持ちになった方の為にも
改めてWPtouchのまとめを作っておこうと思い立ったのだ。
Wptouchにページャーを導入したい
こちらは以前記事にしたのでそちらのリンクをごらん頂きたい。
【WP】WPtouchの無料テンプレートBauhausをページ送りにしたい
ただし、私はこちらのサイトを一回WPtouchにしようとした際に、これと同じ手順をとったのだが反映されず結局未だにレスポンシブデザインでそのまま使っていたりする。
恐らくはWPtouchのバージョンが変わったせいなのだろう、なので上記の情報はもはや使えないのかもしれない。
追記：こちらは上記のリンクにあるfoundationのindexではなくlayoutsフォルダ内にあるpost-listing-viewの
<!-- show the load more if we have more posts/pages -->
<?php if ( get_next_posts_link() ) { ?>
<a class="load-more-link tappable no-ajax" href="javascript:return false;" rel="<?php echo get_next_posts_page_link(); ?>">
<?php wptouch_fdn_archive_load_more_text(); ?>…
</a>
<?php } ?>
<?php } else { ?>
<div class="posts-nav">
<?php posts_nav_link( ' | ', '‹ ' . __( 'newer posts', 'wptouch-pro' ), __( 'older posts', 'wptouch-pro' ) . ' ›' ); ?>
</div>
の部分を同様に
<?php if(function_exists('wp_pagenavi')) { wp_pagenavi(); } ?>
へと置き換えた所、ページネーション化することが出来た。
ただし試す際は自己責任でお願いします。
WPtouchのカスタマイズ解説してくれてるサイト
WPtouchをカスタマイズしてブログをオリジナルデザインでスマフォ対応させたよ！（カスタマイズ編）
こちらのページは今のバージョンよりもかなり前のバージョンの解説である為、今は余り役に立つ情報は無さそうだった。
WPtouchをカスタマイズしてスマートフォン向けオリジナルテーマを作成してみました！
こちらも上記と同じく現在では役に立つ情報は余りありません。
WordPress WPtouch モバイルプラグインをカスタマイズする方法
・デフォルトでアイキャッチ画像が上部に設定されるのを非表示にする方法
・トップページスライダーを非表示にする方法
・カラーリングを変更する方法
等、ファイルをいじらずともカスタマイザーで変更出来る簡単なカスタマイズを解説してくださってます。
個人的メモ
.circles .loop-link img.post-thumbnail{
-webkit-border-radius:150px;
border-radius:150px
}
ってとこのradiusの値を０にするとインデックスページの記事一覧の丸いアイキャッチ表示を四角く出来る
.loop-link .bottom-border{
border-bottom:1px solid rgba(0,0,0,.15);
display:block;
position:absolute;bottom:0;
left:88px;right:0
}
の88pxを０にすると中途半端なことになってたインデックスのボーダーがフルに
wptouchは関連記事を表示してくんないのでwordpress related postsを導入してみた
スマホページのブックマークアイコンを設定してみた