[yuu]

オレイン様

ありがとうございます。

 

add_filter(
'snow_monkey_template_part_render_template-parts/common/page-header', // template-parts/common/page-header を書き換える
function( $html ) {
return str_replace(
'class="c-page-header__title ',
'class="c-page-header__title eachTextAnime ', // .eachTextAnime 文字が現れるアニメーション）
$html
);
}
);

 

上記のように書いてみたのですが、クラスが追加されていません。

どこが間違っているでしょうか…

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

下記のコードを試してみてください。

add_filter(
	'snow_monkey_template_part_render_template-parts/content/entry/header/header',
	function( $html ) {
		// 投稿タイプが news のとき
		$post_type = get_post_type();
		if ( 'news' === $post_type ) {
			// 投稿タイプの情報を取得
			$post_type_object = get_post_type_object( $post_type );
			// ラベルともともとの HTML をくっつけて表示
			return $post_type_object->label . $html;
		}
		return $html;
	}
);

♥ 0

いいねをした人: 居ません

[Hiroooo0]

キタジマさんありがとうございます。

ある程度制作を進めていたので、子テーマを作りコーディングしていくのはやめて、フィルターフック(snow_monkey_template_part_render_template-parts/loop/entry-summary/content/content)を用いてなんとか表示させることができました！

お時間いただきありがとうございました！
トピック閉じさせていただきます。

♥ 1

いいねをした人:

[キタジマ タカシ]

ご案内いただきましたように、Snow Monkey Footer CTAではなく スマホ固定フッター を利用するとaタグ内に入れられるということでしょうか？

あ、すみません、わかりにくかったですね…。

Footer CTA にしろフッター固定ナビゲーションにしろ、onClick 属性を管理画面から設定できる機能はありません。onClick を実行できるようにする方法は下記の2通りが考えられます。

## JavaScript を使う

HTML タグに onClick 属性を追加するのも、JavaScript ファイルで Element.addEventListener( 'click', ..., true ) を実行するのも全く同じことになります。HTML を改変せずに WordPress の標準的な方法（wp_enqueue_script()）で JavaScript を追加するだけで実現できる（当然 Snow Monkey 以外のテーマでもできます）ので、お手軽かつメンテナンスコストが低いです。

## Snow Monkey のフィルターフックで HTML を書き換える

snow_monkey_template_part_render フックを使って HTML を書き換えることで onClick 属性を追加する方法です。フックの知識が必要で、もし Snow Monkey のアップデートで HTML 構造が変わったときに書き換えが効かなくなるという可能性もあるので、JavaScript を使う方法よりは難易度が高いです。

—

先のトピックでは前者の方法をとっています。Footer CTA であれば

// プライマリーボタン用
document.querySelector('.p-footer-cta__primary-btn').addEventListener('onclick', ...);

とか

// セカンダリーボタン用
document.querySelector('.p-footer-cta__secondary-btn').addEventListener('onclick', ...);

の JavaScript で onClick を仕込むことができます。

♥ 1

いいねをした人:

[いいすた]

再び申し訳ありません。

やはりキャッシュを削除するたびに該当ページのサイドバーが表示されたり、別ページを閲覧して戻ると非表示になっていたりと、不思議な状態になってしまいます。

まずは下記のように、該当ページで通常のサイドバーを非表示にしています。

add_filter(
'snow_monkey_template_part_render_template-parts/widget-area/sidebar',
function ( $html ) {
if ( is_page( 11 ) ) {
return;
}
return $html;
}
);

次に、該当ページ以外で、追尾サイドバーを非表示にしています。

add_filter(
'snow_monkey_template_part_render_template-parts/widget-area/sidebar-sticky',
function ( $html ) {
if ( ! is_page( 11 ) ) {
return;
}
return $html;
}
);

何か、やってはいけないことをしているのでしょうか。何度も申し訳ありませんが、ご教授ください。

♥ 0

いいねをした人: 居ません

[まーちゅう]

条件分岐の書き方を変えるだけです。
特定のページ以外での場合は is_page() を ! is_page() に変えます。

/**
 * 特定のページ以外で追尾サイドバーを非表示にする
 *
 * @param string $html はコンテンツの中身.
 */
