WordPress Popular Posts のランキング表示を Snow Monkeyの人気記事ランキングウィジットと同じデザインにする

カスタマイズ方法

PHP

My Snow Monkey プラグインか、子テーマの functions.php に下記のコードを追加してください。

/**
 * WordPress Popular Posts のランキング表示を Snow Monkeyの人気記事ランキングウィジットと同じデザインにする
 *
 * @param array $popular_posts
 * @param array $instance
 * @return string
 */
add_filter(
	'wpp_custom_html',
	function( $popular_posts, $instance ) {
		global $post;
		ob_start();
		?>
		<div class="wpaw-ranking">
			<ul class="wpaw-ranking__list wpaw-posts-list">
				<?php foreach ( $popular_posts as $popular_post ) : ?>
					<?php $post = get_post( $popular_post->id ); ?>
					<?php setup_postdata( $post ); ?>
					<li class="wpaw-ranking__item wpaw-posts-list__item">
						<a href="<?php the_permalink(); ?>">
							<div class="wpaw-ranking__figure wpaw-posts-list__figure">
								<?php the_post_thumbnail( 'thumbnail' ); ?>
							</div>
							<div class="wpaw-ranking__body wpaw-posts-list__body">
								<?php
								$taxonomies = get_post_taxonomies( get_the_ID() );
								$_taxonomy  = ! empty( $taxonomies[0] ) ? $taxonomies[0] : false;
								$terms      = ( $_taxonomy ) ? get_the_terms( get_the_ID(), $_taxonomy ) : [];
								?>
								<?php if ( $terms ) : ?>
									<div class="wpaw-ranking__taxonomy wpaw-posts-list__taxonomy">
										<?php foreach ( $terms as $_term ) : ?>
											<span class="wpaw-term wpaw-term--<?php echo esc_attr( $_taxonomy ); ?>-<?php echo esc_attr( $_term->term_id ); ?> wpaw-ranking__term">
												<?php echo esc_html( $_term->name ); ?>
											</span>
											<?php break; ?>
										<?php endforeach; ?>
									</div>
								<?php endif; ?>

								<div class="wpaw-ranking__title wpaw-posts-list__title"><?php the_title(); ?></div>
								<div class="wpaw-ranking__date wpaw-posts-list__date"><?php the_time( get_option( 'date_format' ) ); ?></div>
							</div>
						</a>
					</li>
				<?php endforeach; ?>
			</ul>
		</div>
		<?php
		return ob_get_clean();
	},
	10,
	2
);

この記事を書いた人

アバター画像

キタジマ タカシ

長崎県長崎市在住。地元のWeb制作会社でWebデザイナー/エンジニアとして従事した後、2015年にフリーランス [ モンキーレンチ ] として独立。WordPress のテーマやプラグイン、ライブラリ、CSS フレームワーク等、多数のプロダクトをオープンソースで開発・公開しています。

Snow Monkey オンラインコミュニティ

Snow Monkey をより良いテーマにするために、今後の機能開発等について情報共有したりディスカッションをしたりする場所です。より多くのユーザーの交流があったほうがより良いプロダクトに育っていくと思いますので、ぜひご参加ください!