【WordPress】「VK Filter Search PRO」と「Advanced Custom Fields」を使って人気順の「ソート機能」を実装してみた！

2022/07/25

「VK Filter Search PRO」には、最近実装された「並び順」を変更する「ソート機能」があります。
このソート機能、標準では「公開日」「更新日」「タイトル」の降順と昇順の並び替えしかできないようになっています。

しかし、項目の最後に「カスタムフィールド」という項目があることを発見しました。
もしかすると、「Advanced Custom Fields（ACF）」と合わせて設定した上で、閲覧数のカウンターを実装すれば「人気順」のソートを作れるのではないか？と思い、試してみました！

完成形のイメージ

「VK Filter Search PRO」のダウンロードとインストール

「VK Filter Search PRO」を事前に購入していることが前提条件になります。
まだ、購入されていない方は、ご購入が必要です。
「https://www.vektor-inc.co.jp/service/wordpress-plugins/vk-filter-search-pro/」

まずは「VK Filter Search PRO」をダウンロードします。
「https://vws.vektor-inc.co.jp/my-account」にアクセスし、アカウント情報を入力し、ログイン。

「ダウンロード」ページに移動すると、購入済みの商品一覧が表示されます。
「VK Filter Search PRO」のプラグインファイルをダウンロードします。

導入するWebサイトの「WordPress」ダッシュボードに移動します。
「プラグイン」>「新規追加」を開きます。「プラグインのアップロード」をクリックして、先ほどダウンロードしたプラグインを導入します。

インストールが完了したら、「プラグインを有効化」します。プラグインの一覧に上記の画像のように表示されれば、有効化されています。

「Advanced Custom Fields」のインストール

続いて、「Advanced Custom Fields」をインストールします。

「Advanced Custom Fields」と検索欄に入力します。すると、ACFが表示されるので、「今すぐインストール」をクリックします。
インストールが完了したら、「有効化」をクリックします。

プラグインのインストールは以上で完了です。

「Advanced Custom Fields」の設定

「function.php」の設定

WordPressの子テーマに「function.php」をコピーし、以下構文を追加します。
（※今回は「SWELL」で設定しています。）

googleなどのクロールがカウントされないように無効化しています。

/* クロールカウントの無効化 */ 
function is_bot() {
  $ua = $_SERVER['HTTP_USER_AGENT'];
  $bot = array(
    'googlebot',
    'msnbot',
    'yahoo',
  );
  foreach( $bot as $bot ) {
    if (stripos( $ua, $bot ) !== false){
      return true;
    }
  }
  return false;
}

「single.php」の編集

WordPressの子テーマに「single.php」をコピーし、以下構文を追加します。

	// 	ACFの「PV」カウント
	if( !is_user_logged_in() && !is_bot() ) {
		$pv = get_field('pv');
		$pv++;
		update_field('pv', $pv);
	}

実際に編集します。
（※今回は「SWELL」で設定しています。）

<?php
if ( ! defined( 'ABSPATH' ) ) exit;

get_header();
while ( have_posts() ) :
	the_post();

	$SETTING = SWELL_Theme::get_setting();
	$the_id  = get_the_ID();

	// シェアボタンを隠すかどうか
	$show_share_btns = get_post_meta( $the_id, 'swell_meta_hide_sharebtn', true ) !== '1';

?>
<main id="main_content" class="l-mainContent l-article">
	<article class="l-mainContent__inner">
		<?php
			do_action( 'swell_before_post_head', $the_id );

・・・・・

<?php
if ( ! defined( 'ABSPATH' ) ) exit;

get_header();
while ( have_posts() ) :
	the_post();

	$SETTING = SWELL_Theme::get_setting();
	$the_id  = get_the_ID();

	// シェアボタンを隠すかどうか
	$show_share_btns = get_post_meta( $the_id, 'swell_meta_hide_sharebtn', true ) !== '1';

	// 	ACFの「PV」カウント
	if( !is_user_logged_in() && !is_bot() ) {
		$pv = get_field('pv');
		$pv++;
		update_field('pv', $pv);
	}

?>
<main id="main_content" class="l-mainContent l-article">
	<article class="l-mainContent__inner">
		<?php
			do_action( 'swell_before_post_head', $the_id );

以上で準備は完了です！
まずは、ページビューした時にカウントされるかを確認して、おきましょう。
（WordPressにログインしている状態ではカウントされないため、気をつけてください。）