Skip to content

All the required codes & functionalities for food-delivery websites on WordPress

Reading Time: 4 minutes
All the required codes & functionalities for food-delivery websites on WordPress

Thinking about creating a website for your restaurant? Nice. Thinking about delivering your tasty food to your fellow countrymen? Even nicer. Here are all the required codes & functionalities for food-delivery websites on WordPress.

Functionalities:

  1. Required plugins & the setups
  2. Delivery & take away options
  3. Deliver in one city
  4. Minimum order amount
  5. Special offers & combo menus
  6. Product addons

Here’s an article on the differences between food-delivery & other ecommerce websites

Full list of the required plugins & setups

Code Snippets – Used for adding the custom codes, so we don’t lose them with each theme update.

YITH WooCommerce Product Add-Ons – Used for adding product addons (extra cheese, sources, etc…).

I highly you get a premium access to YITH plugins, they’re super useful and user-friendly.

Add delivery & take away options for your visitors

You want to offer your visitors the option of take away, and when they choose take away, they shouldn’t fill in their address and other information 😉 Why would you ask for an address if they’re picking it up?

delivery & take away in WooCommerce

Add two HTML sections in your checkout page, one before the

and one after.

Before
:

<h3 style="font-size: 1.2rem;"><strong>Choose a shipping method</strong></h3>

<select id="shiptype" onchange="changeshiptype()">
    <option value="shipping">Delivery</option>
        <option value="take">Take Away</option>
</select>

After

<script>
  function changeshiptype () {
     let value = document.getElementById("shiptype").value;
     if(value == "take") {
         let adress = document.getElementById("billing_city_field").style = "display:none";
         
         document.getElementById("billing_address_1").value="take away"
         
       document.getElementById("billing_address_1_field").style = "display: none"
       
       
       document.getElementById("billing_postcode").value = "12000"
       document.getElementById("billing_postcode_field").style = "display:none"
       
    } else {
        
        
        
         let adress = document.getElementById("billing_city_field").style = "display:block";
         
         document.getElementById("billing_address_1").value=""
         
       document.getElementById("billing_address_1_field").style = "display: block"
       
       
       document.getElementById("billing_postcode").value = ""
       document.getElementById("billing_postcode_field").style = "display:block"
        
        
    }
  }
</script>
delivery & take away in WooCommerce

Deliver in one city in WooCommerce

Obviously you don’t ship your burgers to the other side of the world right? Right. Here’s the code for having only one city in WooCommerce’s checkout page.

From your WordPress dashboard go to Snippets (you have to install the Code Snippets plugin) -> Add New -> Paste the following code -> Change the city (Prague) to your city

/* one city*/

// Only one city at checkout
add_filter( 'woocommerce_checkout_fields', 'custom_checkout_fields', 10, 1 );
function custom_checkout_fields( $fields ) {
    $fields['billing']['billing_city']['type'] = 'select';
	$fields['billing']['billing_city']['options'] = array('Prague' => 'Prague');
    $fields['shipping']['shipping_city']['type'] = 'select';
    $fields['shipping']['shipping_city']['options'] = array('Prague' => 'Prague');

    return $fields;
}

Add a minimum order amount in WooCommerce

You don’t want to spend 5$ on delivering a 2$ worth of shopping, right? Right.

From your WordPress dashboard go to Snippets (you have to install the Code Snippets plugin) -> Add New -> Paste the following code -> Change the 30 with your website’s minimum order amount.

Change the #minimum – 30;

/* Set a minimum order amount for checkout
 */
add_action( 'woocommerce_checkout_process', 'wc_minimum_order_amount' );
add_action( 'woocommerce_before_cart' , 'wc_minimum_order_amount' );
 
function wc_minimum_order_amount() {
    // Set this variable to specify a minimum order value
    $minimum = 30;

    if ( WC()->cart->total < $minimum ) {

        if( is_cart() ) {

            wc_print_notice( 
                sprintf( 'Your current order total is %s — you must have an order with a minimum of %s to place your order ' , 
                    wc_price( WC()->cart->total ), 
                    wc_price( $minimum )
                ), 'error' 
            );

        } else {

            wc_add_notice( 
                sprintf( 'Your current order total is %s — you must have an order with a minimum of %s to place your order' , 
                    wc_price( WC()->cart->total ), 
                    wc_price( $minimum )
                ), 'error' 
            );

        }
    }
}

Create special offers & combo menus

To create combo menus and special offers you need to install & activate YITH WooCommerce Product Add-Ons.

Here are the required steps:

  1. Create a product with the combo name i.e. Buy 1 burger and get french fries for free
  2. Make the price 0
  3. Add the image and description
Product with 0 price

From your WordPress dashboard go to Products -> Add-ons -> Add New

  1. Name the Add-on group.
  2. Choose which products it should be applied on. Or you can choose the categories.
  3. Save group.
  4. Manage Add-ons>> – If you can’t find it, then go back to the Add-ons and click on the edit.
  5. New Add-on -> Radio Button -> Title: Choose your burger.
  6. Click on the “Add new option”.
  7. List all the burgers the user can choose from with their prices.
  8. Click on “New Add-on” one more time -> Radio Button -> Title: Fries
  9. Option label: Free -> Check the Checked checkbox
  10. Save

This is how it will look like:

special offers look in WooCommerce

Add product add-ons in WooCommerce

This is rather simple, the same way we added special offers. First, install YITH WooCommerce Product Add-Ons

  1. Create the product add its price
  2. Go to Products -> Add-ons
  3. Add New -> Choose the product/category
  4. Manage Add-ons
  5. Start adding the add-ons accordingly

Leave a Reply

Subscribe, I never spam

Agapi
stepanyanagapi229
Read More
Although I don’t have a restaurant the urge to read it was too strong and didn’t disappoint. I guess if you have a restaurant this is a must-read. Thanks a lot.
Diogo Barros
Diogo Barros
Read More
Thank you !
J
J
Read More
i've been searching everywhere for this solution, you're the first person who gave a simple solution. Ty
Farah I
Farah I
Read More
Thanks. I already have cloudflare and its still slow.. was thinking of how to remove unused js... but found your video instead
BLACK ANT
BLACK ANT
Read More
makes complete sense bro. Thank you
 Tobee Panyasith
Tobee Panyasith
Read More
Thank you for this great video

Table of Content

Subscribe to my mailing list

I never spam