How To Implement The Ordering & Reservation Buttons

1. Make sure your code is up to date and complete

This is the custom code that we provided for your restaurant:

<!-- If you would like to customize the button, remove or change the "class" attribute inside the <span> tag -->
<span class="glf-button" data-glf-cuid="bc27f64e-779c-4602-9357-e4ac4e59f368"
data-glf-ruid="3c67547c-d193-49dc-8f4f-db6489704f1b"> See MENU & Order</span>
<script src="https://www.foodbooking.com/embedder/js/ewm2.js" defer async ></script>

Check your implementation to make sure your code is complete.

Thing like: <span class="glf-button" > See MENU & Order</span> are not ok.

The attributes data-glf-cuid and data-glf-ruid must be in there. Without those, we cannot properly track when your buttons are loaded. This means that we cannot provide you with accurate website funnel data.

2. Publish the buttons on the homepage, above the fold

The placement of the ordering button can make or break your online sales.

Website that have the ordering button placed highly visible on the homepage, above the fold, without other unnecessary distractions around it, get an average click rate of 60%.

Those who “hide it” on their website get a click rate of 10% or even less.

place buttons above the fold

We also recommend publishing the ordering / reservation buttons on every other page of your website. Why? Because this way, no matter on which page the client enters the website, he/she is always one click away from ordering.

3. How to correctly publish your buttons in the navigation

Do you want to have an “Order online” or “Book a table” link your navigation?

buttons in navigation

No problem. Here’s how to do it properly:

<ul class="nav">
<li class="nav-item">
<a class="nav-link" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Contact us</a>
</li>
<li class="nav-item">
<a href="javascript:;" data-glf-cuid="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx" data-glf-ruid="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx">Order online</a>
</li>
<li class="nav-item">
<a href="javascript:;" data-glf-cuid="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx" data-glf-ruid="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx" data-glf-reservation="true">Book a table</a>
</li>
</ul>
Notes:
  • Don’t forget to replace to add your own values for data-glf-cuid and data-glf-ruid
  • Don’t forget to add also the <script src="https://www.fbgcdn.com/embedder/js/ewm2.js"defer async></script> somewhere in the page.