Wordpress中的动态首页图片

Question

我正在为我的一个好朋友建立一个网站，但我一直坚持下去。 我想要主页上的自适应背景图像，以便他可以在wordpress管理页面的自定义页面上对其进行自定义。 我的代码现在看起来像这样：

get_header(); ?>

<div id="slides">
<div class="slides-container">

    <img src="<?php bloginfo('template_directory'); ?>/images/Home.jpg" alt="Cinelli">

</div>

<nav class="slides-navigation">
  <a href="#" class="next"> <img src="<?php bloginfo('template_directory'); ?>/images/right.png" alt="left"></a>
  <a href="#" class="prev"> <img src="<?php bloginfo('template_directory'); ?>/images/left.png"alt="right"></a>
</nav>

</div>

  <div class="welcometext">
    <h1><?php echo get_bloginfo( 'name' );?></h1>

   <?php echo bloginfo('description');?>      

  </div>

<?php get_footer(); ?>

现在，图像标签需要适应性强。 这可能吗？

Answer 1

从WordPress页面的“特色图像”中提取图像比使用“自定义”页面更容易。

要启用Featured Images，请将此行添加到主题的functions.php文件中： add_theme_support( 'post-thumbnails' );

现在将图像上传到WordPress页面的“特色图像”区域。 该页面可以是任何页面，您只需要记下页面的ID即可。 要获取页面ID，请转到页面的编辑屏幕，然后在浏览器中查看URL。 它将以post.php?post=34&action=edit类的结尾，其中post=后的数字是页面的ID，在此示例中为34。

现在修改您的图像代码：

<?php $feat_image = wp_get_attachment_url( get_post_thumbnail_id(34, 'full') ); // replace '34' with your Page's ID ?>
<img src="<?php echo $feat_image; ?>" alt="Cinelli">

用页面的ID替换34 。 如果在循环中使用此代码，则可以用$post->ID替换34 。

第一行中的'full'告诉它要使用的图像尺寸。 “完整”将使用您上传的原始图像，也可以使用“大”，“中”，“缩略图”或您设置的任何自定义图像尺寸。