使用 WP_Query 显示来自 Wordpress 的内容会破坏页面 CSS，如果没有，内容不会显示答案

【问题标题】：Showing content from Wordpress ruins page CSS using WP_Query, without, content does not show使用 WP_Query 显示来自 Wordpress 的内容会破坏页面 CSS，如果没有，内容不会显示
【发布时间】：2015-03-12 05:18:54
【问题描述】：

我想我在这里有两个方面的问题。我正在尝试在我自己的网站上显示 wordpress 帖子。我有一个页面，人们可以在其中查看文章列表，然后当他们单击一个时，它会将他们带到文章页面（我用自己的模板替换了标准 index.php，以便帖子显示我想要的方式）。然而，在这个页面上，问题开始了。

问题一

使用时

<? if ( $wp_query->have_posts() ) : while ( $wp_query->have_posts() ) : $wp_query->the_post(); ?> 显示了内容，但显然它与 CSS 混淆了，因为事情被移到了不合适的位置。不过……

问题二

不知何故，当我尝试不使用 wp_query 时，页面仍然显示正确的帖子标题，但没有内容。

有没有办法-a。让 wp_query 停止弄乱我的 css OR b。无需 wp-query 即可获取内容，就像我设法获取标题一样。

任何帮助将不胜感激。干杯！

不确定您是否需要它，但这是用于在单击并被定向到“文章”之前显示“新闻”上的帖子列表的循环

<?php $paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$args=array(
   'post_type'=>'post',
   'posts_per_page' => 7,
   'paged'=>$paged
);
$temp = $wp_query;
$wp_query= null;
$wp_query = new WP_Query($args);


/* PageNavi at Top */
if (function_exists('wp_pagenavi')){wp_pagenavi();}
if ( $wp_query->have_posts() ) : while ( $wp_query->have_posts() ) : $wp_query->the_post();   
?>
<div class="clearfix colelem" id="pu6783"><!-- group -->
       <div class="museBGSize grpelem" id="u6783"><!-- simple frame --></div>
       <div class="clearfix grpelem" id="pu6785"><!-- column -->
        <div class="clearfix colelem" id="u6785"><!-- group -->
         <div class="clearfix grpelem" id="u6786-4"><!-- content -->
          <p id="u6786-2"><span id="u6786"><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></span></p>
         </div>
        </div>
        <div class="clearfix colelem" id="u6784-4"><!-- content -->
         <p><?php the_excerpt(); ?><a href="<?php the_permalink() ?>">...[Read More]</a></p>
        </div>
       </div>
      </div>
      <div class="colelem" id="u6781"><!-- simple frame --></div>
<?
endwhile; endif;
/* PageNavi at Bottom */
if (function_exists('wp_pagenavi')){wp_pagenavi();}
$wp_query = null;
$wp_query = $temp;
wp_reset_query(); ?>

如果需要，这里是“文章”上的代码块

<? if ( $wp_query->have_posts() ) : while ( $wp_query->have_posts() ) : $wp_query->the_post();   ?>

     <div class="shadow clearfix grpelem" id="u4483"><!-- group -->
      <div class="clearfix grpelem" id="pu4645"><!-- column -->
       <div class="clearfix colelem" id="u4645"><!-- group -->
        <div class="clearfix grpelem" id="u4646-4"><!-- content -->
         <p id="u4646-2"><span id="u4646"><?php the_title(); ?></span></p>
        </div>
       </div>
       <div class="museBGSize colelem" id="u4643"><!-- simple frame --></div>
       <div class="clearfix colelem" id="u4620-4"><!-- content -->
        <p id="u4620-2"><span id="u4620"><?php the_title(); ?></span></p>
       </div>
       <div class="clearfix colelem" id="u4642-4"><!-- content -->
        <p id="u4642-2"><span id="u4642"></span></p>
       </div>
       <div class="clearfix colelem" id="u4644-4"><!-- content -->
            <p><?php the_content(); ?></p>
       </div>
       </div>
       <div class="colelem" id="u5632"><!-- custom html -->
<? endwhile; endif; ?>

在你问之前，是的，页面正在加载 wp-blog-header 和 wp-load :)

【问题讨论】：

你的 html 看起来很乱。您使用需要在某个阶段关闭的新 div 完成循环，然后所有进一步的迭代都在这个新 div 内。顺便说一句，muse 不是 wordpress 的理想选择，除非您取消所有以前的样式，99% 的时间 muse css 文件将重新定义 html 正文标签等。

标签： php html css wordpress loops

【解决方案1】：

为什么你这么痛苦，只需要使用原生 wordpress 的 while 循环：

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

   // your content goes here

<?php endwhile endif; ?>

让 wordpress 发挥作用，这将显示您的内容以及正确的 css。

【讨论】：