web-dev-qa-db-ja.com

タブへのショートコード挿入

私は、投稿タイプのカスタムカテゴリのショートコードを使用してスタッフを表示するプラグインを作成しました。例えば。 [board-members term = "team1"]これは問題なく動作しますが、ページまたは投稿に対してのみ有効です。ショートコードをタブに貼り付けると（Justin Tadlockのホイッスルを使用）、プロファイルはタブの外側、ページ本文のタブの上に表示されます。タブ内に表示させるにはどうすればいいですか。これはコードです...

require_once(dirname(__FILE__).'/post-type.php'); //file that registers CPT

function wporg_shortcodes_init(){
function wporg_shortcode($atts = []) {
     extract( shortcode_atts( array(
        'term' => 'columns'
    ), $atts ) );

    $custom_taxonomy = $atts['term'];       

    // add query of custom post type board_members      
            $recentPosts = new WP_Query
            (array('posts_per_page' => -1, 'post_type' => array('board_members'), 'columns' => $custom_taxonomy ));              
            while( $recentPosts->have_posts() ) :  $recentPosts->the_post();  ?>

                    <div class="b-thumb"><?php the_post_thumbnail('thumbnail') ?></div>
                    <p class="b-info">
                    <span class="b-name"><?php the_title(); ?></span><br />                                       
                    <span class="b-country"><?php the_field('country'); ?></span><br />
                    <span class="b-position"><?php the_field('position'); ?></span><br />
                    <span class="b-content"><?php printf(get_the_content()); ?></span><br />
                </p>                

                <?php wp_reset_postdata(); ?>         
        <?php endwhile; ?>      
   <?php        

    }
   add_shortcode('board-members', 'wporg_shortcode');
  }
 add_action('init', 'wporg_shortcodes_init');

ありがとう

custom-post-typespluginsshortcodetabs
1
Artus

ショートコードの内容をob_start()とreturn ob_get_clean()でラップする必要があるようです。

require_once(dirname(__FILE__).'/post-type.php'); //file that registers CPT

function wporg_shortcodes_init(){
function wporg_shortcode($atts = []) {
     extract( shortcode_atts( array(
        'term' => 'columns'
    ), $atts ) );

    $custom_taxonomy = $atts['term'];       

    ob_start(); // <- works like magic

    // add query of custom post type board_members      
            $recentPosts = new WP_Query
            (array('posts_per_page' => -1, 'post_type' => array('board_members'), 'columns' => $custom_taxonomy ));              
            while( $recentPosts->have_posts() ) :  $recentPosts->the_post();  ?>

                    <div class="b-thumb"><?php the_post_thumbnail('thumbnail') ?></div>
                    <p class="b-info">
                    <span class="b-name"><?php the_title(); ?></span><br />                                       
                    <span class="b-country"><?php the_field('country'); ?></span><br />
                    <span class="b-position"><?php the_field('position'); ?></span><br />
                    <span class="b-content"><?php printf(get_the_content()); ?></span><br />
                </p>                

                <?php wp_reset_postdata(); ?>         
        <?php endwhile; ?>      
   <?php        

   return ob_get_clean(); // <- more magic

    }
   add_shortcode('board-members', 'wporg_shortcode');
  }
 add_action('init', 'wporg_shortcodes_init');

ショートコードを修正して単一の文字列を返すこともできます。次のものも同様に機能します。

function wporg_shortcodes_init(){
  function wporg_shortcode($atts = []) {
     extract( shortcode_atts( array(
        'term' => 'columns'
    ), $atts ) );

    $custom_taxonomy = $atts['term'];       

    $output = '';

    // add query of custom post type board_members      
    $recentPosts = new WP_Query
    (array('posts_per_page' => -1, 'post_type' => array('board_members'), 'columns' => $custom_taxonomy ));              
    while( $recentPosts->have_posts() ) :  $recentPosts->the_post();

        $output .= '<div class="b-thumb">'.the_post_thumbnail('thumbnail').'</div>';
        $output .= '<p class="b-info">';
          $output .= '<span class="b-name">'.the_title().'</span><br />';
          $output .= '<span class="b-country">'.the_field('country').'</span><br />';
          $output .= '<span class="b-position">'.the_field('position').'</span><br />';
          $output .= '<span class="b-content">'.printf(get_the_content()).'</span><br />';
        $output .= '</p>                ';

    endwhile;

    wp_reset_postdata();

    return $output;

  }
 add_shortcode('board-members', 'wporg_shortcode');
}
add_action('init', 'wporg_shortcodes_init');
2
admcfajn

コンテンツを特定の場所に表示したい場合は、コンテンツを 'class'で<div>にラップする必要があります。ここで、 'class'にはコンテンツを表示するのに必要なCSSがあります。

ショートコードはページ/投稿のコンテンツ内、投稿コンテンツを囲む<div>内に含まれるため、ショートコードはページ/投稿に対して機能します。

あなたは（ 'myshortcode'と呼ばれる）クラスを作り、それをあなたのループで使う必要があるでしょう：

<div class='myshortcode'>
 <div class="b-thumb"><?php the_post_thumbnail('thumbnail') ?></div>
                    <p class="b-info">
                    <span class="b-name"><?php the_title(); ?></span><br />                                       
                    <span class="b-country"><?php the_field('country'); ?></span><br />
                    <span class="b-position"><?php the_field('position'); ?></span><br />
                    <span class="b-content"><?php printf(get_the_content()); ?></span><br />
</div>

それから、その新しいクラスのためのいくつかのCSS：

.myshortcode {
   /* some CSS here */
}
0
Rick Hellewell