SWELLの人気記事にカスタム投稿を含めるには２ヶ所を変更すれば良い。誰でも簡単にできるカスタマイズ

2024年1月23日2024年1月27日

当ページのリンクには広告が含まれています。

2024/1/27　追記
私、SWELLをまだまだ知らなかった。人気記事にカスタム投稿を含めたければ、投稿リストのピックアップに投稿タイプを指定すれば良い。ランキングの番号はCSSで付け直す。ただそれだけのことだった。がーん。恥ずかしい～。でも恥を公開するのも良いので、せっかくなので色々いじった記事をこのまま残しておきます。

SWELLの人気記事にカスタム投稿を含めるには、本体の２ヶ所へコードの変更と追加をすれば良いです。デメリットは、SWELL本体を触ってしまうことです。何とか本体を触らずに外からやろうと試みましたが、知識が薄い私には無理でした。

変更するソースは下記の２つ

classes/Theme_Data.php
classes/Legacy_Widget/SWELL_Popular_Posts.php

変更箇所は下記

１．classes/Theme_Data.php　８５行目を変更

変更前


	// PVカウント機能を利用する投稿タイプ
	public static $post_types_for_pvct = [ 'post' ];

変更後


	// PVカウント機能を利用する投稿タイプ
	public static $post_types_for_pvct = [ 'post','カスタム投稿のスラッグ' ];

$post_types_for_pvct の配列に、人気記事で表示させたいカスタム投稿のスラッグを追加する。例えば、食べ物のレビューというカスタム投稿タイプを作っていて、スラッグが「tabemono_review」とした場合は下記。


	// PVカウント機能を利用する投稿タイプ
	public static $post_types_for_pvct = [ 'post','tabemono_review' ];

カスタム投稿スラッグとは、Custom Post Type UI（CPTUI）を使っているとしたら、一番上の「投稿タイプスラッグ」。

SWELLの人気記事におけるPVのカウントは、HTMLのdivタグにある、#content の属性にdata-pvct=”true”を設定することによりJavascriptでカウントし、データベースへ保存している。保存先は、wp_postmetaテーブルのct_post_views_byloosというmeta_key。

デフォルトの状態だと、data-pvct=”true”が設定される条件は３つある。その条件は、投稿（post）である、ログインしていないこと、ボットではないこと、である。つまり、コードを修正しながらだとログインしている状態なので、テストしようとしてもPVはカウントされない。別セッションでアクセスするか、スマホのキャリア帯域で試した方が良い。

上記の変更をすることにより、指定したカスタム投稿の#contentにもdata-pvct=”true”が設定される。上記の変更が正しく反映されているかどうかは、ソースを開いてpvctを検索すれば良い。引っかかればきちんと設定されているということである。

人気記事ウィジェットが設置してあるHTMLソース

この辺の詳細をもっと詳しく知りたければ、classes/Utility/Attrs.php を見ると良い。

２．classes/Legacy_Widget/SWELL_Popular_Posts.php　166行目に追加

先ほどの１つ目は保存の対象を変更した。２つ目は表示部分の追加になる。具体的には、クエリにポストタイプを追加する。

変更前


		// クエリ生成
		$query_args = [
			'post_status'         => 'publish',
			'meta_key'            => SWELL_CT_KEY,
			'orderby'             => 'meta_value_num',
			'order'               => 'DESC',
			'no_found_rows'       => true,
			'ignore_sticky_posts' => true,
			'posts_per_page'      => (int) $instance['num'],
		];

変更後


		// クエリ生成
		$query_args = [
			'post_type'         => 'カスタム投稿スラッグ',
			'post_status'         => 'publish',
			'meta_key'            => SWELL_CT_KEY,
			'orderby'             => 'meta_value_num',
			'order'               => 'DESC',
			'no_found_rows'       => true,
			'ignore_sticky_posts' => true,
			'posts_per_page'      => (int) $instance['num'],
		];

クエリにpost_typeを追加する。$query_argsの中に入るのであれば、166行目でなくとも良い。例えば、食べ物レビュー（tabemono_review）を表示したければ、下記の様に書く。


		// クエリ生成
		$query_args = [
			'post_type'         => 'tabemono_review',
			'post_status'         => 'publish',
			'meta_key'            => SWELL_CT_KEY,
			'orderby'             => 'meta_value_num',
			'order'               => 'DESC',
			'no_found_rows'       => true,
			'ignore_sticky_posts' => true,
			'posts_per_page'      => (int) $instance['num'],
		];

