How do I echo ACF custom fields for a WooCommerce product listing?

• pixelborder

• December 8, 2016 at 10:19 pm

I’m fairly unfamiliar with WordPress and WooCommerce loops, but I’ve got as far as I can and seem to have hit a bit of a stumbling block. Here’s what I’m trying to do…

We have an eCommerce store. I’ve altered the single product page to include an accordion which will allow me to enter in specifics about a product. This accordion has been added using the following code:

add_action( 'woocommerce_single_product_summary', 'ngt_accordion', 11 );

This works well, but it currently only echos out the static text I’ve put in as a placeholder. I’d like it to be dynamic, so I’ve created custom fields with Advanced Custom Fields and applied them to all WooCommerce products.

The trouble I’m having is referencing the custom fields in my functions.php file. I’ve tried numerous methods, but they either throw up an error, or nothing at all. Here’s my latest attempt, which shows nothing:

add_action( 'woocommerce_single_product_summary', 'ngt_accordion', 11 );

function ngt_accordion() {
 echo ' 
         <div id="ngt-accordion">
            <ul class="nav">
                <li><a href="#">Aviator\'s Notes</a>
                    <ul>
                        <li><?php the_field("aviators_notes"); ?></li>
                    </ul>
                </li>
                <li><a href="#">Product Overview</a>
                    <ul>
                        <li><?php the_field("product_overview"); ?></li>
                    </ul>
                </li>
                <li><a href="#">Size & Details</a>
                    <ul>
                        <li><?php the_field("size_and_details"); ?></li>
                    </ul>
                </li>
                <li><a href="#">Care Instructions</a>
                    <ul>
                        <li><?php the_field("care_instructions"); ?></li>
                    </ul>
                </li>
                <li><a href="#">Delivery & Returns</a>
                    <ul>
                        <li><?php the_field("delivery_and_returns"); ?></li>
                    </ul>
                </li>
            </ul>
     </div>';}

I’d be really grateful if somebody could point me in the right direction. Thanks for your time.

• pixelborder

• December 9, 2016 at 3:29 am

In case anybody was wondering, I’ve managed to fix it. Turns out it was because I was trying to echo PHP through PHP. I’ve updated the code to the following and it’s working.

add_action( 'woocommerce_single_product_summary', 'ngt_accordion', 11 );

function ngt_accordion() {
    echo '<div id="ngt-accordion">
            <ul class="nav">
                <li><a href="#">Aviator\'s Notes</a>
                    <ul>
                        <li>';

                        the_field("aviators_notes");

    echo '</li>
            </ul>
                </li>
                <li><a href="#">Product Overview</a>
                    <ul>
                        <li>';

                        the_field("product_overview");

    echo '</li>
            </ul>
                </li>
                <li><a href="#">Size & Details</a>
                    <ul>
                        <li>';

                        the_field("size_and_details");

    echo '</li>
            </ul>
                </li>
                <li><a href="#">Care Instructions</a>
                    <ul>
                        <li>';

                        the_field("care_instructions");

    echo '</li>
            </ul>
                </li>
                <li><a href="#">Delivery & Returns</a>
                    <ul>
                        <li>';

                        the_field("delivery_and_returns");

    echo '</li>
                    </ul>
                </li>
            </ul>
     </div>'
 ;}