在 WooCommerce 产品页面中显示带有标签和值的自定义字段?

Posted

技术标签:

【中文标题】在 WooCommerce 产品页面中显示带有标签和值的自定义字段?【英文标题】:Display Custom fields with labels & values in WooCommerce prodcut page? 【发布时间】:2021-12-09 17:39:26 【问题描述】:

我对 php 不是很好,目前在尝试使用 Advanced Custom Feilds 重新创建如下显示的网格时确实遇到了麻烦 - 我的 Feild 组的图片https://ibb.co/sH4jvLv

标签在左侧,字段在右侧的布局。

我正在尝试使用 Advanced Custom Feilds 在标签后更好地组装 WooCommerce 单一产品页面。帖子类型已设置为产品并输入了值 - 但我一生都无法理解如何同时显示标签和值,而如果值为空则留空。

已添加到 functions.php,但我感觉我要么接近要么一英里。

任何帮助将不胜感激。

代码:

add_action( 'woocommerce_after_single_product', 'property_overview_field', 3 );
  
function property_overview_field()  ?>
 
<?php 

<?php if ( $guide_price != '' || $property_category != '' || $property_type != '' || $bedroom != '' || $bathroom != '' || $listing_status != '' || $city != '' || $county != '' || $location != '' || $epc_rating !='' )  ?>
                    
<div class="property-overview">

    <ul>
        <?php
            if( $guide_price != '')  ;?>
        <li>
            <?php echo $field['label']; ?>:
            <strong><?php echo $field['value']; ?></strong>
        </li>
         <?php
            if( $property_category != '')  ;?>
        <li>
            <?php echo $field['label']; ?>:
            <strong><?php echo $field['value']; ?></strong>
        </li>
         <?php
            if( $property_type != '')  ;?>
        <li>
            <?php echo $field['label']; ?>:
            <strong><?php echo $field['value']; ?></strong>
        </li>
         <?php
            if( $bedroom != '')  ;?>
        <li>
            <?php echo $field['label']; ?>:
            <strong><?php echo $field['value']; ?></strong>
        </li>
    </ul>
</div>
<?php      

CSS

.property-overviewmargin: 0px 0px 30px 0px;padding: 0px;display: flex; .property-overview ul background: #fff;box-shadow: 0 2px 4px rgba(0,0,0,.1);padding: 12px 20px !important; width: 100%;margin-top: 0; margin-bottom: 10px;list-style: none !important; .single-pro_estate .property-overview li border-bottom: 1px dashed #ddd;clear: left;float: left;line-height: 40px; width: 48%; .property-overview ul li span font-weight:600; .property-overview li strong.emphasize color: #666;font-weight: 600; .property-overview li strong float:right; .property-overview li:nth-child(2n) float: right; clear: right;

【问题讨论】:

您能提供自定义字段 slugs 吗? @Bhautik 订单“字段标签”字段名称“字段类型----------------1”指导价格“guide_price”文本2“属性类​​别”property_category “文本 3” 物业类型 “property_type” “文本 4” “卧室” “卧室” “文本 5” “浴室” “浴室” “ 文本 6” 房源状态 “listing_status” “文本 7” 位置 “位置” “文本 8” “城市” “城市” “文本 9” “县”县“文本 10”EPC 评级“epc_rating”文本 菲尔德集团ibb.co/sH4jvLv图片 【参考方案1】:

检查以下代码。您可以使用 ACF get_field() 获取数据。

add_action( 'woocommerce_after_single_product', 'property_overview_field', 3 );
function property_overview_field()  
    ?>                  
    <div class="property-overview">
        <ul>
            <li>
                Guide Price
                <strong><?php echo get_field('guide_price'); ?></strong>
            </li>
            <li>
                Property Category
                <strong><?php echo get_field('property_category'); ?></strong>
            </li>
            <li>
                Property Type
                <strong><?php echo get_field('property_type'); ?></strong>
            </li>
            <li>
                Bedroom
                <strong><?php echo get_field('bedroom'); ?></strong>
            </li>
            <li>
                Bathroom
                <strong><?php echo get_field('bathroom'); ?></strong>
            </li>
            <li>
                Listing Status
                <strong><?php echo get_field('listing_status'); ?></strong>
            </li>
            <li>
                Location
                <strong><?php echo get_field('location'); ?></strong>
            </li>
            <li>
                City
                <strong><?php echo get_field('city'); ?></strong>
            </li>
            <li>
                County
                <strong><?php echo get_field('county'); ?></strong>
            </li>
            <li>
                EPC Rating
                <strong><?php echo get_field('epc_rating'); ?></strong>
            </li>
        </ul>
    </div>
    <?php 

【讨论】:

以上是关于在 WooCommerce 产品页面中显示带有标签和值的自定义字段?的主要内容,如果未能解决你的问题,请参考以下文章

Woocommerce 产品标签(显示其他产品)

在 Woocommerce 的产品页面中隐藏特定标签

使用简码显示为产品设置的 WooCommerce 产品标签名称

在woocommerce shop page中显示产品标签描述

WooCommerce 类别/标签存档-“未找到产品”

仅在 WooCommerce 中获取当前产品的产品标签