web-dev-qa-db-ja.com

フロントページにカスタム投稿タイプを追加する方法

私は自分のプロジェクトを表示するためにカスタム投稿タイプを使ってWordPressでポートフォリオを作成しようとしています。私が静的なフロントページにサムネイルとして注目の画像と共に表示したいそれぞれのプロジェクト、そしてサムネイルをクリックすることによって私は直接プロジェクトに連れて行くでしょう。

カスタム投稿タイプを静的フロントページに投稿する方法を教えてください。最新の6件の投稿のみを表示したいのですが、それからナビゲーションを介して残りの記事にリンクを張ることになります。

1
Xero1

wpse_242473_custom_post_typeという名前のCPTを登録している場合は、これを使用して、そのタイプの最近の投稿を静的フロントページ(または任意の場所)に投稿できます。あなたはショートコードまたはテンプレートタグを使うことができます、そして、機能は両方のために働くべきです。

それは私が多くのサイトで使っているいくつかのコードの修正です。あなたのテーマのfunctions.phpに入れてください。もちろん、自分に合うようにHTMLを変更します。

私はしばらくの間試してみることを意味していたというねじれを追加しました。私が追加したのは、ショートコードとテンプレートタグの両方に対して同じ関数を機能させるためのオプション引数のフルセットです。 [recentposts]を任意のページのビジュアルエディタに入れることも、<?php wpse_242473_recent_posts(); ?>をテーマの任意のテンプレートに入れることもできます。

静的フロントページのテンプレートに入れるには、テンプレートfront-page.phpを編集(または作成)します。これは静的なフロントページに自動的に選択されます。ページ編集画面内で選択する必要はありません。

function wpse_242473_recent_posts( $atts = null, $content = null, $tag = null ) {

    $out = '';

    $args = array( 
        'numberposts' => '6', 
        'post_status' => 'publish', 
        'post_type' => 'wpse_242473_custom_post_type' ,
    );

    $recent = wp_get_recent_posts( $args );

    if ( $recent ) {

        $out .= '<section class="overview">';

        $out .= '<h1>Recent Projects</h1>';

        $out .= '<div class="overview">';

        foreach ( $recent as $item ) {

            $out .= '<a href="' . get_permalink( $item['ID'] ) . '">';
            $out .= get_the_post_thumbnail( $item['ID'] ); 
            $out .= '</a>';
        }

        $out .= '</div></section>';
    }

    if ( $tag ) {
        return $out;
    } else {
        echo $out;
    }

}

add_shortcode( 'recentposts', 'wpse_242473_recent_posts' );

それはあなたが望む投稿を簡単に検索することです。

foreachループはあなたのHTMLを構築し、それから最後の条件はショートコードを使った場合はHTMLを返すか、テンプレートタグとして関数を呼び出した場合はそれをエコーし​​ます。

Web上の多くの記事には示されていませんが、3番目の引数はすべてのショートコードハンドラに渡されます。ショートコードを使うとき、それはショートコード名を含みます、それでハンドラーは理論的に複数のショートコードを扱うことができます。この場合は、その関数が実際にショートコードハンドラとして呼び出されたかどうかを判断するために使用しています。

1

編集:この答えはOPが静的フロントページを持っていることに気づく前に書かれました。 他の人にとって役に立つようにここに置いておき、静的フロントページの場合に対する2番目の答えを追加しました。

これはあなたのカスタム投稿タイプをホームページのメインループに追加します。

add_action( 'pre_get_posts', 'wpse_242473_add_post_type_to_home' );

function wpse_242473_add_post_type_to_home( $query ) {

    if( $query->is_main_query() && $query->is_home() ) {
        $query->set( 'post_type', array( 'post', 'your_custom_post_type_here') );
    }
}

is_homeをチェックすると、メインのブログの「ホーム」ページにいることが確認され、is_main_queryによって、誤って二次ループに影響を与えることがなくなります。

カスタム投稿タイプのみが必要で、通常の投稿タイプは必要ない場合は、投稿タイプの配列からpostを削除します。

このアクションをフィルタとして扱うWeb上の不正確な記事がいくつかあります。そうではありません。クエリ引数を直接設定できるように、参照によってクエリを渡します。

3

次の手順に従います。
1)CPTのテンプレートを作成します(カスタム投稿タイプ)
2)そのテンプレートに以下のコードを入れます。 CPTをあなたのCPTに置き換えます。
3)新しいページを開き、右側からこのテンプレートを選択して新しいページを公開します。
4)最後に、設定に進み、読みをクリックしてから静的ページの下のフロントページを選択します。

コード:

<?php
/**
 *Template Name:CPT
 * @package CPT 
 * @since CPT  1.0
 */ 
get_header(); 

global $paged;  
    if( get_query_var( 'paged' ) ) {
        $paged = get_query_var( 'paged' );
    } elseif( get_query_var( 'page' ) ) {
        $paged = get_query_var( 'page' );
    } else {
        $paged = 1;
    }

    $args = array(
        'post_type'     => 'CPT',
        'posts_per_page'=>6,
        'paged'         => $paged,
    );

    $query = new WP_Query($args);
?>

<?php if ( $blog_query->have_posts() ) : ?>
                            <?php while ( $query->have_posts() ) : $query->the_post(); ?>
                                <div class="post-thumbnail">
                                      <?php if (  (function_exists('has_post_thumbnail')) && (has_post_thumbnail())  ) {?>
                                          <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
                                           <?php the_post_thumbnail(); ?>  
                                          </a>
                                        <?php }
                                      ?>
                                </div>

                            <?php endwhile; ?>
<?php endif; ?>

<?php get_footer(); ?>
0
bdtheme