I’m combining fullpage.js with wordpress & bootstrap to make a website for a new restaurant. Through ACF I created a menu where he can adds his own dishes etc… This page by itself is working as it should. example of the template page
Yet, once I’m trying to get_post on the BBQ section with fullpage.js it isn’t showing the page content. example
Does anyone have an idea whats causing this and knows a solution?
index.php
<?php get_header(); ?>
<nav class="navbar navbar-default navbar-custom navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-nav" aria-expanded="false"> <span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse" id="bs-nav">
<ul id="#nav" class="nav navbar-nav">
<li data-menuanchor="firstPage" class="active"><a href="#firstPage">De Chef</a></li>
<li data-menuanchor="secondPage"><a href="#secondPage">BBQ</a></li>
<li data-menuanchor="thirdPage"><a href="#thirdPage">Traiteur</a></li>
<li data-menuanchor="4thpage"><a href="#4thpage">Catering</a></li>
<li data-menuanchor="5thpage"><a href="#5thpage">Verhuur</a></li>
</ul>
</div>
</div>
</nav>
<div id="fullpage">
<div id="one" class="section">
<p>Page 1</p>
</div>
<div id="two" class="section">
<p> <?php
$recent = new WP_Query("page_id=3053");
while ($recent->have_posts()) : $recent->the_post(); ?>
<?php the_content(); ?>
<?php endwhile;
wp_reset_postdata();
?>
<p>
</div>
<div id="three" class="section">
<p>Page 3</p>
</div>
<div id="four" class="section">
<p>Page 4</p>
</div>
<div id="five" class="section">
<p>Page 5</p>
</div>
</div>
<?php get_footer(); ?>
restaurant-menu.php
<?php
/*
Template Name: Restaurant Menu Template
*/
get_header(); ?>
<div id="primary" class="content-area">
<main id="main" class="site-main" role="main">
<?php
// Start the loop.
while ( have_posts() ) : the_post(); ?>
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<header class="entry-header">
<?php the_title( '<h1 class="entry-title">', '</h1>' ); ?>
</header><!-- .entry-header -->
<div class="entry-content">
<?php if ( have_rows('menu_sections') ):
while ( have_rows('menu_sections') ): the_row(); ?>
<h2><?php the_sub_field('section_title'); ?></h2>
<?php if ( have_rows('section_items') ): ?>
<table>
<thead>
<tr>
<td>Name</td>
<td>Description</td>
<td>Price</td>
</tr>
</thead>
<?php while ( have_rows('section_items') ): the_row(); ?>
<tr>
<td><?php the_sub_field('dish_name'); ?></td>
<td><?php the_sub_field('dish_description'); ?></td>
<td>€<?php the_sub_field('dish_price'); ?></td>
</tr>
<?php endwhile; ?>
</table>
<?php endif; ?>
<?php endwhile;
endif; ?>
</div><!-- .entry-content -->
</article><!-- #post-## -->
<?php endwhile; // End the loop. ?>
</main><!-- .site-main -->
</div><!-- .content-area -->
<?php get_footer(); ?>
Hi @laurentdotcom
I’m afraid I don’t understand your current setup, so I’ll just assume that the ‘menu_sections’ repeater is assigned to a page with ID of ‘3053’. In that case, I believe you should be able to do it like this in your index.php:
<div id="two" class="section">
<?php $page_id = 3053; ?>
<?php if ( have_rows('menu_sections', $page_id) ):
while ( have_rows('menu_sections', $page_id) ): the_row(); ?>
<h2><?php the_sub_field('section_title'); ?></h2>
<?php if ( have_rows('section_items') ): ?>
<table>
<thead>
<tr>
<td>Name</td>
<td>Description</td>
<td>Price</td>
</tr>
</thead>
<?php while ( have_rows('section_items') ): the_row(); ?>
<tr>
<td><?php the_sub_field('dish_name'); ?></td>
<td><?php the_sub_field('dish_description'); ?></td>
<td>€<?php the_sub_field('dish_price'); ?></td>
</tr>
<?php endwhile; ?>
</table>
<?php endif; ?>
<?php endwhile;
endif; ?>
</div>
I hope this helps 🙂
Hi James, you assumed like a pro 😉
Your code worked out well! Thanks for your time!