通常の投稿（post）と食べ物レビュー（tabemono_review）を表示したければ、下記の様に書く。


		// クエリ生成
		$query_args = [
			'post_type'         => array( 'post','tabemono_review' ),
			'post_status'         => 'publish',
			'meta_key'            => SWELL_CT_KEY,
			'orderby'             => 'meta_value_num',
			'order'               => 'DESC',
			'no_found_rows'       => true,
			'ignore_sticky_posts' => true,
			'posts_per_page'      => (int) $instance['num'],
		];

post_typeが複数の場合は配列にする。もしくはカスタム投稿がこれから増えると判っていて、いちいち追加するのが面倒であれば、下記のように書けば全てが対象になる。


		// クエリ生成
		$query_args = [
			'post_type'         => 'any',
			'post_status'         => 'publish',
			'meta_key'            => SWELL_CT_KEY,
			'orderby'             => 'meta_value_num',
			'order'               => 'DESC',
			'no_found_rows'       => true,
			'ignore_sticky_posts' => true,
			'posts_per_page'      => (int) $instance['num'],
		];

クエリのpost_typeをanyにすると全てが対象になる。この変更をすると、PVがカウントされていることが前提ですが、人気記事にカスタム投稿が表示されるようになります。

本体を触らずに何とかcode snippetsなどで外から出来ないかと試してましたが、私には無理でした。そもそもSWELLは開発者の了さんが仰っているように、ブログ向けであり、カスタム投稿があることは考えられていません。色々ソースを追っかけてみましたが、私には理解できない部分が多々あり、外からは諦めました。

カスタマイズしたいときの追っかけ方

余談ですが、自分でカスタマイズしたい場合、何をやっているのか、ソースはどこなのか、を追っかける方法です。検索しても、解決方法が見つけられなかった場合、自分でソースを追うしかありません。

今回のように「SWELL　人気記事　カスタム投稿」を具体例として追跡記録です。用意するものはテキストエディタの「秀丸」です。フォルダにあるファイルを一括でテキスト検索（grep）できるなら、何でも良いです。

人気記事ウィジェットを実際に配置し、対象の部分のHTMLソースを見ます。すると、大枠のHTMLタグのクラスにwidget_swell_popular_postsがあります。たぶん、swell_popular_postsがキーワードとなるでしょう。

このswell_popular_postsをSWELLの最上層、404.phpなどを開き、サブフォルダを含めてgrep検索します。classes\Legacy_Widget\SWELL_Popular_Posts.phpで定義されていることが判ります。対象のファイルを開くと164行目でクエリを作り、表示させていることが判ります。ここから修正ポイントを当たっていきます。

試しに、ここでpost_typeを変更しても表示が変わらないことが判ります。SWELL_CT_KEYが怪しそうなので、またgrepします。lib\define_const.phpで定数として定義されています。ct_post_views_byloosが定数の正体です。さらにSWELL_CT_KEYがclasses\Utility\Others.phpのupdate_post_metaで保存されていることが判ります。

Others.phpを見ると、update_post_metaの呼び元はset_post_viewsということが判ります。set_post_viewsをgrepします。lib\rest_api.phpで呼ばれていることが判ります。やはりPV数の計測とコメントが書いてあり、ここでカウントしているということが判ります。

複雑なコードですが、swell-ct-pvがキーワードっぽいのでgrepします。build\js\main.min.jsで改行なしのjavascriptが引っかかります。ウェブで「JS 整形」と検索して出てきた、見やすく変換してくれるサービスを使います。

swell-ct-pvが書かれている箇所に、getAttributeなどがあり、おそらくHTMLの属性値を引っ張ってきていると予測をします。ということは、属性をついているものだけカウントしているんだな、と考えます。

近くにdata-pvctという、それっぽい属性があります。確定ではありませんが、まずはこれをgrepします。先ほどと同じ様にJSがドサッと出てきますが、classes\Utility\Attrs.phpでdata-pvctが設定されていることが判ります。おそらく、ここでHTMLに属性をつけて、先ほどのJSでカウントをさせているのでしょう。Attrs.phpの中でdata-pvctを設定しているところを見ると、３つの条件があり、その中のis_singular()でpost_types_for_pvctを判定しています。