画像を魅せたいサイトに最適なワードプレステーマ pinstrap

ピンタレスト風グリッドレイアウト無料ワードプレステーマ「PinStrap」

画像クリップ型サイトブックマークツールpinterestを模したようなグリッドレイアウト＆ギャラリー風デザインのテーマです。

画面のサイズごと最大5列まで表示できるため、画像を多く扱うサイトには最適なテーマです。

現在はwordpress公式テーマから外れてしまったようですが、正方形＆縦型写真を並べるのにGood！

過去に子テーマを作成してカスタマイズしたこともありますので、ご紹介いたします。

※phpの編集はあくまで自己責任でお願いします。

変更に必要なphpを子テーマのディレクトリ内にコピーして編集してください。

無限スクロールを解除しよう

pinstrapは無限スクロールを採用しています。

次々とコンテンツが表示され便利なのですが、必要無い場合には、home.phpをカスタマイズして無限スクロールを解除しましょう。

プラグイン「WP-PageNavi」をインストールして、ページャー機能を追加します。

home.php

<div class="span12">…</div>

の下にWP-PageNaviを呼び出すphpを追加します。

例）

<?php if(function_exists('wp_pagenavi')) : ?>
<?php wp_pagenavi() ?>
<?php endif; ?>

これだけで無限スクロールを解除する事ができます。

また、archive.phpにもWP-PageNaviの機能を付加すると便利です。

ホームページ画像のマウスオーバー表示を変える

マウスオーバーを行なうと表示する内容はloop.phpに記載されています。

<div class="mask">以下に追加・変更したい内容を記載しましょう。

wordpress4.4のsrcsetを無効にしよう

pinstrapはなかなか良いテーマでしたが、wordpress公式から外れてしまったのは、iOSに対応できなかったからではないかと思います。

wordpress4.4ではiOSのretinaに対応するために、srcsetを導入したのですが、pinstrapは対応しておりませんでした。

functions.phpに

add_filter( 'wp_calculate_image_srcset_meta', '__return_null' );

を追加し、srcsetを無効にすることで、iOSでも画像を表示できるようになります。

現在も多くのテーマがあると思いますが、過去のテーマテンプレートカスタマイズ事例としてご紹介します。

-wordpress, ホームページ
-wordpressカスタマイズ, テーマ