Question

我有以下用于在页面上显示自定义帖子的短代码：

add_shortcode( 'page-section', 'page_section_shortcode' );
function page_section_shortcode( $atts ) {
    global $post;
    $post_slug=$post->post_name;
    $a = shortcode_atts( array(
        'post-name' => 'qwerty',
        'bg-color' => 'white'
    ), $atts );
    $post_slug=$post->post_name;
    $post_name = $a['post-name'];
    $query = new WP_Query( array(
        'post_type' => 'page_section',
        'name' => $post_name,
    ) );
    if ( $query->have_posts() ) { ?>
        <?php while ( $query->have_posts() ) : $query->the_post(); ?>
            <div style="background-color: <?php echo $a['bg-color']; ?>" id="<?php global $post; $post_slug=$post->post_name; echo $post_slug; ?>" class="page-section">
                <div class="row">
                    <?php the_content(); ?>
                </div>
            </div>
        <?php endwhile;
        wp_reset_postdata(); ?>

    <?php $myvariable = ob_get_clean();
    return $myvariable;
    }
}

一切都按我想要的方式运作，我可以在自定义帖子中设置内容，并使用简短的代码将内容拉到页面中。

问题是使用短代码拉入的内容始终位于页面顶部。连续使用多个短代码，他们保持订单，但页面上的任何其他内容都显示在底部（在所有短代码内容下面）。

我尝试删除了回声＆＃39;正如另一个stackoverflow帖子中所建议但似乎无法找到我做错了什么。

Answer 1

将代码替换为此代码。此代码返回生成的html，因此它不会在页面顶部回显

add_shortcode( 'page-section', 'page_section_shortcode' );
function page_section_shortcode( $atts ) {
    global $post;
    $post_slug=$post->post_name;
    $a = shortcode_atts( array(
        'post-name' => 'qwerty',
        'bg-color' => 'white'
    ), $atts );
    $post_slug=$post->post_name;
    $post_name = $a['post-name'];
    $query = new WP_Query( array(
        'post_type' => 'page_section',
        'name' => $post_name,
    ) );
    $returnhtml = '';
    if ( $query->have_posts() ) { 
        while ( $query->have_posts() ) : $query->the_post();
            global $post; 
            $returnhtml .= '<div style="background-color: '. $a['bg-color'].'" id="'.$post->post_name.'" class="page-section">';
                $returnhtml .= '<div class="row">'.get_the_content().'</div>';
            $returnhtml .= '</div>';
        endwhile;
        wp_reset_postdata();            
    return $returnhtml;
    }
}

Answer 2

function header_notification()
{   
    echo '<div><strong>Any html goes here</strong></div>';
    
}
add_action('wp_head', 'header_notification');

Wordpress短代码始终位于页面顶部

2 个答案: