Php wordpress插件访问帖子信息

我是wordpress插件开发的新手。我试图访问帖子信息，并根据它是否有一个特色图片，我正在创建一个幻灯片放映。但是图片url和帖子标题已经超出了我的div标签。下面是我的代码

    //function to display post info 
    function postsinfo_collage_display($attr, $content) {

    $plugins_url = plugins_url();

     $html = '<div id="pscanvas" class="row">
                    <div  class="row__inner mThumbnailScroller">';

    // The Query
    query_posts( array ('orderby' => 'date' ) );

    // The Loop
    while ( have_posts() ) : the_post();
    if ( has_post_thumbnail() ) {
        $html .= '<div class="tile">
                            <div class="tile__media">';
        $html .='<a href="'.esc_url(get_permalink()).'">';
        $html .='<img class="tile__img"';
        $html .="src='".esc_url(the_post_thumbnail_url()). "'/>";
        $html .='</a></div><div class="tile__details">
              <div class="tile__title">';
        $html .= the_title();
        $html .='</div></div></div>';        
    } 
    endwhile;
    // Reset Query
    wp_reset_query();
    $html .= '</div>
                    </div>
                    <script>
                    window.jQuery || document.write(\'<script src="minified/jquery-1.11.0.min.js"><\/script>\')
            (function($){
                $(window).load(function(){              
                });
            })(jQuery);</script>';

        return $html;

    }

//显示帖子信息的函数
函数postsinfo\u拼贴显示（$attr，$content）{
$plugins\u url=plugins\u url（）；
$html='1
';
//询问
查询帖子（数组（'orderby'=>'date'）；
//环路
while（have_posts（））：the_post（）；
如果（具有\u post\u缩略图（））{
$html.='
';
$html.='
';
$html.=_title（）；
$html.=''；
} 
结束时；
//重置查询
wp_reset_query（）；
$html.='
window.jQuery | | document.write（\'\'））
（函数（$）{
$（窗口）.load（函数（）{
});
})（jQuery）；'；
返回$html；
}

我得到的结果是：

    <div class="entry-content">
            http://localhost:9085/wordpress/wp-content/uploads/2016/04/call-of-duty-ghosts-20517-1366x768-1200x675.jpgpscanvashttp://localhost:9085/wordpress/wp-content/uploads/2016/04/Call-Of-Duty-Ghost-Background-For-Wallpaper-652-1200x675.jpgkwofkwc
        <div id="pscanvas" class="row">
         <div class="row__inner mThumbnailScroller ">
             <div id="mTS_1" class="mTSWrapper mTS_horizontal">
                 <div class="mTSAutoContainer mTSContainer" ">
                     <div class="tile">
                     <div class="tile__media">
                     <a href="http://localhost:9085/wordpress/2016/09/04/pscanvas/">
                     <img class="tile__img" src=""></a>
                     </div><div class="tile__details">
                     <div class="tile__title"></div></div></div>
                     <div class="tile"><div class="tile__media">
                     <a href="http://localhost:9085/wordpress/2016/05/03/kwofkwc/">
                     <img class="tile__img" src=""></a></div><div class="tile__details">
                     <div class="tile__title"></div></div></div>
                     </div>
                 </div>
             </div>
        </div>
            <script>
            window.jQuery || document.write('<script src="minified/jquery-1.11.0.min.js"><\/script>')
            (function($){
                $(window).load(function(){              
                });
            })(jQuery);</script>
    <strong>Album Rating:</strong> <div class="genericon genericon-star"></div><br> </div>

http://localhost:9085/wordpress/wp-content/uploads/2016/04/call-of-duty-ghosts-20517-1366x768-1200x675.jpgpscanvashttp://localhost:9085/wordpress/wp-content/uploads/2016/04/Call-Of-Duty-Ghost-Background-For-Wallpaper-652-1200x675.jpgkwkwc
试一试

$url=wp\u get\u attachment\u url（get\u post\u缩略图\u id（$post->id））；
"/>
您使用的函数直接输出图像和标题，而不是将其附加到
$html
变量。您需要切换到返回值的函数

将图像更改为：

$html .="src='".esc_url(the_post_thumbnail_url()). "'/>";

致：

标题来自：

$html .= the_title();

致：

文件：


使用：我一开始也尝试过。但输出结果是一样的。我不明白为什么url会出现在我的主pscanvas div标记中。如果我使用echo get_permalink（），同样可以正常工作。谢谢。更改为：$imgurl=wp_get_attachment_url（get_post_thumbnail_id（））；$postrl=get_permalink（）；$title=the_title（）$html.='；$html.='；$html.='.$title.''；url运行正常，但标题仍然位于同一位置。此外，当我单击图像时，有一个锚，它应该会打开链接页面，但不会发生。谢谢Haring，它起作用了。请查看我的上述评论并帮助我处理标题。谢谢Nathan的解释原因。当我点击锚时，你能帮我做点什么吗？很高兴我能帮你：）至于锚，我恐怕有太多的可能给你明确的方向。你用JavaScript做了什么吗？控制台中有错误吗？你检查了元素检查器中的链接是否正确显示了吗？是吗您可以通过某种方式对其进行样式设置，以防止其被单击，例如在其顶部放置另一个元素。用于在代码中加载jQuery的代码需要顺带一提。WordPress为您提供了它。明白了锚定标记应该覆盖整个div标记。只需将锚定移到pscanvas div上方。非常感谢：）。
$html .= "src='" . esc_url( get_the_post_thumbnail_url() ) . "'/>";

$html .= the_title();

$html .= get_the_title();