如何在现有项目中使用WordPress显示博客图片

时间:2017-07-26 作者:vinay

我已经开发了一个使用html和php的网站。为了显示博客详细信息,我使用了wordpress。但是我只能显示内容,没有任何图像。Plz指导我如何编写代码以在首页显示博客图像。

code used to display recent blog details which is in index.php
<?php 
define(\'WP_USE_THEMES\', false);
require(\'blog/wp-blog-header.php\');
?>




    <!-- Blog Section-->
<section id="blog"> 
<?php

$number_of_posts = 3;
$args = array( \'numberposts\' => $number_of_posts );
$recent_posts = wp_get_recent_posts( $args );
foreach( $recent_posts as $recent_post ){
echo "<span>".$recent_post[\'post_date\']."</span> <br>";
echo "<h3>".$recent_post[\'post_title\']."</h3>";


echo  "<p>".$recent_post[\'post_content\']."</p><br><br>";

}

?>
</section>
输出为

blog details

1 个回复
SO网友:Johansson

简短回答:不要这样做!即使昨天你说明天!

在其他文件中包含WordPress的核心是您最不想做的事情。相反,使用Ajax方法并使用REST端点填充内容。

您需要先注册rest路由。为此,请将这段代码添加到主题的functions.php:

add_action( \'rest_api_init\', function () {
    register_rest_route( \'vinay\', \'/ajax_blog/\', array(
            \'methods\' => \'GET\', 
            \'callback\' => \'blog_ajax_function\' 
    ) );
});
// Now, you can do your query inside a callback function:
function blog_ajax_function(){
    $recent_posts = wp_get_recent_posts( $args, OBJECT );
    foreach ( $recent_posts as $post=>$value ) {
        $data[$post][\'title\'] = get_the_title( $value->ID );
        $data[$post][\'date\'] = get_the_date( \'Y-m-d H:i:s\', $value->ID );
        $data[$post][\'permalink\'] = get_the_permalink( $value->ID );
        $data[$post][\'thumbnail\'] = get_the_post_thumbnail_url( $value->ID );
    }
    return $data;
}
现在,您可以通过访问获得包含标题、日期和最近帖子缩略图的JSON响应wp-json/vinay/ajax_blog/. 是时候把它们添加到我们的页面了。

让我们将一个操作绑定到页面加载,并用奇特的泡沫帖子填充页面,就像海绵宝宝所做的那样!这将放在静态网站的HTML文件中(通过删除并使用此文件替换问题中的代码),不要忘记更改example.com 到您的域!

<section id="blog"><div id="container-div"></div></section>
<script>
(function(){
    $.ajax({
        type: \'GET\', 
        url: \'http://example.com/wp-json/vinay/ajax_blog\', 
        dataType: \'json\',
        success: function (data) {
            if (data != null) {
                $.each(data, function(index, element) {
                    $(\'#container-div\').append(\'<a href="\'+element.permalink+\'"><img src="\'+element.thumbnail+\'" alt="\'+element.title+\'"/><span>\'+element.title+\'</span>\' +element.date+ \'</a>\');
                });
            }
        }
    });
})(jQuery);
</script>
这将自动将可单击的最近帖子列表附加到<div id="container-div"></div> 我们在HTMl中创建以在页面加载时包含帖子。

全部完成。

结束

相关推荐

$wbdb函数是否可以在不加载wp_load.php的wp中使用

如果我想在wp站点上添加对db的访问权。。我知道使用$wpdb global肯定更简单。。这是否允许您在不包含wp\\U负载的情况下访问站点。根目录中的php文件。。我想如果你已经激活了wp,它可能会很好。。但我猜测,如果您没有运行wp,那么您可能必须将其作为最小值加载。。有人知道吗。我已经试过了,即使通过wp页面运行,它仍然需要wp加载。php是正常的。