How to Make a FREE Restaurant Food Ordering Website With WordPress in 1 HOUR! [DELIVERY AND BOOKING]

Video Statistics and Information

Video
Captions Word Cloud
Reddit Comments
Captions
welcome party people my name is Dara Wilson and today in this video I'm gonna show you all how to create a simple and convenient online food ordering website with WordPress now in this video we're gonna use a bunch of free tools to help you create your own online food ordering websites now this at all was perfect for pretty much all small business owners who don't want to spend a lot of money with their websites or just for anyone out there who wants to accept payments and orders through their websites now I know small business owners are struggling with cost so in this video I'm gonna show you how to make this same website with a free builder a free theme and a free food delivering service app it's amazing and if you're a complete beginner good because we are using a drag-and-drop builder that's super easy to use and the best part is it's completely free so go get a coffee and grab a seat and let me show you the website we're gonna make today and also what you're going to learn in in this video so here is a website that I'm going to show you how to make today now it doesn't matter what kind of an industry you're in there is a template in style for pretty much every single food industry out there so I'll be showing you all those free templates today in this video so for example the customers will come to your website and say you know what I want to order something so let's take a look at the menu so right here I will click on the menu and then the menu will display so it doesn't take them to another page it displays it right away for them so here we have this picture of this burger we have another burger and we have salads and sides so essentially these are categories so for example we have burgers salads sides and drinks now if you are in something like a Mexican restaurant this can be tacos burritos tostadas and maybe soups you know but a pizzoli or something like that so let me go ahead and click on one of these burgers so let's click on it so click on the classic burger let's order something here so we have different sizes so for example they can make it a combo right here you can you know add like a $2 combo for a coke and chips or coke and french fries and also they can have add-ons so this would be something also for like Asian restaurants or if they want to add chicken or add mushrooms to their order that you can you know they can add it for a dollar more so I'll just add all these because I'm hungry and in special instruction so let's say for instance maybe someone's allergic to a hot sauce or something like that you know we'll just put a no hot sauce you know or something like that you get the points and I will add this to the cart now this is a live website where we can take payments right away on this website so I will be checking out and showing all of you that this is a live real website that accepts credit cards next we have this little eye button right here so this section right here will display the delivery fees and also shows them the radius so for example if you don't want to deliver really really far away you can basically tell people saying look guys we'll only go maybe five miles from our restaurant but anything past five miles it's just too far and it's just not worth our time so you can go ahead and add delivery fees and also add in a minimum so you don't want your customers ordering like three dollars worth of food and then expecting you to deliver it so you can set minimums and you can also set fees as well you can also show them the delivery times where you deliver we have table reservations the payment method so people can order with cash card and you can do card with delivery or pickup here they have the phone number and we also have opening hours now I put 12 to 12 because this is 24 hours so if you deliver 24 hours that's what you would put but you can do something like you know 10:00 to 8:00 o'clock or something reasonable this is probably not reasonable but then again donut shops they open 24 hours which is interesting and let's say for instance you want to change the language you can change it to Dutch or you can change it to English or Spanish or Italian or whatever language that you speak so that's pretty cool so let's go ahead and check out so here I'll click on the carts and I'm gonna go ahead and put in my contact information so on the top right here your customers will be prompted to put in their contact information once they fill it out they will click on save the ordering method we can click on this and saying well I can pick it up I can deliver or I want to you know order a table reservation now one thing to note here is that you can expect the payment right now on the website or when they come and pick it up it's really up to you and in this video I'll give you the options of having both just in case you want to maybe charge them on your website or you can charge them later and then here we have the payment method so what's really cool is that I was already running test payments and the credit card will be stored on the website so they can come back and keep purchasing more and more of your food without having to find their credit card you know maybe they got maybe they lost it so it's a very convenient process so I'll go ahead now and place the order for pickup now what's really cool is you as the business owner will be able to approve this or you can even decline it so for example if someone orders something really really big you can decline it and give them a call saying hey guys no it's really really big so we don't have that available and you can always give them a phone call so it's really cool you can actually approve orders directly on your smart phone or your mobile device you can also go ahead and print those orders and connect it with Wi-Fi to any thermal printer or any printing device and then once the restaurant confirms the order and let them know in their email that the order was confirmed you will get a text message and you'll also get an email notifying you of a new order and someone has purchased something on your website so then the customer will get an email from you automatically notifying you that you purchased the order and they will also get a purchase receipt and you will also get an email notifying you that someone has purchased something on your website so it'll give you the information about the customer let them know it's for pickup and also show you how they paid as well now what's better than an online food ordering system a beautiful website people will not buy anything unless you have an amazing website entertain this video I'm gonna show you all how to just create an amazing and beautiful looking website so this is using a drag-and-drop builder so you don't need any sort of experience whatsoever to create this website and we're gonna go ahead and import this website as a template so you'll have your website up and running in a few clicks making it really easy for you to get started with your new website so if that doesn't impress you well I think you're impressed so let's go ahead now and move on with this tutorial so step one will get your domain and hosting so for example my amazing restaurant comm step two will install WordPress and WordPress is free and it's also the most popular platform for making websites and step three we're going to go ahead and build out your amazing website and step four you're gonna make some money you're gonna make money now there is a link and description of this video it'll take you to a page that looks just like this right here and this right here is psych ground calm now you've seen my other videos I've been recommending Saigon calm for what four years now and that's because Saigon calm came up as the number one as the fastest with the best uptime when you're hosting your website so I tested fifteen other companies and sycron came up with a low time of around 1.8 seconds so you can be searching that your website will be very fast compared to other web hosting providers so we have three plans right here we have the start up we have the grow big and the go geek for most of you you probably want to go with the grow big plan because with the grow big plan you can host unlimited websites and you get a little bit more space rather than just a single website so you can see the difference right here and personally I don't think you need to go geek just yet that's for people like myself or who have a lot more web sites and stuff so right here under the grow big plan click on get plan all right and right here you're gonna give your website a new name so go ahead and talk it over with your friends or your buddies and give us some thoughts because this is going to be your new web address so for this tutorial I'll just do something like a web site tutorial Darryl comm and then right here I'll click on proceed all right cool and this right here is the checkout page so right here you'll put in your account information and then here you'll put in the client information like your first name and your last name and then here we have the payment information so you can pay with credit card and then also here you'll put in your social security number I'm just kidding no social just kidding right here is the purchase information so right here we have a period and I recommend doing 12 months because 12 months will actually give you enough time to decide this is for you or not and you also get the largest discounts with 12 months and remember there's a 30-day money-back guarantee for any reason whatsoever and then here we have extra services now I require you guys to check on this domain privacy the reason why is because if you don't have them in privacy checked you're gonna get all these unsolicited emails and spam trying to sell you viagra sex pills and SEO packages and all this really weird stuff that you don't want so if you have this check this will protect your personal information so make sure you have that check right there and then scrolling down here we have the Terms of Service and Privacy Policy so make sure you have that checked so once you're all set click on Pay Now and I'll meet you on the very next page all right cool so after you've purchased hosting it'll take you to this page right here and then right here click on proceed to customer area all right awesome so to set up your website right here just click on setup sites now right here we have two options we have start a new website and migrate website right here just click on start a new website and right here we have four options but we want to select WordPress so click on WordPress here you'll create some login credentials so make sure you write this down because you're going to need this information every time you log in and make changes to your WordPress website so I'm gonna go ahead and put in an email address and a password alright so I'm all set and right here once you're done you'll click on continue so right now it's asking us if we want to add this to our plan personally I don't need this right now and I don't think you do either so I'm gonna skip this and just click on finish and that's it and right now sycron is setting up your new website make sure also to check your email because you're going to get an email from site ground saying verification required open up this email right here and you're going to verify the domain that you purchased so right here you'll have this link so click on this link and it'll take you to this page right here and you need to verify your domain basically saying that you're a real person and not some robots or else we're gonna suspend your domain so all you to do right here is just click on verify information and you're done your domain is verified alright cool so the website has been successfully installed and we are all set so right here click on manage site so this right here is the site ground dashboard so on the left side right here you'll see WordPress click on WordPress and then click on install and manage so this right here is going to show the installations of WordPress that you have for your website and right here on the bottom we can see our website and then here you can see that WordPress has been installed right here under actions on the bottom right it's gonna say login to admin panel click on login to admin panel alright cool and it'll take you to this page right here but I don't really want to go through the setup wizard so on the bottom right here where it says exit click on exit and congratulations your website is now live on the Internet now if you want to see your website right now on the top left right here you'll see my WordPress just click on visit sites and this right here is your new website it's a little plain it's a little boring and it's really ugly so we need to make a lot of changes to it so before we go into the design process and start building our website we need to change some general settings so right here under my WordPress let's go back to the dashboard so the first thing we'll do is disable this plug-in right here we don't need this WordPress starter so right here in our plugins click on installed plugins you're gonna get very familiar with plugins as this tutorial goes on but right here we have a wordpress starter go ahead and deactivate the wordpress starter all right cool next let's go right here to users and go to your profile so in the future if you want to change something like the color or your email or your password this is where you're going to do it so right here I must select Midnight's I like midnight I feel like Midnight's I don't know I like it you can go to these other ones and see which one you like scrolling down here so if you ever want to change your email this is we're gonna change your email and that's pretty important because that's what you're going to use to log into your websites and then right here we have the generate password so if you ever need to make a new password this is where you're going to do it you can just click on dinner a new password and then just go to update profile and you're all set ok cool another thing I want to let you know is that if you speak a different language right here and our settings in general you can actually have the backend change the text right here to your specific language so many of my viewers asked me about a plugin for that and I said guys right here it's in a site language so right here you can select any language and they have pretty much any I think they have every language out there they have a lot of languages so you can select your language and then once you're done you'll click on Save Changes it'll apply throughout the entire back end now there's two more things that we need to change right here under permalinks we need to change our permalinks and I'll explain what this is so right here we have our permalink settings and you want to have it under post name the reason why is because when someone comes to your website like for example your website com - about us right not a bunch of numbers and a really ugly permalink so post name is the best for SEO and it makes your site look a lot more cleaner so once you click on post name right here click on Save Changes next we need to fix this ssl right here so you notice right here on the top of your website how this says connection not secure and if you go to other websites like Google you're gonna see that this is a secure connection so we need to change our connection to a secure connection so we just need to install a free plug-in right here in our plugins click on add new what plugins are guys there are essentially applications for your website so there's an application slash plugin for pretty much everything out there just like your iPhone so right here under search plugins you'll type in really simple SSL I'm not kidding that that is the name of the plug-in really simple SSL and this right here is a plug-in that you need it has four million active installs right here just click on install now and then you'll click on activate alright so right here it'll tell you that you're almost ready to migrate to the SSL now before you do this make sure that you have your password and email written down the one I told you to write down because it's gonna kick you out of WordPress and you're going to have to real aughh in so right here click on go ahead and activate the SSL alright cool so on the top right here you'll notice that the connection is secured now in the future I'm going to show you now how to log in to your website whenever you want to make changes to your WordPress website so right here you'll see your domain name so what I'm gonna do is just go ahead and delete all this and right here you'll type in WP dash admin just like that and then you'll click on enter so this is the address that you need to type in every single time that you want to make changes and login to your websites so right here I'm gonna enter in my username and my password okay and here on remember me and I will log in alright cool so all the general settings are done and your SSL has been activated so now your site is secure now as you guys use plugins and themes you're gonna get notices from the developers you can just close those messages they're just little things saying hey go give me a five star rating etc so if you want to do that you can do that but you can always close all notices at any time okay so step three let's start designing your new website so when you install WordPress by default you're given this really bland boring website and there's not a lot of design to it so we're gonna make it look amazing so first let's go ahead and install a wordpress theme so on the left side right here under appearance you'll click on themes and then under themes you'll click on add new and you can click on popular now there's various themes that come with WordPress in fact there's thousands of free themes that you can use I've used probably like maybe 20 or 30 of these themes and I've narrowed my list down to probably like five five free themes an EVE is a good theme but the one that we're gonna use is gonna be Astra so this right here is a theme that we are going to use so you can go ahead and click on Astra also if you go to the top right here and just type in Astra it'll actually display the theme right here so right here I will click on Astra you'll install it and then you'll click on activate so I'm gonna click on activate and the WordPress theme has been installed Wow it's a fast server so I'm not editing the video it's that fast now when you install Astra for the very first time it's going to ask you if you want to import a demo website and yeah sure let's do that so right here it'll say thank you for installing Astra we can go ahead and click on get started so what we're installing right now is a plugin so what plugins are guys is basically add-ons it's like an application for your cell phone so here they're saying go ahead and select the page builder now each of these page builders work in a different way but the one that we're gonna use is going to be Elementor now Brizzy is also a very good page book that I recommend I've actually had videos on it as well but we are going to select Elementor for this tutorial if you guys want I'll go ahead and do it at all and Brizzy next time but right here I'll click on element all right awesome now there's a bunch of templates that you can use and these are at your disposal you can use these for free and this will actually import the entire website for you so under this little arrow icon if I click on it I'll go click on free and these are free right here so these don't cost anything whatsoever now if you want to narrow down your search to even more right here I'll just type in food and now we're given a list of four but it looks like the Italian restaurant and the steaks and barbecue are probably the most idealistic so you can actually go through each and every one of those and take a look at them however after we import this website I'm going to give you an additional free resource to have even more templates and blocks at your disposal because I'm awesome and make sure to LIKE this video so but under this barbecue restaurant I will click on this and it's showing us the website so this is the home page the about Us page you can take a look at it as well you can scroll through each page and decide what's for you so this is the menu and this is the contact us so pretty cool now on the bottom right here it says import complete websites I want to click on this and it's going to say alright are you sure you want to import everything in fact you can even delete the previous website so we've been working on a website before it'll delete everything and just put this website on your website and then you know that'll be the end of it but right here I will click on import so now it's importing all the necessary plugins content and images to your new websites that I make it look amazing alright so the website has successfully been imported and I'll click on View sites and voila we have a beautiful amazing pre-made website that is all ready to go now this website is a live website so this is a real website so if someone comes through a website right now they're going to see this same exact website so it created the home page for us and also created the about Us page it created our little menu and it created the contact us page so that is pretty amazing now you might be asking yourself taro okay I have this website but I am NOT stakes in barbecue so how do I everything well I am glad you asked so right here under the Edit with Elementor this is the page builder that you're going to use to basically make changes and edit your websites so I will click on edit with Elementor alright awesome so here we have the page builder now this page builder is pretty simple so instead of steaks and barbecue we can do pork you know pork and beans you know or you know pork and beans whatever and you can go ahead and just change whatever you want visually on the website so right here you can go ahead and type in any content content you want and you'll see right here how it's displaying the reason why it was going up like that is because this has an animation on it and you can go ahead and just put you know you can make any changes you want to pretty much everything so for example right here I'll scroll down and I set up the the best the barbecue place I'll put the steak place now right here we have this button and if I want to change the button you'll see we have these three columns we have content style and advanced so you'll click on style now style is basically when you want to change the style of it so the colors of POG Rafi and the font size so the typography we can change this to something like Madonna or Helvetica something like that you can see how the fonts changing also I can change the size of its to make it super big or I can go ahead and you know decorate it here you guys can get the points now for the text color I can leave it as whites but for the background color I can change this to pretty much any color that I want so that is pretty cool I'll leave it as black for now we'll just change it as black and then scrolling down here we can go ahead and say alright you know I have these images but maybe you want to put your image instead so whenever you want to swap an image you'll just click on the image you'll click on choose image select files and then I will select the image so I have an image of me I'll open this and I'll go ahead and insert that and voila now we have a picture of me so that's pretty cool and then you can kind of go through here and just change anything that you want so right here style I'll change this to something like white and these little empty boxes right here we can just add an image so if I want to add an image right there of something like a plate of food and then over here I can take this image and just drag and drop it so what I'm trying to get out here is that this is a fully visual drag-and-drop builder that's just super easy to use so you can kind of go through these and make any changes that you want to your websites so let me go ahead and click on updates all right so I've basically shown you how you can kind of edit stuff and how you can design pretty much Antonette you want however let's say for example you want to add a new section so you're saying you know do I want to add something in between this section right here you know I want to add a little bit more or maybe you want to delete this whole section so I can click on this X right here and delete it and right here into this plus icon you'll see that we have these three options so this is to add a new section we can add a full templates or we can add a block which is also a starter template so let me just go ahead and go to the basics here I'll click on the plus icon and say maybe I just want to have a two column row all right so now we have two columns right now I'll click on these squares which gives us these little elements I'll take this heading text I'll drag it right there click back on the squares click on the divider and then I will go ahead and grab in some text and there and lastly I will put in a button right here there we go and then on this side I can probably put in an image so I'll just grab an image and then you know we can go ahead and choose an image and then maybe I can add in I don't know we can add in this delicious delicious beef right here so I'll put something here like the best beef in town best beef in town set beef I think that's beef and that's chicken right or is that yeah that's that's beef yeah let me know let me know in the comments I think that's a mix of both that's definitely chicken on the left side and this is definitely beef and then right here we have this divider now I just want to use this for like decor purposes so you see here how I just kind of have this like as a separator you know from the text and then here I'll copy this and just paste more text in like that and then there you go we have a new section and let's say I want to add in a more space so it's a little scrunched together so if I click on these little dots right here under the Advanced tab I can actually add space so here we have padding I'll uncheck this and just there we go click until your heart's content so we add around maybe 70 pixels to the top and 70 pixels to the bottom look at that that is amazing right alright and let's say for example you want to add something in the background maybe you don't want that white ugly background so again just click on the dots and style and we have background so we can have a gradient background we can have a video background like you saw on the title or we can just have a classic color background you know something like that or I can go ahead and even add in an image to the background so I really depends on what you want to do so for example if you don't want to add the color I will clear that and I can add an image to the background and maybe just added these little cute little things or whatever that is so that's just a way on how you can kind of build your websites so that's just a quick little crash course guys on this page builder now this page will err is incredible and I already have two of the tutorials that are about two hours long might go in depth for everything that you possibly need to know about this page builder so this right here is an additional video on Elementor and elements or pro so I basically cover all the features and all the information including the advanced features like the theme Bill are in that video so if you want to further your knowledge about this page bowler and WordPress I highly recommend to watch that video but for this video I'm not gonna go through every option in the Builder because I have I've already created a second tutorial for that and it is very in-depth so let's keep going so I want to go ahead and just undo that change that I did I don't want this section so I want to delete it and that's pretty much it and I will click on updates now the next thing on my show how to do is I'm going to show you how to quickly create a page and add it to the menu along with introducing you to an amazing plugin that will give you tons of free templates so right here I'll click on exit to dashboard and I'll click on this W icon on the top left which is home and under here under plugins I'll click on add new over here under search plugins will type in Envato e + v 8000 and this right here is a plugin that you'll need is called Envato elements so you'll install it and then you'll click on activate alright cool so now that we've created that what we're gonna do next is we're gonna create a page and I'm gonna show you how to basically create a page from scratch in case you don't want to use a template so let's add a new page so right here under pages we'll click on add new and this will be our testing page or just a demo page you know just to help you get knowledge about WordPress and how to make pages by yourself without having to use a template now right here we have these site these Astro settings so under the sidebar I don't want a sidebar and under the content layouts I want it stretched and I want to disable the title so what that means is on the page I don't want the title to being displayed and I want it to go full width so let me go ahead and just publish this to give you an example of what I'm talking about so I will click on View the page and you can see here how its full width now this is a default footer that's created for us automatically so on every page it will be applied let's go back to edit page and on the top right here it says edit with Elementor go ahead and click on edit with Elementor so this looks familiar right so now we're just basically building our website from scratch or we're building our page from scratch now you'll notice right here we have this green new icon now this green new icon gives us a library of templates and also free blocks that we can use for our website so first let's check out the kits so free kits and I will type in food and click on search and now we have a little bit more templates that we can use in fact there's around 18 more templates so it covers organic food Mexican food burgers we have recipes a winery a juice bar a restaurant and cafe a coffee shop you name it it has it so what I'll do is I'll go ahead and go to page two and I'll just go ahead and you know we'll just import one really quick so we'll do this a big barbecue one yeah big barbecue one and I'll click on install the kids all right now I will click on View the kids so here a lot of pages that it comes with so where it says pro that means it requires Elementor pro now we're using just the free version so we can use the other pages except for those pro pages and there's still quite a bit of pages that we can use though it's not like we're losing out here but I'll just say you know what I want to insert this one right here the about us - I'll enter the template and now it's importing that page on to our page that we are creating alright awesome so this is now our new page that we were working on and you can go ahead and make any changes you want to the website so the best food in town you can change these images you can move stuff around so for example if you want to take this and put it down here you can take these dots click on it and hold it and then drag it down there like that so it's totally drag-and-drop I mean right here also as well I can take this and drag it over there and then if you want to add something else we can add more to this page so here under the auto elements I will click on this again but this time I'll click on free blocks so we also have blocks and the blocks are basically are just sections that we can use instead of the whole pre-made website so for example under the about Us section you'll see that there are quite a bit of blocks right here and the one that I like to use was something like this one right here so we have this about Us section so I'll insert this template looks not really a template it's more of a section so for the about Us section I'll just say you know what's I'll delete this and now we have like an Asian restaurant so all you need to do is just change this to like some sort of like you know Asian style restaurant or like sushi or something and then you have a Asian restaurant and then here you can talk about how the Asian restaurant got started so it's just a matter of just changing a few images text and you can basically you know create anything that you want from scratch and you can keep using these blocks and the great part is these blocks are all completely free so that is incredible so call to action you get it you can kind of go through these and just take a look and then just insert these at your own disposal so I hope this is really helpful I mean I I want you guys to succeed I really want you guys to have all the resources possible so I think introducing you to this plug-in where you can just go ahead and just insert pretty much any that you want would make things a lot easier for you and you're building a website especially as a beginner so let's say for example I'll just go ahead and update this we made this new page now how do we add it to the menu so if you look at the menu right here the page that we made is not there we need to assign it to the menu so over here are these little dots I will go to the exit to dashboard it's kind of annoying used to bring us back to our dashboard but here let's go back here now under appearance we have menus so here we have the pages and we have view all so I'll click on View all take the testing page that we were working on and click on add to the menu so now I can take this and pretty much put it anywhere I want so testing page save menu and now we can take a look at our websites and then the testing page is there and there you go so it's basically everything that we created and you can just go ahead and mess around with that and have fun and you can make your own pages and you can assign them to the menu you don't have to use the default you know the default template that we're using so now I've shown you all how to basically do all that let's talk about how to change this menu and then we'll talk more about the money aspect and how you can add an online ordering system so you'll notice this custom I button up here go ahead and click on customize so the customizer in a nutshell is what the theme controls so this right here is the page builder the theme is more of the header and also the footer so you'll notice right here we have these little blue pencils if I click on that you can see the logo and the retina logo so all you need to do is just click on remove select the logo and then just add the logo in for whatever you know whatever you're trying to add so I'll just put in this you know this random logo here and also for this one I will change this one and publish there you go now we have a new logo so that's how you would basically add a new logo to your website now I want to add one more thing in this video before we go on to the next section is a lot of beginners tend to mess up their website and they have a lot of problems and they start to panic don't worry if your site is patented ruins or whatever it's okay guys so I'm gonna show you a plugin that you can use that'll reset everything and you can go back to where you were working on before so under plugins I'll click on add new now think about plugins like applications so for example this is a contact form this helps with ranking this helps you sell online this is the page below that we're using this is the SSL this is another contact form this is for security the list goes on guys there's only like 50,000 plugins in the WordPress repository so there are quite a bit but under search plugins just type in reset okay and this is the plugin that you're going to install it's called WP resets and then you'll unsalted 8 now I've already activated this plug-in so yeah just letting you know I did that when I was editing the video so if you want to use this plug-in what you'll do over here is going over to tools and go down to WP reset you'll scroll down to the bottom and simply type in resets reset websites now once you do this it will delete your website it will keep your plug and your theme's activated still or installed but not activated and it'll delete all of the content off your website so I just want to make that very clear if you want to restart your website so I will click on restart WordPress and aboie so it is back to factory settings and we can start completely over again so under my blog visit site awesome it's back to exactly where we were when we first got started so it's just a way on how you can kind of restart if you're having problems or if something gets really glitchy or something like that so I'll go ahead and just install everything all over again so here Astra I'll activate it I will get started with the starter templates so easy this is let me see how fast technology is today look at that click on Elementor same thing and then here food steaks and barbecue import complete websites and import website and after this is done importing we are right back to square one so you can always go back to the progress that you're working on before or if you want to switch templates or if you want to switch themes you can have all you can knock yourself out go crazy alright awesome so let's click on View the website just to make sure this is working and there you go so now we can start over from scratch so if you made a lot of mistakes before you can go ahead and start over from where you're working off and yeah I hope that helped so now that I've shown you all basically how to make the website how to add pages change the logo now again if you want further knowledge of this page Buller I highly recommend to watch my other video where we talk about all elements or pro and Elementor and we go into every single option to make sure that you know what you're doing you know it just I just want you guys to tell like the video make sure you know what you're doing now so now that I've shown you all this let's go ahead and move on to the next section where we are going to implement an online ordering system onto this website let's go okay so first well going over to my blog and we'll go to dashboard now what we're going to need to do here is we're going to install a free plugin that's going to connect our website to a website called Gloria food so over here under plugins I will go to add new and under plugins just type in food I know food it's the easiest way to actually get there and this is the plugin that you're going to need it's called the restaurant menu food ordering system table reservation now there is also a link in the description of this video to that same website in order to download the plugin but I'll click on install and then I'll click on activate so I've already installed this plug-in before so once I activated it you'll notice on the top left side up here how it says menu ordering reservations we have the dashboard publishing extras and partner program the only ones that you're going to use is the dashboard and publishing so let's click on dashboard so what we'll first need to do is we are going to make an account with Gloria foods so go ahead and make an account right here so fill this information out all right and once you have submitted your information you'll click on sign up alright cool so we're going to set up your online ordering system in three simple steps we are first going to set up your restaurant information we're going to create the menu and then we are going to publish it on your website so first let's click on get started under the setup your restaurant profile so where is your restaurants go ahead and fill this information out alright cool so I put in my restaurants address now of course this is just for too-tall purposes I just put an article sino because that was the only thing I could think of but once you put in your address you'll go click on next so next we can go ahead and let customers know exactly where we are so for example let's say we are right there that looks good here I will click on the next do you have a real domain name yes we do so this is the domain name that we actually got from site grounds so you'll just go ahead and copy this and we will paste it in right there and click on next so what kind of food you offer well for this video I'm just going to select burger now there are other options but you can have you know fun on your own time and look through those but I'll click on next next we need to validate your email so for the email that you registered with you will need to go to that email and click on the link and verify your information all right awesome so we validate our email address next I will click there and pickup options do you offer pickup from your location of course next do you offer food delivery yes why not next we're going to talk about the delivery zones so where do you deliver to well let's go ahead and add a zone so add a zone and here we have zone 1 so basically we have this little radius right here so 1.75 miles so what I'm gonna do is say look we'll go ahead and deliver between 1 and 1/2 miles and you'll need a $15 minimum and there is no fee for that so I'm not charging you anybody a delivery fee so I'll click on save but let's say for example somebody's a little bit farther so we don't know where they are but let's just say they're farther so I'll add a second zone and I'll say you know what if these guys are ordering maybe you know let's just do 3 miles if they're ordering around 3 miles away from us then they need to order more and we will charge a delivering fee so for example it'll be a $25 minimum and a $5 delivery fee and so on and so forth so we can add in one more that goes around you know for miles and that's gonna be a $50 minimum with a $5 fee now this is a good idea because this will protect yourself I myself used to deliver pizzas at amici's pizzas in Chatsworth so I know that it can be a hassle for businesses that have for delivery so this is actually a really really cool feature god I used to deliver pizzas back in a day and I hated go into like these mountainous areas it was such a pain in the ass but anyways once you're done with that we will click on next do you want to accept table reservations yes why not settings for table reservations now by default they've actually done this pretty well so there is a minimum of 2 people up to 8 this reservation is kept for 20 minutes after the time so let's say for example they're late then I'll say look we'll give you 20 minutes to get your butts over there and if not there then we're gonna go ahead and cancel the table the reservation has to be placed at least 30 minutes in advance and this reservation cannot be put cannot come more than eight days in advanced it sounds fair it sounds fair enough yep alright let's click on next do you offer order ahead yes so how this works you can go ahead and read through that but I'll just explain it so settings for order ahead so what I'll do here is I'll just say I'll allow clients to order ahead but they cannot order more than 8 days in advance so that sounds about fair I'll just put something like 5 and you can go always go ahead and edit this and change it but I doubt you'll have I doubt you'll run into a lot of problems with you know with clients ordering ahead if not they can just call you guys it's you don't have to use the app step by step you know so I'll click on next when are you open so by default it gives us this 10:00 a.m. to 8:00 p.m. so we'll go ahead and say well you know we open up at 9:00 o'clock and we close at around 9:00 o'clock now if you want to accept orders 24 hours you can go ahead and put 12:00 a.m. 12:00 a.m. and then also you can select 12 a.m. if you decide to allow orders 24 hours because some people have restaurants that are open 24 hours like doughnut shops right those places damn they never close it's ridiculous so here I will click on it next accept orders for laters so this is basically allowing clients to request a specific fulfillment time do you want to allow them to order for later sure why not there's actually a good idea because sometimes corporations they have big lunch like you know shindigs and you can or they can go ahead and order like a big batch of lunch you know before so here we go so the order of placement has to be at least 60 minutes in advance and the order cannot come more than four days in advance all right sounds fair enough settings for delivery we have the I allow clients to order for a later time but the same thing so pretty much they can order no more than four days in advance so that's pretty much what that's about and the order placement has to be at least 90 minutes in advance all right so let's click on it next all right taxation and currency now there is a website called tax jar com let's say you are a complete beginner and you see tax jar let's say state taxes there we go let's say you are complete noob with taxes and you don't even know how much your state charges for tax well we'll just click on estates so I will click on Arizona Arizona has a 5.6 percent tax rate so if you go back over here you can go ahead and adjust this to whatever you want now this application is actually pretty good at detecting the sales tax because right here under the Nevada where I registered it says the sales tax is six point eight five percent and that is what it is right here so the application actually picked it up pretty well so you know have fun have fun with that so here I'll click on next payment methods so we have quite a few we have cash we have card and we have callback and take credit card to be a phone so I'll just go ahead and select all of these right now and then I will click on it next so the official details and policy so go ahead and put in your restaurant like the legal business name and just fill out as much information as you can here all right so you'll put in your information and then you'll click on next okay and you must agree to the Terms of Service yadda yadda yadda and click on and next so next we'll have to install the application so there is an application where you can actually get orders directly from your phone and you can also get it in your email inbox so I will click on next and say alright I have a smart phone now if you don't want to put in your phone number you can always just say you know what I don't want to download the application but I do want it to connect to my email instead alright so I put in my phone number and now it's telling me to go ahead and download the application now if you can't find the application or if you didn't get the text I will put a link in the description to the application you just have to download it and then just put in your username and your password and you are all good to go okay so I have successfully connected my website to the application so now whenever I get an order it'll go directly to my phone and it'll also go to my email inbox which is pretty cool so let's click on next and now we have an alert call so they're just saying if you have like an issue or something they'll give you an automated phone call etc so if you want to go that route so you can play notification and put in your phone number or a supervisor's number or whatever you want to do so I here I will click on next and we are all done so that is pretty much it for this setup so I'll go ahead and go back to our websites so now that we put in our restaurant profile information let's go to the next step and create the menu so I'll click on insert the menu so whenever you want to add something to your menu whenever you want to do anything to add something to your website you are going to do it from here so here I'll click on next next next next next alright so they give us a demo right here so for example we have pizza margarita pizza and all this stuff but what we're gonna do is we're gonna start from scratch you know I want you guys to understand how to use everything so I don't want you guys using off their work because then you might not know what to do so let's go ahead and delete all this right here I'm gonna delete everything here and we are gonna start from scratch yes yes I love working from scratch so on the left side right here you'll see add category click on add category so we have burgers and then under the category description I'm gonna put the Lavery delicious savory burgers and then I'll click on save by default it'll create a picture for us now if you want to change this picture you can just click on change and you can add in your own so you can upload your own or you can use this image but for now I'll just leave that and for the name right here I'm gonna select Hawaiian burger as you all can tell I was using this app for quite some time so it took me quite a bit to learn how to use it and for the Hawaiian burger I want to charge people 10 bucks now the Hawaiian burger is gonna be the most delicious burger ever so that's what the Hawaiian burger is delicious right now let's say for instance we have the Hawaiian burger if you saw I saved it I want to add in an image the Hawaiian burger so here I'll click on image I'll browse and under my pictures here I will go ahead and upload a picture of this burger delicious delicious now there's one more thing that you can do here so if you want to edit the Hawaiian burger let's go back and click on this little pencil and we can have multiple sizes so we can have the normal size or we can have the big size now you can also do something like making it a combo so you can add a combo if you want but we can also add the combos on the add-ons as well so it just depends on what you want to do here but let's just say we have medium and then we also have large which is a $5 extra so that's pretty much standard so let's say for instance you're a Thai restaurant and you want to offer a pad thai you can offer a pad thai is the base version and then if they want extra pad thai or the large pad thai you can just hire them a five-dollar fee so now that we have the Hawaiian burger let's add in the Texas burger and Texas burger it'll be 5 bucks and the same thing let's see no there we go oh and this one was actually here I'll add at this one this one was better than the Texas burger ah yes so the Texas burger is five dollars and yeah I mean that's pretty much it multiple sizes I'll just do medium is 0 and then for that I will do large now one thing that you might want to do here for their burgers is instead of adding the size you can add the cooking type so you can put like medium medium rare you know well-done you know extra crispy but whatever they want to do you know so I'm just giving you ideas because you don't have to use it you can use it any which way you want as long as it achieves what you're trying to do is basically what I'm trying to say so under the Texas burger let's add in an image there so we'll go ahead and put in the no no no no no oh there we go oh yeah there we go well I use this for Hawaii but whatever you guys get the point alright so now we have two burgers but what goes with these burgers you know can they add stuff to it so let's do that so on the left side I'm sorry on the right side under ad group we'll do something like toppings and I'll save this now what goes on the toppings well Angus beef all right another $1 okay beside the cheese for $1 let's add the no will do see what else we got here we'll do ranch for $1 and what else goes on a cheeseburger uh onions I mean I'm really gonna charge onions are we really gonna charge onions for $1 all right we're doing it yeah so so we have our toppings now so let's say for instance okay we have the toppings but how do we apply it to the certain food right well we just drag it guys that's it just drag it drag it drag it and drag it now I could have just done link to all sizes as well but you know just showing you guys how to do it step by step and then let's say we want to do combo so we have a combo now so we have just the basic combo which is a zero dollar price or we have the large combo which is five dollars extra so we can also take the combo and we can add it to the cheeseburgers pretty cool huh so let's go ahead and I was going on there okay okay okay it's getting weird it's getting weird sometimes it happens so now we have the burgers and we have different types of burgers so congratulations we just made we just made burger with various toppings and combo add-ons so let's just go ahead and do one more now you don't have to follow me here but I'm just going to go ahead and make hotdogs so under the name right here I will put the Wilson dog this is going be $10 and the Wilson dog there we go and you know multiple sizes sure why not we'll do medium zero and then we'll add in the large size right that's another $5 so they want a large hot dog it's gonna cost them another $5 so we have the Wilson dog and I will add in an image for the Wilson dog hope you guys are following me here I hope I didn't lose anybody yet sigh think this is pretty easy rights I mean that's just because I've been using WordPress for like like five six years already so alright and then we have the YouTube dog so the hot dog is super amazing I'll save that and then give the Youtube dog a picture I believe it was this one here okay awesome and I'll cancel that so I'll go ahead and give this also a size so I'll just give them medium four zero zero right cuz that's that's like standard right you know so and then we'll just do a large hot dog the large hard log is gonna be five dollars extra now one thing I want to do here is we have toppings but we also have combos so I only want to take the combo this time because I don't want to use the toppings I mean how am I gonna put ranch or I don't know do you guys put ranch on your hot dog I don't know it's it's a mystery I think I had an ex-girlfriend he used to put like ketchup and ranch on her macaroni and cheese or something like that I was weird are we doing so anyways we have our products and everything's pretty much sets so that's it guys we are all done now at this point I've given you enough knowledge and information to kind of keep going you can go ahead and add different toppings different combos you can create another you can add another one for I don't know a dessert maybe you can put a do you want to add a lava lava cake dessert or something like that you know you can do that as well so now that we've done this let's go back to our websites so we've done step one and we have also done step two next let's go ahead and publish this on our websites so next let's click on publish and this is a short code so we have a short code for the menu and also we have a short code for the table reservation so let's do that now what I'm gonna do here is I'm gonna go ahead and open up the website under a new tab and I will edit with Elementor so I'll show you how you can add these to your websites so on these buttons right here I want to delete these I want to add the buttons that they give us so these are short codes so what we'll need to do is we'll need to take these short codes and put them on our websites now one thing I want to note here is I if you click on customize you can customize the color you can customize the size you can customize the font you can customize pretty much everything that you want to add to your website to kind of make it match and to make it look like you know it's not coming from another program but when it is but people visiting your website won't know that so who cares you know so I'll go ahead and take this one again copy it's now under the widget right here Elementor actually has a shortcode widget so you see how i typed in shortcode you'll take the shortcode first we'll right-click and delete this right click and delete this I'll take this shortcode and I'll drop it in that box then I will paste the shortcode and click on apply I'll go back here and I'll take this one now and then I will do the same thing again so a shortcode put it in the box and then I will paste it and click on apply and I will click on updates all right awesome now let's go ahead now and test our website and see if this is actually working because right now we just see this text so let's go back over here and go to view page all right and there we go our buttons are live now I do need to move this button then I'll show you how to do that in just a bit but let's click on these buttons and see what happens so see menu and order alright awesome we have the Hawaiian burger we have the Texas burger we have a picture of the burgers awesome so we have the Wilson dog and the YouTube dog so let's first click on the Hawaiian burger oh look at that we got medium and we got large we also have all of our toppings we have the combo where where they can have the basic combo and the large combo let's look at the Texas burger so let's go ahead and go through these so let's just say for instance I clicked on a large so it went from zero to five so it's being charged five dollars we have these add-ons right here right you see it's nine dollars I will add in two large combo and then something like you know even in the special instructions maybe you can put the cooking tight but maybe you should have like the you know the cooking type here like medium rare and stuff like that so I'll go ahead and click on add to the cart next we have these three options so you can see here how it's placed in the cart so on the top right here where these three icons so I'll click on this little eye icon and this is just displaying the hours it's showing where we deliver it's telling everybody the fees and they can also change their language at any time if they need to do so they can also see the phone number so they can give you a call but I'll go ahead and click on the checkouts so we have the contact we have the ordering method we have all the food right here so the ordering method they can do pickup delivery table reservation and order ahead they can also choose a specific time if they want to do that so I'll click on pickup and then under the choose time we can say something like later so today around 11:45 now remember how we set the condition or they have to order at least 60 minutes or think it's like a 90 minutes into so right now it's 10:30 for me so let's say for instance I mean let's just do something practical you know tomorrow at like you know 12:00 p.m. or they can just order now and click on save and then payment method so we haven't gone over a payment method just yet but for now we'll just do cash and then I'll click on save so I'm just telling them basically that I want to come in tomorrow at 12 o'clock and I'll pay cash and here I'll place the order for pickup next it's going to place the order where you're going to approve it on your smartphone or in your email inbox once approved the customer will get a notification in their email inbox and they'll receive this beautiful screen or it'll tell them that their order is confirmed and they can pick up their order from 30 minutes from we put tomorrow at 12 o'clock right something like that so that's just an example of if you want people to order it in the future you don't have to add that feature but that's if you decide to have that so congratulations people can now order on your website now remember if you want people to basically order within a certain time frame which makes a lot more sense you can go back to your menu ordering and go to get started so I had the option of ordering ahead in the future and they can order like at 3:00 4:00 or 5:00 a.m. that might not be practical for everybody depending on what hours you serve so for example right here under the order for later or I'm sorry the was at the opening hours we can do something like you know something practical here so something from what is it something from something from 10:00 a.m. to something like you know cuz who delivers at 3:00 in the morning so there we go so that's that's fair right 10:00 to 10:00 so if someone orders for later they can only order within the times of 10:00 a.m. to 10:00 p.m. so this is how you can always adjust things and kind of modify it to fit your restaurant needs next let's talk about the booking and then we'll talk about how to fix this and then we'll talk about how to accept payments on this website so for table reservations I will click here and I'll say how many people remember we have two and then the maximum is 8 right so I'll just say 4 people we can select the time so I'll just say you know what Wednesday at at a 1:00 p.m. you notice here how the times changed how it's not 24 hours anymore because we changed that in the option so it only goes from 10 o'clock to ten o'clock but I'll just do something like a 1 o'clock and then I will click on next and say would you like to order ahead no that's ok well order the restaurant that's a little bit too much right so let's click on place table reservation now now as the business owner you'll receive an email saying do you want to approve this reservation and you can approve it or not so just make sure to check your email inbox and then that's all good to go all right now one thing I want to do before I go on to the next section is I want to show you how to change this little box how its kind of looking weird right there so you can actually manipulate these icons even though they don't give you the option so let's click on edit with Elementor and we have this shortcode so the shortcode just a bunch of gibberish right here so we'll need to do is well going over to advanced and I will simply go ahead and find ok so let's go to our column right here and I'll click on this little icon and on the Style section we were going to see typography under typography under the text align I will put this to the rights so now what it's doing is that it's basically taking that same column and applying it to the right side to make it look a little bit more even so let's click on updates and now let's go to view the page and see what changes are made to our websites and voila now it looks really professional it's aligned perfectly and it just looks great so I've saved the best for last so now that I've shown you all how to accept orders on your website let's talk about how you can accept payments with your online ordering website ok so in this last part of the video I'm going to show you all how to integrate payment methods like PayPal and stripe on to your website so you can start accepting payments on your websites now I'm gonna go to my dashboard here really quick you remember the account that you use to log in now when you first started this application you created a username and a password or an email and a password now we're going to take that same email and password and we're gonna go to Gloria food calm now there is a link below to Gloria food calm and once you're here you'll click on log in now remember the same information that you use to log in right here you'll go ahead and put right here so I'll go ahead and use the same login information and click on login if you're not sure just go back to the other or just just check it out your check your email and you should be able to find something there now there's other options that you get you get with this so there's a kick starter there's website quality and there's just other issues now we already connected our website with Gloria food the only thing that we need to do here is we need to go ahead and go to the settings tab and we need to go to payments taxes and legal I'm sorry the payment methods so we want to make sure that these are all checked right here so these are all checked then we can go ahead and go on to the next section on the bottom part right here we have payments and we have online payments so if you want to accept credit cards you will need to pay for this service so what I'll do here is say yes I want to accept and I'll click on yes now they're saying do you want to provide or do you want to accept credit cards now we're gonna use stripe and stripe is the easiest method to use out there and for those of you who are in other countries in stripe is not available we are also going to integrate PayPal as well so once you have those two setup you'll click on next alright so the fee for this service guys is $29 a month and that's really not bad at all because they're just basically the middle person and they are not holding your money they are just allowing it to pass through and they are going to gave it to payment merchants is like payment merchants like stripe and PayPal so I just want to be clear on that they will not be you will not be withdrawing money from this application they are just going to offer these service through their application so go ahead and click on subscribe now I'm going to go ahead and subscribe to this same service and then once I'm done with this billing information and paying for it I'll meet you on the very next page all right awesome so once you pay for it you'll be brought to this screen right here where your payment list fool so click on let's do it so the great part is stripe and PayPal are completely free to sign up so what you'll have to do is go on over to stripe comm and you'll go to create an account so you'll go to the process the verification process of creating an account now remember stripe is completely free so there is no startup cost and it doesn't cost you anything to get started you will need a bank account and that's pretty much it's alternatively you can also go to paypal.com so PayPal com again is another free service and you'll need to sign up with a business account so when you first sign up there is two accounts that you can use the sign up with so you'll see this screen right here it is a personal account and a business account you will need to select a business account and this will basically allow you to accept payments as a business because you'll need to enter an API key and you're only given that API key if you sign up with a business accounts now I have a business account for PayPal already and I also do have a stripe account as well so I'm gonna walk you through both processes just to make sure that you know how to set up payments for your websites so first we'll set up stripe so once you go to the verification process with stripe it's actually really really easy to get this setup on your websites so you have all these options on the left side all you have to do is click on API keys and then right here you have your secret key click on reveal live secret key and copy that you'll go back to your admin panel and then just paste that and you're done so whatever you get paid through your website it'll go to your stripe account and stripe will automatically deposit that money into your bank account automatically now you can set it to get transferred daily weekly monthly it really depends on your stripe settings and that's why stripe is like the number one online merchant service because it's super convenient you don't have to call anybody it's all already done for you so whenever someone pays you now with the credit card it will go directly to your stripe account so congratulations you have now set up credit cards on your websites all right awesome so my account has been successfully connected and now I can start using stripe now let's go ahead and use PayPal because sometimes people like to use paper so right here you'll see payments and then you'll see PayPal go ahead and click on PayPal now it's gonna ask you for your client ID and your client secret ID so again you will need a PayPal business account and what you'll do is once you make the accounts you'll see this log into developer PayPal com go ahead and click on that right there I'll go ahead and log into my accounts okay so we're okay so we're at PayPal developer now once you log in and again you can use this little link to log in you'll simply go to your name and then go to dashboard now you're going to go ahead and find your API I'm sorry your a your apps and credentials what you'll do next is you'll simply go ahead and create an app now sandbox is basically testing and live is real websites so what you'll do is just click on create an app and give an app a name so I'll just do the food web site create the app and that's it we're all done so all's you need to do at this point now is go ahead and paste the client ID right there so here is the client ID I'll go ahead and copy this and I'll paste it right there I will go ahead and paste that in there and then I will connect PayPal with my websites and congratulations we are now accepting PayPal from your clients so our website right now is a live website where we can start accepting payments and people can order on our website right now so let's go ahead and test all the hard work that we have done so far so at this point we have a fully functional online ordering food website where people can come to the website use their credit card and purchase an order stuff right away on the website so let's go ahead and test it out so here I'll click on the see menu in order and let's just order something so let's order a Wilson dog here I'll go ahead and select a large Wilson dog with a large combo for $10 and that's pretty much it I'm not gonna go crazy because I'm actually using my own credit card here so here I'll click on add to carts now again right here you'll see that everything looks good I didn't have to change the orders because right now guys it's almost 12:00 at midnight so the original store that we set was 4:10 p.m. so I had to go ahead and change those settings once we're done with that oops sorry about that I closed that once we're done with ordering that I'll click on the cart and now we'll just go ahead and fill out the information under the contact all right and then the ordering method I'll go ahead and say you know what I want this to be for a pickup I'll say that's choose a time now and then for the payment method I'll go ahead and select a payment method so here we have cash card a pickup callback card or PayPal so we can use PayPal or we can use a card I'll go ahead and use my live credit card on this video to show you that this is a fully functional online food ordering a website or is that as I say online food or a website alright so it looks like we are all ready to go so I just added my credit card here and then I will click on place pick up order now so right now I'm going to approve the order on my phone or via my email so I'm on my phone right now and I just got the order so it's the same price ten dollars and sixty nine cents so I will go ahead and approve this order and once it's approved by the restaurant we will then get a notification letting us know that the order is approved and everything is all good to go so the order was approved and we can pick it up in 30 minutes so congratulations this website and tutorial is basically done now let's just go ahead and quickly go to our stripe accounts to see if that money went to our stripe accounts so I'm at my stripe account and the payment was captured so right here in her payments you'll see that we got an order for 10 dollars and 69 cents and this money will go directly into my bank accounts so that's pretty cool so at this point guys you are all done I've showed you all how to create the website I've showed you how to modify it make changes and then I've showed you how you can accept payments on your new website I really really really hope this tutorial helped you out if you guys have any questions please feel free to let me know in the comments below also be sure to check out the Elementor pro video and I will leave a link below to purchase Elementor Pro if you decide to go that route and just give your site a lot more functionality my name is Dara Wilson I wish you all the best and I will see you guys all in my next video guys take care
Info
Channel: Darrel Wilson
Views: 170,268
Rating: undefined out of 5
Keywords: woocommerce food ordering, how to create a restaurant website, how to create a restaurant website in wordpress, food ordering website, food ordering system, woocommerce food ordering system, wordpress food ordering system, online food ordering system, woocommerce restaurant online ordering, online ordering system, online food ordering system project, wordpress food ordering, wordpress restaurant online ordering, gloriafood, restaurant ordering system, gloriafood wordpress plugin
Id: k-wS9hGiyU8
Channel Id: undefined
Length: 72min 48sec (4368 seconds)
Published: Tue Jun 16 2020
Related Videos
Note
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.