add_filter(
	'snow_monkey_template_part_render_template-parts/widget-area/sidebar-sticky',
	function ( $html ) {
		if ( ! is_page( 11 ) ) {
			return;
		}
		return $html;
	}
);

♥ 2

いいねをした人:

[まーちゅう]

こんにちは。
フックを使用する場合は、こんな感じです。

/**
 * 特定のページのみ追尾サイドバーを非表示にする
 *
 * @param string $html はコンテンツの中身.
 */
add_filter(
	'snow_monkey_template_part_render_template-parts/widget-area/sidebar-sticky',
	function ( $html ) {
		if ( is_page( 11 ) ) {
			return;
		}
		return $html;
	}
);

♥ 2

いいねをした人:

[GONSY]

こんにちは。

has_excerpt()で実現可能かと思います。

関数リファレンス/has excerpt – WordPress Codex 日本語版

wpdocs.osdn.jp

add_filter(
	'snow_monkey_template_part_render_template-parts/common/page-header',
	function( $html ) {
		// 固定ページのとき
		if ( is_page() ) {
			//【抜粋】に入力がある場合
			if ( has_excerpt() ) { 
				// ページヘッダータイトルの下に <div>抜粋</div> を追加
				$html = preg_replace(
					'|(<h1 class="c-page-header__title">.*?</h1>)|ms',
					'$1' . '<div>' . get_the_excerpt() . '</div>',
					$html
				);
			}
		}
		return $html;
	}
);

@キタジマさん
不備があったら補足をお願いします🙇‍

♥ 1

いいねをした人:

[キタジマ タカシ]

こんな感じでどうでしょう？ My Snow Monkey か子テーマの functions.php に追加してみてください。

add_filter(
	'snow_monkey_template_part_render_template-parts/common/page-header',
	function( $html ) {
		// 固定ページのとき
		if ( is_page() ) {
			// ページヘッダータイトルの下に <div>抜粋</div> を追加
			$html = preg_replace(
				'|(<h1 class="c-page-header__title">.*?</h1>)|ms',
				'$1' . '<div>' . get_the_excerpt() . '</div>',
				$html
			);
		}
		return $html;
	}
);

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

\Framework\Helper::get_template_part( 'template-parts/header/site-branding' ); だとデフォルトのロゴが呼び出されるので、ここを独自にコーディングしちゃっうのが一番簡単ではないですかね？

add_filter(
	'snow_monkey_template_part_render',
	function( $html, $slug ) {
		if ( 'template-parts/nav/drop' === $slug ) {
			ob_start();
			?>
			<div class="my-drop-nav-logo">
				<img src="..." alt="..." />
			</div>
			<?php
			$site_branding = ob_get_clean();
			$search = '|(<li class="menu-item)|m';
			$replace = sprintf( '<li class="c-navbar__item">%1$s</li>', $site_branding );
			return preg_replace( $search, $replace . '$1', $html, 1 );
		}
		return $html;
	},
	10,
	2
);

のようにして、.my-drop-nav-logo にスタイルをあてて調整するという感じで。

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

My Snow Monkey か子テーマの functions.php に下記のコードを追加してみてください。

add_filter(
	'snow_monkey_template_part_render_template-parts/nav/drawer', // template-parts/nav/drawer を書き換える
	function( $html ) {
		return str_replace(
			'class="c-drawer ', // これを
			'class="c-drawer c-drawer--inverse ', // こうする（.c-drawer--inverse が右からでるようにするクラス）
			$html
		);
	}
);

これで右からはでるようになるのですが、ハンバーガーボタンにドロワーが重なってしまうので、一般の方はどうやって閉じるのかな？と混乱してしまう可能性はあると思います。中にハンバーガーボタンを追加できれば良いですが、ちょっと構造的にそれがやりにくいので、あまりおすすめはできません…。今後のアップデートで（コードを書く形にはなると思いますが）出る方向と、ハンバーガーボタンの有無をやりやすくしたいなと思います。

♥ 0

いいねをした人: 居ません

[*****]

[ プライベートトピックのため非表示 ]

♥ 1

いいねをした人:

[キタジマ タカシ]

また、ここは

add_action( 'snow_monkey_entry_meta_items', 'snow_monkey_entry_meta_items_modified', 20 );

というコードで日付を表示する処理を追加しているので、snow_monkey_template_part_render フィルターフックでの書き換えが難しいのであれば

