It is possible to include the Flipdish web ordering system on any website by adding two lines of code. 

Requirements: 

• Access to your website configuration.
• Please note that you must have SSL enabled on your site to make use of the Flipdish web ordering system. Learn how to enable SSL on your website for free here.
• Flipdish portal access
• The hostname must be whitelisted (eg. www.yourwebsite.com) before web-ordering can be embedded on your website.

1. Open the Flipdish portal and navigate to Sales Channels -->Website --> Domain Setup
2. Copy and paste the embed code from this page onto your website.

The code will look similar to below by you must [YOURAPPNAMEID]  with your own AppNameId. 

Please note that your hostname must be whitelisted (eg. www.yourwebsite.com) before web-ordering can be embedded on your website. Please contact help@flipdish.com to have your hostname whitelisted. If your hostname is not whitelisted then the web-ordering system will not appear on your page.

When a user visits your ordering page you can choose whether to display the ordering options first. If you offer both delivery and collection then new users will be asked whether they want to collect or delivery. If you offer delivery only then new users will be asked to enter their delivery location. And if you offer collection only then users will be shown the menu or a list of stores to select from if you have multiple locations listed.

If you would like to instantly display your menu to customers then please include the attribute  data-initial-screen="menu" in the DIV. 

If your webpage has a fixed header it may cover up the basket on the page when the page is scrolled down. 

You can add padding to the top of the basket section by adding data-offset="100" to the DIV. The 100 value is in pixels and can be increased or reduced to alter the amount of padding. 

By default, the Flipdish web-ordering system will make use of all of the browser page on mobile and hides any surrounding footer and header. This is done to optimize the experience of visitors using small screens.
If you would prefer to keep your page header and footer visible on mobile then add
data-full-screen-on-mobile="false" to the DIV.

You can customize the online ordering system by changing numerous aspects like the fonts, colors, shadows, font size, spacing, padding, borders; on various elements within the ordering system. Learn how here.

There are some situations where an external ordering page is preferred to an embed code and in these instances, we use an external ordering page. The external ordering page links to your own website so that it does not feel entirely separate.

Please click here to learn more about how to use an external ordering page.

For more information please contact our support team "help@flipdish.com".

To learn more about Flipdish’s products or how to grow your online business enroll for FREE in the Flipdish Academy here: http://academy.flipdish.com/