2年前に投稿

WordPress Popular PostsのFilterを使ってみよう

2019年7月9日

DISCLAIMER: This article is more than a year old and may not be current.

この記事は約 6 分で読めます。

4.5

WordPress Popular Posts’ Wikiの
Filtersというページに幾つかの
フィルターフックのサンプルがあるので
試してみたいと思います。

wpp_parse_custom_content_tags

post_html と言う
パラメーターで使用できる
custom Content Tags を
新たに追加出来ます。

Use this filter to add new Content Tags for use in WPP’s custom HTML markup options (except when using the wpp_custom_html or the wpp_post filter hooks).

Filters page

post_htmlは
HTMLをカスタマイズ出来る
パラメーターです。
詳しくは、ダッシュボード > 設定 >
WordPress Popular Posts >
パラメーター > post_html を
参照してください。

ダッシュボード > 設定 > WordPress Popular Posts > パラメーター > post_html

A more advanced way to customize the HTML markup is via WordPress filters by hooking into wpp_custom_html or wpp_post. For details, please check the Filters page on the Wiki.

WPP’s custom HTML markup options

Exampleは、
タグ情報を表示する
custom Content Tags になります。

Example:

function wpp_parse_tags_in_popular_posts( $html, $post_id ){
    // Replace custom content tag {tags} with actual tags
    if ( false !== strpos($html, '{tags}') ) {
        // Get tags
        $tags = get_the_tags( $post_id );
        $tag_links = '<small style="color:blue;"><strong>Tags:</strong> ';
        if ( $tags ) {
            foreach( $tags as $tag ) {
                $tag_links .= '<a href="' . get_tag_link( $tag->term_id ) . '">' . $tag->name . '</a>, ';
            }
            // Remove last comma from tags list
            $tag_links = rtrim( $tag_links, ', ');
            // Replace {tags} with the actual tags
            $html = str_replace( '{tags}', $tag_links, $html );
            $html .= '</small>';
        }
    }
    return $html;
}
add_filter( "wpp_parse_custom_content_tags", "wpp_parse_tags_in_popular_posts", 10, 2 );

[wpp] shortcode

例えば、[wpp] shortcode で
post_html パラメーターを使って
以下のように書きます。

[wpp title_length=25 limit=5 post_html='<li>{title}</li><li>{tags}</li><li><small style="color:red;"><strong>Category:</strong> {category}</small></li>']

結果

  1. Vue.js + vue-good-table で...
    Category:

  2. Vue.jsのv-forでTableを表示させてみ...
    Category:

  3. 鉄道遅延情報のJSONをテーブル(表)で表示してみ...
    Category:
    Tags: JS, Reference

  4. HTMLとCSSだけで コンテンツが表示・非表示に...
    Category:

  5. WordPress 最近の投稿をドロップダウンメニ...
    Category:

Reference

NxWorld さんの記事で
詳しく書かれています。

wpp_custom_html / wpp_post

どちらのフックも
HTML出力内容を変更するものですが、

wpp_custom_htmlは、
出力を完全に制御します。

With wpp_custom_html you get full control of the HTML output.

wpp_custom_html

wpp_postは、
wpp_custom_htmlとは異なり、
（リスト全体ではなく）
各投稿の出力のみを変更します。

Unlike wpp_custom_html, this filter only changes the output of each single post (instead of the entire list).

Filters – wpp_post

Reference

NxWorld さんの記事で
詳しく書かれています。

wpp_thumbnail_compression_quality

WPPのサムネイルの画像圧縮品質を変更します。

  • $quality – 0から100までの整数値（例：85）
/**
 * Set image quality to 75 for smaller (in KBs) thumbnails.
 */
function my_wpp_thumbnail_compression_quality( $quality ){	
	return 75;
}
add_filter( 'wpp_thumbnail_compression_quality', 'my_wpp_thumbnail_compression_quality', 10, 1 );

wpp_excerpt_more

WPPによって生成された抜粋の終了文字列
（デフォルトでは省略記号）を変更します。

  • $more – 文字列
function my_wpp_excerpt_more( $more ){	
	return '[...]';
}
add_filter( 'wpp_excerpt_more', 'my_wpp_excerpt_more', 10, 1 );

結果

その他

その他の Filter hooksに関して
詳しくは
WordPress Popular Posts’ Wiki の
Filters の項目を参照してください。

貴重なお時間を割き、
最後まで
ご高覧いただきまして
有難うございました
WordPress Popular PostsのFilterを使ってみよう

filter hooksPlugins,Short Code,WordPress

Posted by FOUR 4to6