Php 如何获取要在Wordpress引导模板中使用的图像URL？

这里有functions.php和home.php代码供查看。作为参考，我的目标是使图像遵循与本文相同的规则

我使用该功能的目的是从帖子中提取第一张图片，并将其放在我博客主页的摘要上方。我已经能够从帖子中提取图像，但它没有遵循我在第60行中使用的响应类。是不是我在拉图片本身而不是URL？如何调整我的功能以使其正常工作？除了数据库连接和表单验证之外，我是一个完全的php初学者

Please see jsfiddle and pastie for code

改用

在functions.php中添加以下内容：

<?php get_header(); ?>

    <div class="row">
        <div class="col-lg-12">
            <h1 class="page-header">Blog</h1>
            <ol class="breadcrumb">
                <li><a href="###">Home</a>
                </li>
                <li class="active">Blog</li>
            </ol>
        </div>
    </div>

    <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
    <div class="row">
            <div class="col-md-1 text-center">
                <p><?php the_time('l, F jS, Y'); ?></p>
            </div>
            <?php if ( has_post_thumbnail() ) : ?>
                <div class="col-md-5">
                    <a href="<?php the_permalink(); ?>">
                        <?php the_post_thumbnail( 'large', array( 'class' => 'img-responsive img-hover' ) ); ?>
                    </a>
                </div>
            <?php endif; ?>
            <div class="col-md-6">
                <h3>
                    <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
                </h3>
                <p>by <?php the_author_posts_link(); ?>
                </p>
                <p><?php the_excerpt(); ?></p>
                <a class="btn btn-primary" href="<?php the_permalink(); ?>">Read More <i class="fa fa-angle-right"></i></a>
            </div>
        </div>
    <hr>
    <?php endwhile; ?> 
    <div class="navigation"><p><?php posts_nav_link('','&laquo; Newer Posts','Older Posts &raquo;'); ?></p></div>
    <?php else: ?>
      <p><?php _e('Sorry, there are no posts.'); ?></p>
    <?php endif; ?>

  </div>


<?php get_footer(); ?>

添加主题支持（'post thumbnails'）

这将在您的文章和页面的侧栏中启用特色图像元框。您需要为POST设置此选项。您可以将所需图像设置为特色图像，而不是将图像添加到帖子内容中

将您的home.php更新为以下内容：

<?php get_header(); ?>

    <div class="row">
        <div class="col-lg-12">
            <h1 class="page-header">Blog</h1>
            <ol class="breadcrumb">
                <li><a href="###">Home</a>
                </li>
                <li class="active">Blog</li>
            </ol>
        </div>
    </div>

    <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
    <div class="row">
            <div class="col-md-1 text-center">
                <p><?php the_time('l, F jS, Y'); ?></p>
            </div>
            <?php if ( has_post_thumbnail() ) : ?>
                <div class="col-md-5">
                    <a href="<?php the_permalink(); ?>">
                        <?php the_post_thumbnail( 'large', array( 'class' => 'img-responsive img-hover' ) ); ?>
                    </a>
                </div>
            <?php endif; ?>
            <div class="col-md-6">
                <h3>
                    <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
                </h3>
                <p>by <?php the_author_posts_link(); ?>
                </p>
                <p><?php the_excerpt(); ?></p>
                <a class="btn btn-primary" href="<?php the_permalink(); ?>">Read More <i class="fa fa-angle-right"></i></a>
            </div>
        </div>
    <hr>
    <?php endwhile; ?> 
    <div class="navigation"><p><?php posts_nav_link('','&laquo; Newer Posts','Older Posts &raquo;'); ?></p></div>
    <?php else: ?>
      <p><?php _e('Sorry, there are no posts.'); ?></p>
    <?php endif; ?>

  </div>


<?php get_footer(); ?>


博客


博客

借






has_post_缩略图（）
检查当前的
$post
是否具有特色图像集

the\u post\u缩略图（）
输出图像标签。此函数将大小作为第一个参数。我们将其设置为大，因为它应该满足您的布局

第二个参数是属性数组。我们可以使用此参数向图像添加其他类。
为什么不使用后期缩略图？这就是post缩略图的用途。我不希望有缩略图，我更希望有一个完整的图像大小在我的处置。如果查看JSFIDLE，您可以看到全尺寸图像对屏幕大小的反应方式。在>991px时，图像的大小约为原始图像的75%，但在单词thumbnail时，这是一种欺骗。将帖子缩略图视为“特色图片”，您可以使用任意大小的图片。代码比试图从内容中提取图像要简单得多。还可以向图像中添加自定义类。我建议阅读我链接到你的页面，因为它解释了如何打开帖子缩略图，以不同的大小输出它们，并添加自定义类。啊。当我最初测试post缩略图内容时，我没有大的缩略图，因此只能得到正方形的缩略图。非常感谢你！