人気記事200のメニューを追加(プラグイン WordPress Popular Posts をカスタマイズ)& 投稿カレンダーをリニューアル

update 最終更新日:2024年1月3日 at 1:43 PM

senri
senri

The "200 Popular Articles" tab has been added to the menu of Senri's portal site, and the posting calendar has been renewed.

Add 200 popular articles tab

人気記事200タブの中には、本日の人気記事30、過去7日間の人気記事50、過去30日間の人気記事100、過去180日間の人気記事200、過去360日間の人気記事200(現在はタブから削除)へのリンクが設置されていますので、どうぞご利用くださいませ。

You can check each menu from the link below.

For the addition of this function, please refer to the WordPress plugin "WordPress Popular Posts” made it easy.
The customization method is as follows. Please refer to it.

Shortcode settings

Below is the shortcode for displaying popular articles for the last 30 days. In addition, the parameter 'pid' specifies the article to be excluded from the aggregation.

[wpp range='last30days' post_type='post, page, news, gallery' pid='18381,18358,18341,18440,18904' limit=100 thumbnail_width=100 thumbnail_height=75 stats_category=1 post_html='<li><div class="wpp_thumb_wrapper">{thumb}</div> {title} <span class="wpp-meta post-stats">{stats}</span></li>']

Additional CSS settings

Open the WordPress settings menu and add the following CSS in Appearance -> Additional CSS.
This CSS will display the ranking numbers in the thumbnails and allow mouseovers to the thumbnails (hover) implements the display settings for the hour.
Note that the widget ID (#wpp-2) used in the CSS below can be checked by viewing the source code using a browser such as Edge.

/*
	人気記事のアイキャッチ内に順位番号を表示
*/
body{
	counter-reset: rank_number;  
}
ul.wpp-list li img:hover {
	box-shadow: 0 -2px 5px #999;
	-webkit-filter: brightness(1.3);
	-moz-filter: brightness(1.3);
	-o-filter: brightness(1.3);
	-ms-filter: brightness(1.3);
	filter: brightness(1.3);
}
.wpp_thumb_wrapper{
	position: relative;
}
.wpp_thumb_wrapper:after{
	counter-increment: rank_number;
	content: counter(rank_number);
	display: block;
	position: absolute;
	left: 0;
	width: 20px;
	height: 20px;
	background: rgba(50, 50, 50, 0.8);
	color: white;
	font-size: 14px;
	text-align: center;
	border-radius: 2px;
}

/* WordPress Popular Posts のウィジェット表示調整 */
#block-2 li{
	margin-top: 2px;
	margin-bottom: 2px;
}

2023.06.22 Added
Since WordPress Popular Posts (WPP) version 6.1.3 and later will end support for the classic widget, the popular posts display on the front page has been changed to call from the WPP widget block.
Currently, using the widget block editor causes an internal error in the "Archives Calendar Widget", so we have Classic Widgets (CW) enabled. Therefore, the placement of the WPP widget block was done by the following steps.

Disable CW → Add WPP block in Widget Block Editor (Ignore errors) → Enable CW

Swapping Posting Calendars (Archives)

Up until now, blog archives were displayed using the post calendar widget provided as a standard function of WordPress, but it was not very user-friendly, so the following WordPress plugin "Archives Calendar Widgetdecided to replace it with

However, this plugin has not been tested with the last three major releases of WordPress. In the future, maintenance and support may end, and using it with newer versions of WordPress may cause compatibility issues, so it will be experimental for the time being.

Include and display custom posts in monthly archives

There was a problem with the replacement of the posting calendar this time.
The Archives Calendar Widget settings support custom posts. Therefore, when I set the custom post to be displayed in addition to 'post' and clicked the link of the posted month, I got an error "The page you are looking for cannot be found."
This is because there are only custom posts in that archive. In the WordPress system, normal posts are reflected in the calendar archive, but custom posts ('news', 'gallery' on this site) are not reflected in the archive.
Therefore, you should be able to include custom posts in your monthly archives to avoid this error.
This can be resolved by putting the following code in your theme's functions.php :

/* 月別・日別アーカイブにカスタム投稿を含めて表示する
---------------------------------------------------------------- */
function my_pre_get_posts( $query ) {
    if ( ($query->is_month() || $query->is_day()) && $query->is_main_query() ) {
        $query->set( 'post_type', array('post','news', 'gallery') );
    }
}
add_action( 'pre_get_posts', 'my_pre_get_posts' );

function my_getarchives_where( $where ){
    $where = "WHERE";
    $where .= " (post_type = 'post' OR post_type = 'news' OR post_type = 'gallery')";
    $where .= " AND post_status = 'publish'";
    return $where;
}
add_filter( 'getarchives_where', 'my_getarchives_where' );

* 2023.02.19 update

↑ The code has been modified to support the display of daily archives (also published in the article below).

Add this entry to the hasebookmark
X (post)

Leave a Reply