将最近的 Wordpress 帖子、特色图片和摘录添加到 HTML 站点答案

【问题标题】：Adding recent Wordpress post, with featured image and excerpts to HTML site将最近的 Wordpress 帖子、特色图片和摘录添加到 HTML 站点
【发布时间】：2017-10-09 20:07:53
【问题描述】：

我在几个论坛上研究过这个问题，并在这里找到了最相关的答案：Add "Recent Posts" from a wordpress blog to a html static page。

我正在寻找的是对此答案的扩展，它将允许我包含特色图片和 post_excerpt。我搜索了谷歌和这个论坛，但无济于事。如果您能提供任何帮助，我们将不胜感激。

我的目标是在我的 HTML 网站上包含一个 RSS 类型的提要，该提要来自我的博客，它位于我网站的子目录中。

前面提到的 PHP sn-p 非常适合显示和链接到最近的帖子，但是，我想在提要中同时显示精选帖子图片和帖子摘录。

【问题讨论】：

标签： html wordpress rss feed

【解决方案1】：

我找到了这个问题的答案，并希望与社区分享。希望其他人会发现它有用。

这是我们用来产生预期效果的代码：

<section class="feed float-right">
    <h3>The Latest From Our Blog</h3>
<?php

include('blog/wp-load.php'); // Blog path

$args = array('showposts' => 4);

$the_query = new WP_Query( $args );

if( $the_query->have_posts() ): 

echo '<ul>';

while ( $the_query->have_posts()) : $the_query->the_post(); 
    echo '<li><a href="'.get_the_permalink().'">'.get_the_post_thumbnail().' '.get_the_title().'</a> <p>'.get_the_excerpt($limit).'</p></li>';
endwhile; 

echo '</ul>';

endif; 

wp_reset_query(); 

?>

</section>

以上代码放置在您希望显示提要的 HTML 或 PHP 页面中。我们在这个实现中使用了部分，但 div 也可以工作。样式信息如下：

.feed {
  width: 100%;
  height: 350;
  padding-bottom: 25px;
}

.feed h3 {
  width: 90%;
  margin: 20px auto;
  padding-left: 35px;
  font-family: 'Open Sans Condensed', sans-serif;
  font-size: 23px;
  font-weight: 400;
  color: #fff;
}

.feed ul {
  width: 90%;
  margin: auto;
  list-style: none;
  font-family: 'Open Sans Condensed', sans-serif;
  font-size: 15px;
  font-weight: 400;
  color: #fff;
}

.feed ul li {
  position: relative;
  float: left;
  width: 45%;
  margin-bottom: 30px!important;
  margin-right: 5%;
}

.feed ul li a {
  color: inherit;
}

.feed ul li p {
  line-height: 18px;
}

.attachment-post-thumbnail {
  position: relative;
  float: left;
  width: 140px!important;
  height: 90px!important;
  margin: auto 30px 30px auto;
  border-radius: 4px;
}

您可以在此处查看最终结果：https://www.moverspalmbeachcounty.com/

【讨论】：