remove_action( 'snow_monkey_entry_meta_items', 'snow_monkey_entry_meta_items_modified', 20 );

でデフォルトの日付表示処理を外して、改めてオリジナルの日付表示処理を追加するほうがわかりやすいかもしれませんね。

—-

追記：すみません、↑は誤りです。↑は詳細ページのメタ情報をについてでした。今回は一覧部分の日付なので違いますね。

一覧部分の日付（というかメタ情報）は、template-parts/loop/entry-summary/meta/meta.php というファイルで表示されています。この部分は子テーマに template-parts/loop/entry-summary/meta/meta-{投稿タイプ名}.php というファイルがあるとそれが優先されて使われるようになっているので、子テーマにそのファイルをつくって独自に日付の表示処理を書いてしまったほうがわかりやすいかもしれませんね。

♥ 1

いいねをした人:

[林淳一]

以下を参考にしました。

アーカイブページの記事一覧レイアウトのリッチメディアの日付の位置について

このトピックには9件の返信、2人の参加者があり、最後にキタジマ タカシにより2年前に更新されました。 10件の…

snow-monkey.2inc.org

add_filter(
	'snow_monkey_template_part_render',
	function( $html, $slug ) {
		if ( 'template-parts/loop/entry-summary/meta/meta' === $slug ) {
			return preg_replace(
'|
<ul>
 	<li class="c-meta__item c-meta__item--published">.*?</li>
</ul>
|ms',
'
<ul>
 	<li class="c-meta__item c-meta__item--modified">' . get_the_modified_time( get_option( 'date_format' ) ) . '</li>
</ul>
',
				$html
			);
		}
		return $html;
	},
	10,
	2
);

♥ 0

いいねをした人: 居ません

[GONSY]

shiさん

くわしくありがとうございます。
概ね以下のコードをmy-snow-monkey.phpに追加していただければ、ご希望の表示はできると思います。（もっと良いコードの書き方はあると思いますので参考までに(^^;）

使用しているget_field()の部分は、設定しているフィールド名に変更してください。
また不要なものは消してください。

add_filter(
'snow_monkey_template_part_render_template-parts/loop/entry-summary',
	function( $html ) {
	if ( 'event' === get_post_type() ):
	ob_start();
	?>
	<?php

		// カスタムフィールド：開催日 → event_day
		// ACF デイトピッカー（返り値：Ymd）
		$eDate =  get_post_meta( get_the_ID(), 'event_day', true );
		$date = date_create( $eDate );

		// 曜日用
		$week = array("日", "月", "火", "水", "木", "金", "土");

		// 開催日の表示は 「月.日」に変更
		$eventDay = date_format($date,'n.j');

		$today = wp_date('Ymd');

		// カスタムフィールド：開始時刻 → event_starttime
		// ACF Time Picker（返り値：G:i）
		$startTime = get_field( 'event_starttime' );

		// カスタムフィールド：開始時刻 → event_endtime
		// ACF Time Picker（返り値：G:i）
		$endTime = get_field( 'event_endtime' );

		// 開催日以降の判定
		// 開催日よりも今日の日付が大きい場合
		$preriod = strtotime($eDate) < strtotime($today);

		// カスタムフィールド：概要欄 → event_txt
		// ACF テキストエリア（改行：なにもしない）
		$eventSummary = get_field( 'event_txt' )
	?>

	<div class="event_day_post">
		<p class="event_date"><?php echo esc_attr( $eventDay) ; ?><span class="week"><?php echo esc_attr( $week[(int)date_format($date,'w')] ) ?></span></p>
		<p class="event_time"><?php echo esc_attr( $startTime ) ; ?> - <?php echo esc_attr( $endTime ) ; ?></p>
	</div>

	<div class="event_txt">
		<p><?php echo nl2br( esc_attr( $eventSummary ) ); ?></p>
	</div>

	<?php if( $preriod ): ?> // 開催日以降の条件分岐
		<div class="event_finish">終了しました</div>
	<?php else: ?>
		<div class="event_open">これから開催です</div>
	<?php endif; ?>

	<?php
	$event = ob_get_clean();
	
	return str_replace(
	'</header>',
	'</header>'.$event , // 投稿タイトルの下に追加
	
	$html
	);
	endif;
	return $html;
	}
);

結果 ↓

♥ 4

いいねをした人: