Wordpress 高级自定义字段内联背景答案

【问题标题】：Wordpress advanced custom fields inline backgroundWordpress 高级自定义字段内联背景
【发布时间】：2015-10-23 04:47:59
【问题描述】：

使用 inline-css 与高级自定义字段链接背景图像时遇到问题。

这是我所在的位置：

HTML

<?php
/*
Template Name: Home Page
*/

//Advanced Custom Fields
$header_image                =  get_field('header_image');
$header_image_text           =  get_field('header_image_text');

get_header(); ?>

...

<div class="carousel-inner">

  <?php if( !empty($header_image) ) : ?>
    <div class="item active" style="background: url( <?php echo $header_image['url']; ?> )">
  <?php endif; ?>

  <?php if( !empty($header_image_text) ) : ?>
    <div class="container"><img src="<?php echo $header_image_text['url']; ?>" alt="<?php echo $header_image_text['alt']; ?>"></div>
  <?php endif; ?>

</div>

...

在我的字段设置中，$header_image 和 $header_image_text 返回值设置为图像对象。

谢谢。

解决方案：

使用 Maulik patel 的答案，但将 $header_image_new 值更改为 ''.$header_image["url"].'';

【问题讨论】：

你能不能也给我们看看图片对象？
你能不能像print_r($header_image); print_r($header_image_text); die;那样做，让我知道它返回了什么？
您能否向我们展示您为.item.active 元素设置的其余CSS 样式代码？此外，您应该尝试使用 get_field 函数的第二个参数（帖子 ID）。只是为了确保它正在为正确的帖子加载字段。

标签： php wordpress

【解决方案1】：

<?php
/*
Template Name: Home Page
*/

//Advanced Custom Fields
$header_image                =  get_field('header_image');
$header_image_text           =  get_field('header_image_text');
$header_image_new='"'.$header_image["url"].'"';
get_header(); ?>

...

<div class="carousel-inner">

  <?php if( !empty($header_image) ) : ?>
    <div class="item active" style="background: url( <?php echo $header_image_new; ?> )">
  <?php endif; ?>

  <?php if( !empty($header_image_text) ) : ?>
    <div class="container"><img src="<?php echo $header_image_text['url']; ?>" alt="<?php echo $header_image_text['alt']; ?>"></div>
  <?php endif; ?>

</div>

【讨论】：