Do I need to use css to style this table or is something wrong with my php?

[Isaac Russell]

I’m trying to create a a menu with Advanced custom fields. But can’t seem to display the data like the tutorial. I thought it would at least show up in column somewhat like a table and then I could just add a border with coloring in css. Any suggestions would be greatly appreciated. Thanks!

This is the live site:

ogitsfresh.com/demo/

This is tutorial I’m basing it off of:
https://www.youtube.com/watch?v=VBVum5VoYKE
See 11:05 in video to see what I’m trying to achieve.

Here’s a broken down html version on codepen: http://codepen.io/isaac/pen/ZQdwBX

I would really like to see it display like in the tutorial. In a table like fashion.

Here’s my code:

<?php
/**
* This file adds a file for demo purposes eactly like the Home Page to the Outreach Pro Theme.
*
* @author StudioPress
* @package Outreach Pro
* @subpackage Customizations
*/

/*
Template Name: Demo
*/

add_action( ‘genesis_meta’, ‘outreach_home_genesis_meta’ );
/**
* Add widget support for homepage. If no widgets active, display the default loop.
*
*/
function outreach_home_genesis_meta() {

`if ( is_active_sidebar( ‘home-top’ ) || is_active_sidebar( ‘home-bottom’ ) ) {

`//* Force full-width-content layout setting
add_filter( ‘genesis_pre_get_option_site_layout’, ‘__genesis_return_full_width_content’ );

//* Add outreach-pro-home body class
add_filter( ‘body_class’, ‘outreach_body_class’ );

//* Remove breadcrumbs
remove_action( ‘genesis_before_loop’, ‘genesis_do_breadcrumbs’ );

//* Add home top widgets
add_action( ‘genesis_loop’, ‘outreach_home_top_widgets’ );

//* Add home bottom widgets
add_action( ‘genesis_before_footer’, ‘outreach_home_bottom_widgets’, 1 );
`

}
`

}

function outreach_body_class( $classes ) {

$classes[] = 'outreach-pro-home';
return $classes;

}

function outreach_home_top_widgets() {

genesis_widget_area( 'home-top', array(
'before' => '<div>',
'after' => '</div>',
) );

}

function outreach_home_bottom_widgets() {

genesis_widget_area( 'home-bottom', array(
'before' => '<div><div>',
'after' => '</div></div>',
) );

}

remove_action( ‘genesis_loop’, ‘genesis_do_loop’ );
add_action( ‘genesis_loop’, ‘your_custom_loop’ );

function your_custom_loop() {

if(have_posts()) : while(have_posts()) : the_post();
/* The following code displays the Advanced Custom Fields */
//* Adds acf
echo '<div> ' . get_field('delivery_date') . ' </div>';
echo '<div> ' . get_field('order') . ' </div>';
echo '<div> ' . get_field('horizon') . ' </div>';
echo '<div> ' . get_field('now_available') . ' </div>';
endwhile;
endif;

// check if the repeater field has rows of data
if( have_rows(‘menu_sections’) ):
// loop through the rows of data
while ( have_rows(‘menu_sections’) ) : the_row();

` echo ‘<h4>’ . the_sub_field(‘section_title’) . ‘</h4>’;
if (have_rows(‘section_items’)):
// display a sub field value

`echo ‘<table>’;
echo ‘<thead>’;
echo ‘<tr>’;
echo ‘<td>Vegetables and Fruit</td>’;
echo ‘<td>Grower</td>’;
echo ‘<td>Price</td>’;
echo ‘</tr>’;
echo ‘</thead>’;

while ( have_rows(‘section_items’) ): the_row();
echo ‘<tr>’;
echo ‘<td>’ . the_sub_field(‘dish_name’) . ‘</td>’;
echo ‘<td>’ . the_sub_field(‘dish_description’) . ‘</td>’;
echo ‘<td>’ . the_sub_field(‘dish_price’) . ‘</td>’;
echo ‘</tr>’;
endwhile;
echo ‘</table>’;
endif;
`

`

endwhile;

endif;

}

genesis();

[Author]

Posts