MENU

【Snow Monkey】カスタム投稿、my-snow-monkeyを使ったカスタマイズ方法

my-snow-monkeyを使ったカスタマイズ方法

こんにちは。TOMOデザインです。

Snow Monkeyのカスタム投稿のアーカイブページの「my-snow-monkey」でできる、一部だけのカスタマイズ方法をご紹介します。

全体的なカスタマイズや、大幅なカスタマイズは子テーマなどを活用したほうが早いのですが、ちょっとしたカスタマイズの場合は「my-snow-monkey」で行った方がスムーズです。

目次

カスタム投稿を設定する

まずカスタム投稿の設定をします。

今回の設定は
・カスタム投稿名は「お知らせ」
・カスタム投稿スラッグは「news」

の設定を前提とします。

なお、カスタム投稿は、CPT UI(Custom Post Type UI)のプラグインを使っています。
(CPT UIのインストール方法は今回は割愛します)

CPT UIでカスタム投稿「news」を設定する

ダッシュボードから「CPT UI」→「投稿タイプの追加と編集」へ進みます。

下記のような新規作成画面になります。

下記のように設定します。
(今回はnewsで設定していますが、必要に応じ、任意の文字に置き換えて活用してください)

カスタム投稿設定

設定が完了したら「投稿タイプを追加」ボタンを押します。

カスタム投稿の設定完了

設定が完了すると、サイドバーに先ほど設定したカスタム投稿の項目が追加されます。

記事をいくつか投稿しておきます。

この状態でアーカイブページは、下記の通りです。

カスタマイズするファイルの位置を特定する

今回は、アーカイブのタイトルをカスタマイズしてみます。

アーカイブのタイトル用ファイルを特定する

まず、アーカイブファイルを開いてみます。

親テーマのSnow Monkeyのファイルにアクセスし、
「snow-monkey」→「templates」→「view」→「archive.php」をエディタで開きます。

エディタで開くと下記のようになっています。

アーカイブのコンテンツ部分のファイルは、

'template-parts/archive/entry/entry',

となっており、

「snow-monkey」→「template-parts」→「archive」→「entry」→「entry.php」

にあることがわかります。

この「entry.php」をエディタで開きます。

ヘッダー部分のファイルは、

Helper::get_template_part( 'template-parts/archive/entry/header/header', $args['_name'] );

となっており、

「snow-monkey」→「template-parts」→「archive」→「entry」→「header」→「header.php」

にあることがわかります。

この「header.php」をエディタで開くと…

カスタマイズしたい場所が出てきたので、ここをカスタマイズしていきます。

my-snow-monkeyでカスタマイズする

さて、ここからは「my-snow-monkey」を使ったカスタマイズをしていきます。

「my-snow-monkey」は、Snow Monkeyを有償購入した方のみ利用できるプラグインです。

購入および、プラグイン反映方法や基本の使い方については、Snow Monkeyの公式サイトをご参照ください。

ファイルパス

上記手順で、カスタマイズしたい「header.php」の場所が

「snow-monkey」→「template-parts」→「archive」→「entry」→「header」→「header.php」

ということで、この場合のファイルパスは、下記のようになります。

template-parts/archive/entry/header/header

最後の「header」は「header.php」のことですが、「.php」は取り除いて記述します。

my-snow-monkey.phpを開く

いよいよカスタマイズです。

今回は、アーカイブタイトルの前に◎をつけてみます。

「my-snow-monkey.php」を開き、下記コードを追記します。

// アーカイブタイトルの前に◎をつける ******************************
add_filter(
	'snow_monkey_template_part_render_template-parts/archive/entry/header/header',
	//header.phpが対象
	function( $html ) {
		if (get_post_type() === 'news'): //カスタム投稿 newsに限定する
			// 以降の出力を変数に格納する
			ob_start();
			?>
			<?php
			// 変数に格納
			$hoge = "";
			// </header>を書き換える
			return str_replace(
				'<h1 class="c-entry__title">',
				'<h1 class="c-entry__title">'.$hoge,
				$html
			);
		endif;
		return $html;
	}
);

内容は下記の通りです。

変更後はアーカイブタイトルの前に◎が追加され、下記のような表示になります。

まとめ

今回は、my-snow-monkeyを使ったカスタマイズをご紹介しました。

my-snow-monkeyは、CSSの追加ファイルを読み込んだり、PHPやJavascriptを使えたり、アクションフック、フィルターフックなども使えるようになります。

今回はちょっとしたカスタマイズでしたが、しっかり使えるとかなり制作の幅が広がります。

ご参考までに!

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

目次