How to Make a FREE Restaurant Website in WordPress | Phlox Theme & Elementor Tutorial for Beginners

Video Statistics and Information

Video
Captions Word Cloud
Reddit Comments
Captions
hey what's going on guys my name is jim fahad in this tutorial i'm gonna show you how to create this beautiful restaurant website in wordpress we will be using a free theme a free page builder and all free resources by following this tutorial you can have your own restaurant website or you can make a website for your client who owns a restaurant and we will be creating everything just by drag and drop you don't need to know a single line of coding let's now have a look at what we're going to make in this tutorial so first we will be creating this amazing restaurant website's homepage i will show you how to create this beautiful banner section how to create this type of beautiful featured food section and then i will show you how to add this type of food menu a complete food menu list into your home page and then we will have main course section here you can select some of the chef selection foods and then you may add some other featured food section and next here you can feature your proud shapes then i will show you how to create this type of call to action section with the beautiful button also how you can add your customers review inside of your home page and then i will show you how to customize this type of footer on all pages of your restaurant website and here i will show you another amazing thing how to collect email addresses of your customers by using this type of form so let's say in future if you have any discount or offer you can email hundreds or thousands of customers at a time using this email automation process then here you can describe your open hours also you can provide some contact information here and then at the very bottom you know here is some copyrighted stuff i will show you how to do that as well and then if we click on this go to top button that jumps to the top of this page now let's have a look on this beautiful header i will show you how to create a logo using an online tool and it's completely free you can just create that and insert into your website i will show you how to play with this navigation bar how to add your social media handles into your website header all right now let's go to our next page there's our about us page so here we have got our about us page here i will show you how to create your featured section here you can talk about your restaurant you can put here your featured dish or maybe your shapes group image and then i will show you how to create this type of beautiful cards where you can put all your best features and then on the about us page you can feature one of your best shapes i will show you how to edit this text how to edit these paragraphs everything and then here you can also add a call to action area and you know here is the global folder let's now go to the next page that's the menu page so here on the menu page you can feature all your foods into different food own food catego how you can change these prices how to change these images with your own images or let's see if you don't have your own image i will also show you how to collect this type of beautiful images from free stock photo websites so here in this menu page you can put your different dishes like dinner here's the different food names here is the desserts here you have got the main course if you have more categories then you can add them just by copying this and pasting that then here you can put some chef selection foods and you know here is the global fooder and also i will show you how to contact with you through your website so let's go to the contact page so here on the contact page we will have our beautiful contact form it's a 100 functioning so whenever anyone put their name email address subject and message and then if they enter the submit button you will get all this information on your email immediately then i will show you how you can put your restaurant google map address inside of your website also how to put your address phone number or working hours inside of your contact page and here we have got the global footer all right we will be creating this beautiful restaurant website in easy four steps first i will show you how to get your own domain name and web hosting i will also provide you a 50 discount code then i will show you how to install a free page builder plugin called elementor and then we will be installing a free theme called flux and lastly we will be customizing our amazing website also i will be adding a time stamp in the description so you can always jump to the necessary part you need let's now start with the step number one which is to get your domain name and web hosting so first of all what is a domain name domain name is basically your website address like facebook has facebook.com amazon has amazon.com i have jim fahad digital.com similarly for your website you need a address that will be yourwebsitename.com and what is web hosting web hosting is the storage space for your website all the images takes you will have in your website all will be stored on your own web hosting as you are owning your own web hosting so there wouldn't be any limitation you can run ads you can upload any text or images you can upload any themes or plugins you want you are in charge of your own website okay now how to get your own domain name and web hosting so first just click on the very first link in the description below this video or you can go to jim fahad digital.com forward slash hosting and this will take you to a special discounted bluehost page so why bluehost in my opinion bluehost is the best web hosting provider i'm a web developer i tried so many other web hosting companies i don't want to mention their name but i personally ended up using bluehost hundreds of my clients using bluehost and they never complain about using it if you see my bluehost account i have hosted tons of websites here and i never get a downtime their customer support is really cooperative in case you need any help and their price is really affordable that's why i always recommend bluehost so now click on get started here you can see their different plans the main difference between them with the basic plan you can host only one domain you can take their plus or choice plus plan if you want to host unlimited domains also you can take their pro plan if you have millions of visitors on your website already i recommend starting with the basic plan then in future you can upgrade that anytime now let's select the basic plan now we will select our domain name if you already have a domain name that you want to use you can just go ahead here on the right but for now i'm gonna get a new one now here let's try for something like apple.com and click next it says the domainapple.com cannot be used on bluehost please try a different domain name it should be because we cannot take that because we all know that's apple's official website so we will be typing our own domain name here and also if you click on the right side you can see dot site.net.info websites i always recommend to take.com websites because it looks more professional and legit so i'm gonna type here let's say our dot elementor.com as we are going to make our website through elementor page builder and now click on next it says our elementor.com is available that's awesome and here we need to put our account information i'm putting mine here really fast only to not make you bored okay here you can see the business name field if you don't have a business just keep it blank or put your full name but here is the most important thing that's your email address make sure you put your correct email address because after completing purchase a receipt will be sent to that email address so make sure you put your best email address here all right now scroll down here's the package information and it's automatically set to 36 months and this is gonna be your cheapest plan so yes you're paying for 36 months up front but it comes out to only around 3.95 cents a month so this is 50 off that's gonna be your biggest discount now what i recommend is to just do 12 months if you don't want to commit to the 36 months or 24 months it's still 33 saving and it's only around 5.95 a month and you also have your domain name for 12 months so no more additional cost for your domain for these 12 months and here you got package extras first here is the option for domain privacy having domain privacy is good and i always recommend having domain privacy so no one gets to know who is the owner of the website but for the sake of this tutorial i'm deselecting this one let's click on turn it off because i don't wanna hide myself at this moment i want to be transparent so if anyone knows i own this website i have no problem you can keep this one checked if you want not a big deal i'm also deselecting all other options they are offering we actually don't need that they are just upsetting their stuff all right now you can see the price is now only 71.40 for the full year including the domain that's awesome and i'm legally obligated to tell you that this is my affiliate link so i do get a little bit of commission off of this but it does save you a ton of money and it helps fund these free youtube tutorials what i'm doing so everybody wins i really appreciate it and here is the payment information i'm putting my credit card number here expiration date and cvv code then select this one here so that you are agreed to their terms and policy now click on submit it says your purchase was a success also you can see here is your receipt they will also send it to your email i'm also waiting to get that email meantime we can create our bluehost account so let's click on this create account button here here's the domain name that's automatically selected now let's create our password create a really strong password combining capital letters numbers special characters you know how to make a strong password and then retype the password in the second field now check this once again that you have agreed with their terms and policy now click on create account i already have received an email to confirm my purchase so i'm opening my email you will also get an email like this then click here verify your email it's very important so it's not verified awesome now let's login into our bluehost account with the domain name and password we have just created if you are logging in for the first time you may see a pop-up like this like it says let's create a website bluehost actually want to help you to make the website just click at the very bottom there i'm not creating a website because i will be showing you everything step by step and skip all of these pop-ups because we don't need any of that cool we have successfully registered our domain name and web hosting [Music] congratulations so far if you have any questions please let me know in the comment section i will try my best to help you personally so now we can move on to step number two which is to install wordpress and for some reason if you logged out then login again now from left menu bar click on my sites then you can click here create site or here create a wordpress site i'm clicking here sometimes after clicking on my sites you may see these my sites from there just click here on add site then you can see here two options one is limitless customization and another one is fast easy site building as we will be creating our website using an amazing page builder the elementor page builder that's why we will be selecting this option the limitless customization so just click here on get started so let's now add a site name and site tagline we can change that anytime so i'm putting a site name jim for production and the site tagline it deserves to be seen now let's click on advanced here you need to put your email address your username and password for your wordpress so i'm putting my email address here wordpress admin username i want to name it jim fahad and here let's put a password do you want to see my password i'm clicking here on show so it's abc123 i will of course show you how you can change it later so for now click on next close this browser popup now it says where we want to install our wordpress so make sure you keep this directory blank and here is your domain name selected and bluehost here is suggesting some free plugins but we don't need that let's deselect this all now click next awesome it says wordpress installed successfully now you can copy this informations right here and save that somewhere on your computer where you can access it again later and click here to show your password actually i intentionally gave this an easy password that's abc123 never ever use this kind of easy password i'm showing you shortly how you can change that password we can now sign into wordpress by clicking here but this is not the usual way because all the time you cannot login this way i mean from this page this button right so you should get used to signing into wordpress all the time is by going up to a new window and typing in your domain name forward slash wp dash admin so i'm typing here my domain name our element dot com forward slash wp dash admin and click enter so we can see our wordpress login page here that means wordpress has installed successfully sometimes it takes 30 minutes to 24 hours to process this installation and this process is called propagation it basically has to let everyone know that hey this new domain name now exists and registered but we can see our website instantly they actually say it might take 30 minutes to 24 hours but i've been using bluehost for more than 10 years i always get domain live immediately actually that's another reason why i love bluehost so now you know that your domain name is working so go ahead and i'm just gonna type in my name which was the user that i created and i'm gonna type that easy password abc123 you can click this eye icon to show it now let's click on login so we are now inside wordpress admin panel or wordpress dashboard so from here i will be showing you everything step by step first of all let's click here on the dashboard from the left menu bar by the way don't worry about all these links because during this tutorial i will explain about all these options for now i just wanna clean up the wordpress dashboard so let's close this one now let's minimize all of this also let's minimize this this one and this one also let's close this notification pop-up and here you will also find another option says screen options from here you can just turn off all of them because we actually don't need any of them right now so i'm disabling everything and click screen options again all right now before doing anything i just want to change that easy password that we have given at the beginning of this tutorial so to change that is a password from here if we hover over on user from there just go to profile and here you will find admin color scheme this is the default one if you want you can change it to light or you can change it to modern actually it doesn't matter because only you can see this color scheme so i'm keeping it the default one and then if we scroll down here you will find the option for display name publicly as so let's say in future if you wanna run a blog and then there you may want to display a name as the author of that blog post or the owner of your website like if we have a look on this blog post here you can see it's by jim fahad jim fahad is the author of this blog or of this website so you can change these author names from this place so let's see here you can see this play name publicly as by default i am setting it to jim fahad but also i can change it to other name by giving it a first name last name all this but let's keep it the way it is also you can change your email address from here all right so let's now change our easy password to change it from here under the account management just click here on the set new password here wordpress is suggesting a very strong password but i want to create a password that easily memorable for me so first i'm clicking on this height so you can't see my password and here i'm giving a password that easily rememberable for me though it says weak but for now i'm happy with it so here i'm clicking confirm use of weak password now scroll down and click on update profile all right and like i said now i wanna clean up my wordpress dashboard a bit more so to do it i just wanna delete all the unnecessary plugins now from left if we hover over on plugins we can click on install plugins so here we can see some plugins that came with wordpress default but actually i don't want any of these plugins by the way if you wonder what is a wordpress plugin wordpress plugin is basically extra add-on or extra app like thing that extend the functionality of your existing website let's say if you want to do some seo work for your website there is a stand alone plugin for that so you need to install that plugin and use that actually each plugin has its own purpose but on a restaurant website we basically don't need any of these plugins so first i just want to select all of them you can click here one by one to select them or if you click here you can select them all together and then from here bulk action i'm clicking on deactivate then click on apply now after deactivating all these plugins let's now select all the plugins again now from bulk action click on delete and then click on apply now browser popup says i'm sure or not yes i'm sure so click on ok so now our all unnecessary plugin has been deleted actually personally i like to work in a very clean environment so i always delete the unnecessary things now from left bar let's go to pages to all pages here we can also see some pages that came with default wordpress installation but we don't want these pages with our website so i'm selecting all and from bulk action click on move to trash and then click on apply so all the default or unnecessary pages has been deleted now i just wanna do another basic settings so to do that just hover over on settings and from there let's now click on permalinks from here you see the permalink settings is set to plane by default but i wanna set it to post name why am i setting to post name because if we have a look here if we set the permalink to the plane then for example if we have our about us page that url would be like our website name.com then this type of bizarre word number so instead of plain if we set our permalink to post name then our about us page url would be like our website name.com forward slash about us so it's easy to remember also it's good for search engine optimization so here i have set it to post name now scroll down and click on save changes so we are almost done with the basic settings of our website now i wanna install our page builder plugin and you know we will be using elementor page builder so to get elementor page builder for free you can just go to jim fahad digital.com i will put this pages link in the description from that page if you scroll down a bit here you will find important links from there you can see here download elementor free version just click there then eliminator free version will start downloading automatically now let's go back inside wordpress dashboard and from left here if we hover over on plugins from there just click here on add new now from top here you see upload plugins click there now click here on choose file so this is the file this is the elementor free version we have downloaded recently select it and click on open and then click on install now now click here on activate plugin awesome we have successfully installed elementor page builder plugin so at this point let's now have a look how our website is looking so from top if we hover over on our site name then here you will see the visit site link i'm opening it from a new tab so let's now have a look right now it looks super boring super plain so we need to create our beautiful restaurant website out of this now the first thing we need to do we need to change the theme of our website because this look and feel is coming from the current theme and we will be using other theme to make it really cool all right so to change our theme let's go back inside wordpress dashboard now from here if we hover over on appearance from there just click on themes and here you can see the 2021 theme is activated also here you can see some other themes that came with wordpress default actually you know what i don't wanna use any of these i wanna use another theme called flux so to add another theme we need to click here on this add new button also you can click here on this big add new button i'm clicking here so from this place you will find a lot of pre-made themes and like i said theme is basically the look and feel of your website so now from the top right corner here i'm searching for a theme that's name is phlox here it is so from here just click on this button says install and then click on activate awesome we have successfully installed the flux theme because here we can see the activated theme is the flux theme now here at the top we can see a pop-up it's not actually a pop-up it's just a notification bar so it says thanks for choosing flux to take full advantages of phlox theme and enabling demo importer please install code plugins so now click here on install flux code plugin alright it is started installing and right now it's activating and here we go it says welcome to flux theme and just make sure you are under this flux tab from the left side so from here we can see this is the dashboard and here is the demo importer here is the template kits we will be going under the demo importer there all right here under the demo importer we can see there are lots of pre-built demo websites and here if you have a look some of them are free and some of them are pro like here if you see the green import button that means these are free and if you see this pro only badge with it you will only get that with their paid version of the theme by the way on their paid version they have really unique and awesome designed pre-built websites i will also put their paid version themes link in the description but for now we will be using a free demo website and here one thing i don't like about them they should have a search bar here but i talked with them and they have insured me whenever you are watching this tutorial you will find here a search option from the search bar you can just search for classic restaurant but as right now there is no search bar so i'm manually searching for the classic restaurant so let's scroll down i'm searching for the classic restaurant one and here we go just make sure that's name is classic restaurant all right now click here on this green import button and here is a notice and it says for a better and faster result it's recommended to install the demo on a clean wordpress website and yes we did that because you remember we have deleted all the unnecessary plugins and all the unnecessary things from our website because they recommend to install this demo starter web template on a clean wordpress website all right we are good to go now let's click here on this continue button and now it says we need to install these three plugins one is contact from seven then wpu like and another one is mailchimp for wordpress but you don't need to go back to wordpress plugins and install them one by one if you just click on this install plugins these all plugins will be automatically installed so click here on install plugins all right the first plugin is already activated now it's working with the second plugin it's also activated all right all those necessary plugin has been installed and activated and then it says remove watermarks so when we will import this starter template we'll get all these images all this text but with these images we will get some watermarks over these images because it makes clear sense some of these images are paid or the images has copyright so we cannot use those images into our website without those licenses but if you have inverter element subscription you will get those images then you can just click here on remove watermarks but i'm assuming most of you don't have inverted element subscription so i'm clicking here on this escape button and then this option is very important it says import data content of flux theme so if you want you can select this one selected data only then you can select only media posts or pages and menus but i don't recommend this option select the first one that's the complete pre-built website then click here on import content and then it says it will take 5 to 10 minutes please do not close or refresh this page all right we are waiting and like it says it will take 5 to 10 minutes so i just don't want to make you bored i'm coming back after five to ten minutes all right i'm back and it says congratulations demo has been successfully imported and for now let's just close it to check it it has successfully imported we can now go to pages from here on the left if we hover over on pages then let's click on all pages and boom inside our pages we can see we have got here pre-built about us page contact us page home page and the menu page also if we go to the plugins from here let's click on install plugins also here we can see they have automatically installed all the necessary plugins awesome and now if we want to have a look how our website is looking right now then from the top left corner let's click on the visit site i'm opening it from a new tab let's go to the new tab and here we go here we can see our beautiful homepage here we have this beautiful section with images and the headlines here we have got another section with nice overlapped images here you can feature all your special dishes then if you scroll down here we find tasty menu today nice menu list with price with it and then here is the full menu link and then underneath here we'll find the popular main course section let's scroll down and have a look what we have got also here is the shift section so here you can feature your best shapes here now let's scroll down here you have got nice call to action section here is the client section i mean here is the client's testimonial section and here we have got the beautiful footer and like i said on the images you can see the watermarks but i will show you shortly how to remove these watermarks i mean you cannot actually remove these watermarks but you can put here your own images and let's say if you don't have your own image i will also show you how you can find the similar image for free and use that inside of your website alright so far it looks great and i will be showing you how to edit this i mean you can edit all these headlines all the background images all the text that way you want and you can do that very easily just by drag and drop so let's now start editing our homepage first so to do it let's go back inside wordpress dashboard and from left let's click on pages to all pages like i said we will be start editing with the homepage first here we can see our home page and from there let's now click here on this button says edit with elementor and here is the fun part begins because we can edit everything inside this awesome page builder says elementor page builder we can change all this text all these backgrounds we can basically change everything you can see inside this page but before we start customizing our page i want to make you a bit comfortable with elementor page builder let's say if you don't have this pre-made template then how could you create your own website using only elementor page builder okay so here i'm just giving you an example let's say in between the first section the hero section and here is our second section if you want to create a section in between these two section you just need to click here on this plus icon then once again click on this red plus icon and from here you can select any of these structures like single column structure two column three column or any of this structure for example i'm selecting the single column structure and for example this is our section and if you now want to give this section a height you can give it a height from here on the left you see height from here let's set it to minimum height and here you can see minimum height is set to 400 pixel so here we have got 400 pixel space if you want to increase the space you can just drag this bar to the right you see it's increasing so the basic idea is whatever you can see within this blue border or blue line that's the section and inside a section we have a column here you can see a column icon and now inside this column you can put any element or widget so to access any element or widget you just need to click here on this rubik's cube icon now let's say if you want to insert a video inside here then from left here you can see a video widget or video element you can just simply drag this video element inside here and here we go we can see here a youtube video if you want to change this youtube video to other video on the left side here inside this link field you can just paste your youtube video link not only youtube if you want you can put here vimeo daily mission or self-hosted videos now let me give you another example let's say if you want to add some text by your own then again click on this rubik's cube icon and here you will find a heading widget now let's drag this heading widget at the top of this video here i'm just dropping it now you can change this text from left so let's say from here i'm just changing this text to my restaurant now if you want to make it centered align from here let's make it centered aligned also if you want to do some styling with this heading then you need to go under this style tab from here you can change the text color by clicking on this color picker you can make it black you can make it red or any other color from this bar i'm making it red for the moment and also if we click here on typography let's click on this pencil icon from here you can change the font family here is a huge list of fun families all these are google fonts so for example here i'm selecting the alert of font you see it's instantly changed also if you want to increase the font size you can just drag this bar to the right you see it's increasing also you can change the font weight from here let's see if you want to make it really bold so let's set it to 900 it's already 900 now you can change the transform from here so i'm making it uppercase you can change the style to italic you can change the decoration let's see if you want to add underline with it so let's click on underline you see here is underline added instantly and now let's say if you wanna add some space at the top and bottom of this text or heading then you need to go under this advanced tab so i'm clicking on advanced now let's add padding from here so for example i'm putting here 20 pixel of padding you see 20 pixel of spacing has been added at the top left right and bottom now let me give you here another example let's see if you want to add a button underneath this heading then again just click here on this rubik's cube icon and here you will find the button widget so just drag this button widget underneath this heading here so here you can see the button you can make its alignment to center from here now instead of click here if you wanna say it show more you can change the text from here so here i'm typing show more then you can link it to anywhere so you can link it to other page of your website or you can link it to an external website the way you want also you can do its styling from under this style tab let's say you want to change the text color or background color so you can change the background color from here so here i'm just making the background color to red color like this actually it's pretty easy pretty simple so the basic idea is whenever you wanna do any work with any specific element you just need to click over this element then you will find the style tab you will find the content tab and you will find the advanced tab you can do all this spacing stuff under the advanced tab you can do all the styling stuff like the typography or the color from under this style tab and you can do all the layout stuff under this content tab like changing the main text changing their alignment all these and for example let's say if you have changed your mind and you want to change this video it's very simple just hover over on this blue pencil icon right click here and click on delete it's instantly deleted it's simple like this but as we're using a pre-made template so we don't need to do everything from scratch i was just trying to give you an idea how to do anything using elementor page builder very very easily so this was just for example i don't want this section so to delete this section just click here on this x it's instantly gone so here's the fun part begins now we will be just customizing this pre-made website the way we want so let's first start from this hero section first i want to change this background image because it has a overlay with it not overlay it has a watermark with it i don't want that i want to use here another image if you have your own image you can put that image here and let's say if you don't have your own image i'm showing you shortly how to find the similar images all right so first of all i just wanna select this section and to select a section you need to click on these six dots but we cannot select the six dots because there is a header at this place but usually if you wanna select any section you just need to click on the six dots of the section like here if you wanna select this section you need to click on these six dots if you wanna select this section you need to click on the six dots but here on the top hero section we cannot select these six dots because there is a header but no worries because there is another way you can select the section by just right clicking on any of the empty place so here i'm putting my cursor here and right clicking here now click on edit section then from left let's now go under style tab here you will find the background images coming from this place so now if you want to change the background image just click over this image then go under upload files from here if you already have your own images you can just click on the select files and then you can upload your own images but let's say if you don't have your own image then you can go to some free stock images website for example you can just go to pixels.com or you can go to pixabay.com i'm now going to pixels.com and here you can search for any type of image let's say as we are making a restaurant website so here i'm searching for food images let's hit enter so here you can see there are 92 000 plus images so you can just search for the images that's appropriate for you so for example we are now looking for an image that will suit with our hero banner so let's have a look we can use this image on our banner so let's just click over this image now you can directly download this image by clicking on this free download but i prefer to click here on this right down shape down icon so you can choose any of the size because the original size image is very heavy that will take a lot of space on your server also it will make your website heavier to load so i'm selecting the medium one and then let's click on download selected size all right it's downloaded now let's go inside our wordpress dashboard now from your computer you can just drag the image inside here so this is our image that we have just downloaded from pixels.com let's select it and click on insert media here we go by the way i want to show you another thing like here we can see the background it's kinda light background and our font color is white as well so it's not very easy to read now i want to add a overlay effect with this background image so we can read all the text properly to do it from here we are under now background let's scroll down here you will find background overlay now click on background overlay from here background type click on the classic icon and from here i'm choosing a color i'm selecting a black color you see now there is a black overlay effect over our background image also you can change the opacity from here if you move the bar to the right you see it's becoming more darker if we move it to the left it's becoming less darker so i just want to keep it like this let's keep the value to 0.3 perfect by the way i will also provide some images so you can use that on your website to get all those images you can simply just go to jim fahad digital.com i will put this pages link in the description from that page if you click on the download the images plus templates i use in this tutorial then you will get a zip file and after unzipping it you will get all these files so here inside home page you will find all these images and inside the about page you will find all these images all right now let's go inside our page builder so first here instead of this background image i want to use one of the background image that i will provide so let's just undo it so from here color i'm undoing it by clicking on this clear icon and let's go under background now let's change this image to the image that i will provide so i'm uploading that image from here click on select files now inside the home folder let's select this image and click on open and then click on this insert media button here we go and now everything is super simple like if you want to change these texts just click over this text then on the left you will find all the options so from here you can change the text so for example if you want to change this text that says we are the best you can change that from here it's under the heading tab and then here if you wanna change this text that says forget mediocre restaurant then you need to go under this one secondary heading so here i'm just replacing this text with for example best restaurant then here i want to say in town now you see it instantly says best restaurant in town as it says best restaurant in town so from top i just want to remove the base text so go under heading tab and from here i'm removing the base text is gone now if you wanna change this paragraph text you can just simply go under this description tab and from here you can replace this text with your own text it's simple like that now let's have a look how to work with this button so just click over this button now by default it say read more but here i wanted to say see our menu and then i want to link this button to our menu page so here i'm putting our menu page link that's http is colon forward slash forward slash our website name forward slash menu so you just need to put the url that you want to connect with this button by the way i will of course show you how to change this logo how to work with this navigation how to put social media links but we need to do this stuff from our theme customizer so we will be doing those a bit later before that let's now work with the next sections so here on the next section you already understand if you want to change anything for example if you want to change this heading you just need to click over this then from left you can change the text from here if you want to change the secondary line then just click on the secondary heading then you can change the text from here it's simple like that also let's scroll down from here if you want to change this image just click over this image then you can upload your own image or you can get any image from pixabay.com or pixels.com then if you want to change this text just click over it you can change the heading you can change the paragraph from left side so for now i'm just quickly replacing these images with my own images you will also find these images on the description so i'm quickly replacing these images and coming back to you and here we go by the way if you wonder the images are stacked with each other but they're actually not because the left bar that's the elementary bar it takes up some spaces if we just minimize it by clicking here now we can see there are some spaces in between them so right now they are looking great alright let's now expand it and let's now go to our next section here you can feature some of your special dishes so you already understand you just need to click over this text then you can change the heading you can change the secondary heading you can change the description from here also if you wanna do anything with this button just click over this button you can change the button text and you can put the button link here and now everything is super simple if you want to change this image just click over this image and you can replace that from here also if you want to change this image from right side then just click over this image and change the image from here also we can see here a gray area but i don't want that so just click over this blue pencil right click here and let's delete it so the gray area has gone by the way i will provide the images for these places you can replace those with that or you can replace those with your own images let's now scroll down here is the section for your menus we will of course have a dedicated page for menu but here you can see some best menus that you can offer so here you can put your food name and here is the price here's the description you already understand if you want to change anything you can just click over it instead of dinner you can write your dessert or any other thing you want then if we click over this you can see here is a list item for that so here is the food name if you click on that you can change the food name from this place you can change this price from this place on the secondary text then if you wanna change the description just click over it and then you can change the text from here same rule for all of these and here i wanna show you another thing like here you can see only dinner and breakfast let's say here if you also wanna add lunch and dessert items like that then you can just duplicate it so to duplicate it just right click over these six dots and then click on duplicate so here under these two column here if we scroll down you can see another two column has been added so here let's see instead of dinner you can type here dessert items and here instead of breakfast you can type your launch also you can replace here with other items it's simple like that but i don't want these columns so i'm just clicking on this x to delete it and here you can see another button says full menu let's click here now i want to link it to our menu page so here i'm pasting the menu page link like this all right let's scroll down here you can put some popular items of your restaurant and you know changing this is super easy just click over it you can change the image from here if you want to change the title just hover over on it not over over just click over it and then you can change their name their price from here you can change this paragraph text from here and you already see if you wanna make this row duplicated just right click over here and click on duplicate in this way you can duplicate multiple rows one under another let's now scroll down here we have got another featured food section you can feature here your another special dish let's now scroll down here is the shape section so you can replace your shapes real picture here so just click over it and from here you can put the staff name your shift name then their occupation name here and if you want to change the image you can just go inside the images and you can replace this image with your own shape image and then here is the social icons so here if you want to put your chef's social media links like facebook twitter or pinterest then you can do that from left if we scroll down here you will find social expand it so from here you can put their twitter facebook or any other social handle link but you know what i personally don't like these social links with the shapes so i just want to disable it you can do that from here by default it's turned on so i'm just turning off by clicking here now we can no longer see the social links with these chefs details i also want to remove this so just click over it and from here socials just disable it also from here go under socials and just disable it now let's scroll down here is a nice call to action section we can also put here a call to action button like see our menus here so to do that we don't need to do anything from scratch we can just go to the top of our section i mean top of our page then from here if we just right click over this button and click on copy then let's now scroll down to our call to action section in this section now right after this text just put your cursor here right click and click on paste the button is instantly pasted here how cool is that but here if we keep the button to left aligned it doesn't look cool so i want to make it centered aligned to do it just go under style tab from here alignment let's make it centered now it looks awesome now let's scroll down here is the client's testimonial section and again don't think these are broken as elementor bar has taken some space if we minimize it here you can see it's now looking perfect so don't worry about that because these are made by professionals so right now just expand it now let's say if you want to change your client image just click over the image then you can change your client image from here and then open the content from here so you already understand the name is coming from this place the occupation is coming from this place and here is the customer rating by the way who wanna keeps three star rating on their home page of course i wanna give my restaurant to five star rating and it's instantly updated also if you wanna change the testimonial text you can do that from here on this left box all right let's now scroll down and here is our footer i will show you shortly how to work with footer it's very simple but i will show you that after completing our all pages and another important thing is whenever you are editing with all the images all the text never ever forget to click on this green update button otherwise your all works won't be saved so let's just click on this green update button to save our all work and inside the download folder you will get all the images for these places so right now to not make you bored i will be changing all of the images that has watermarks over it so let's change all the images i'm just first forwarding the video for the moment all right i have updated all the images without the watermarks so they are now looking really clean and everything is looking awesome in my opinion and like i said all these templates are made by professionals so you don't need to worry about the tablet view and mobile view but if you're curious you can just check that out from here to check its responsiveness you can just click here on this responsive mode icon so to check the view of the tablet device just click on the tablet view icon from here top so let's scroll to the top so everything is looking great on the tablet device each of the section looks really premium i really really like the tablet view and now if you want to see the mobile view so from top just click on the mobile device let's go to the top or we can just click on this go to top bar or icon so here we can see the mobile view if we click on the hamburger we can see all the menu items like this it looks really awesome now let's scroll down everything is looking great on mobile device it just doesn't look like a basic website it looks totally professional looking restaurant website i really like the mobile view of the website alright let's now close it by clicking on this right text so when you're happy with your homepage just click on the green update button to save your work now before moving to other pages let's now have a look how to customize this header so first i will show you how to create a logo for free and how to place that logo into your website and then i will show you how to customize this navigation menu and then i will show you how to put your social links into this social media icons and then i will also show you how to customize this footer so here you can put your open hours your contact information and all the copyright text at the very bottom all right so first let's now have a look how to create a logo for free to create a logo first we will be going to a website that says logomaker.com it's actually logo maker without the e so first let's close this pop-up video alright so for our logo first here i'm searching for an icon as it's a restaurant website so here i'm searching for a food icon i'm typing food and hit enter so here you will find thousands of food images select any of them you like so from here i personally like this pizza one so i'm selecting it let's now first move this icon to the left in this place and then i want to add some text so from left let's just click on this text and here i just wanna type a restaurant then you can change the font of this text from here at the top you can select any simple or modern type font or you can change it to fun or funky or any other type you want i like simple and modern so i'm keeping it also you can specify the font family from here so i'm selecting the passion one now you can increase the size or decrease the size by dragging its corner in this way i just want to keep it in this size and if you want to move it just first put your cursor outside and then move your cursor over it and you can just move it easily like this okay i just wanna make it a bit smaller like this and the position here and then i just wanna put a simple dot after the restaurant word so here i'm again just taking a text so first i'm dragging it top so you can see it properly here instead of anything i'm just putting a simple dot now let's make it more bigger by dragging its corner like this all right so now i'm putting it after the restaurant word in this place here and also i want to make this dots color to orange type color so i'm selecting an orange color from here on this color wheel also if you want you can change these icons colors so just click over this icon and you can select any color from this color wheel like this you can also change the text color from here on the same way from this color wheel but i wanna keep everything color white because our website's background is kinda dark so if we make our logo white that will pop up more so from here logomaker.com let's first select the icon i'm making its color to white and then select the restaurant let's make its color to white just keep the dots color to this orange color now we cannot see anything because now the font color and icon color is white and our background color is also white but if we now want to select all of them you can just put your cursor outside and then you can drag over it so the whole logo is now selected so it's time to save the logo to save the logo from the top right corner click here on save logo now the browser pop-up says if you wanna download the very high resolution image i mean the very high resolution logo then you need to pay them 19 but we don't actually need very high resolution logo so here at the bottom it says no thanks download low resolution file yes i'm happy with that so click here on no thanks so here our logo has been downloaded all right let's now go back to our wordpress website and we need to change the logo from the theme customizer not from inside the elementor page builder so let's now go back to our dashboard now from left click on this hamburger and click on exit to dashboard all right now close all of this and click on this wordpress icon so we are now on the dashboard now we need to go to the theme customizer so hover over on appearance and click here on customize so from the theme customizer as we now want to change our logo we need to go to here click on site identity by the way you can also change your site title site tagline from this place but now i wanna change our logo so from top here you can see logo just click here over this existing logo and then let's now click on upload files and then click on select files and upload here the logo that we have just created from logomecha.com so i'm selecting the logo and click on open click on select now it's asking i wanna crop it or not no i don't wanna crop it so i'm clicking here is keep cropping and here we go it looks really nice on our website and then if you scroll down here you can see the logo with options so if you want to reduce the logo size you can change it from here by default it 350 if you want to reduce it you can just make it let's say 320 also from here you can change the logo height in pixel and then if you scroll down here you will find the option for site icon site icon is basically the little fav icon on the top of the browser like here on the gym for the digital.com here on the top you can see a little tiny icon that's basically the fab icon so if you want to upload a fav icon on your website then from here just click on select site icon and just make sure your fav icon is squared size one by one that could be 100 by 100 or 500 by 500 like that so here i'm uploading and square image click on select files i'm selecting this pre-made fab icon you will also find it on the download folder now let's click on open and click on select no i don't want to crop it so click on skip cropping and here we go at the top you can see the little tiny fab icon all right let's now go back and now i want to show you how to work with these navigation menus so how can you select the navigation menu or create another new navigation menu to do that from left after the site identity here you can see menus just click there and here you can see we already have a pre-made menu that we have got with the starter website kit that we have imported at the beginning of this tutorial but let's say if you want to create a menu on your own then you can click here on create new menu and if you want to do any changes on the existing menu then you can click here on the header menu and then here you can see our existing menu items the number one is home then about us menu and contact that's why we can see the items here in this order home about us menu and contact let's say if you wanna keep the menu at the before of the about us then from here you can just drag this menu at the top of about us like this so after doing it if you just click on publish and refresh the page then you can see the change here at this place but i don't want that so i'm putting the about us at the top of the menu here also if you wanna change the text of the menu if you wanna write here our menu instead of just a menu then you can just click here and you can change the text from this place and let's say if you wanna add more menu items then you can just click here on add items so in future if you have more pages so you can add new pages from this place also if you wanna add any custom links that's not your website link that's another website link you can put that custom link from in this place so i'm just clicking on custom links let's say if i just put the link text to help and here url i'm just pasting here my website url that's jim fahad digital.com and if i now click on add to menu you see the help menu item has been added on this current menu or current navigation so in this way you can add your website page at the menu or if you want you can add the custom link on the menu but it was only for example i don't want this help as a menu item so i'm just deleting it by clicking on this x it's gone alright so when you are happy with it just click here on this publish button to save your work and let's click on this x to exit the theme customizer so now let's have a look of the home page so here we can see the home page at the dashboard if we now wanna see the home page on live website just click here on the view link i'm opening it from a new tab and here we go everything is looking beautiful but now first i wanna change these social links so to edit it or customize it we need to work with the current header so from the page top if we hover over on here edit header and footer you can see here a link it says site header so just click on site header and this header is made using elementor so we can edit the header using elementor now click on edit with elementor so this is our header but at this moment we cannot see anything because the background is white and at the top element's color is also white so for a moment i'm just making its background color to a black color so let's just select this section by clicking on the six dots and here i'm making its background color to a black color from here on this color picker all right so here inside our header we can see this is our beautiful logo this is our navigation we can change the logo and navigation from the theme customizer but if you want to put your social links like facebook twitter or pinterest you need to do that from inside elementor page builder so to do it let's now expand the elementor page builder then if we now want to change our social links just click over it we can click on this blue icon then from here you can see item one item two three and four so let's just click on item one this one is for facebook so inside the link you can put your facebook page url and then here on this icon if you just click over it you can select other facebook icon or any other social media icon from here and put the social media links on its link field so i'm just giving you another example let's now close it let's say you just don't wanna keep the pinterest you wanna use another social link here instead so here one two three is the third item and from left here this is our item number one two three let's now open the item three and from here just click over this icon let's say you want to put here your instagram account so here i'm searching for instagram here you go just click over this icon and click on insert and then here inside this link field you can just put your instagram account link it's simple like that all right and also here we can see a search bar but i don't want this search bar on our header so just right click over it and click on delete it's gone and i don't wanna make the header's background color to the black color i did that only to edit these elements so let's just click on this section go to its style tab and make the color to the default color so i'm clicking on this clear or reset button all right now click here on this update button to save our header if we now go back to our home page and if we refresh the page now we can see our customized header and there is no search bar on the right side cool let's now scroll down at the very bottom of our page so here we can see the footer let's now have a look how to change this content from the footer editor so if we now hover over on top here you can see edit header and footer from there just click on the site folder and similarly like our header we can customize our footer using elementor page builder so just click here on edit with elementor so now we can change any of these text any of these social links from inside elementor page builder and by the way don't think this email field is broken like i said before as we are using elementor page builder so it takes some space on the left if we just minimize it you can see the form field is looking great all right now expand it so you know to change anything you just need to click over it so here you can change this paragraph from here if you want to change the follow text you can change it from here if you want to change this paragraph text then you can click here on description and you can change the text from this place if you want to change the social logo i mean social icons then just click on this edit icon and like the header you can change their links from inside these items and then if you want to change your working or opening hours then just click over it go inside description and you can change the time from here let's say only on thursday you keep your restaurant open from 10 pm oops not pm 10 a.m to 3 p.m so from here you can just click over it and here i'm putting 10 to 15 so here you can see here on thursday it's from 10 to 15 and on the right side you can change your address phone number or email address from this place so just click here on description and you can change your phone number email address and your real address from this place and then if you want to change the copyright text from the below folder then just click over it and from left you can change your copyright text by the way here you can see some dynamic text like inside of two curly braces you can see why this y means the year so here after copyright symbol you can see 2021 if you keep it like this this y symbol each year you don't need to update the year manually from this place it will be automatically updated so on 2022 or 2023 it will automatically updated by this y code and then here you can see the site name so it's coming from the site name but if you don't want to keep it you can just remove it and you can type it manually so i'm typing here jim for her the restaurant and then all rights reserved it's instantly changed here all right you see it's super easy now here i wanna show you another thing that's about this email collecting form it's actually very useful if you wanna collect your customers email address so they can just put their email address and click on submit and you will get all their email addresses inside your mailchimp account and then let's say in any annual occasion or in a monthly occasion or if you have any discount you can email to those hundreds or thousands of people at a time to announce them like if you have a discount or any other special announcement so let's now have a look how to do that just click here on this pencil icon so here on the left you see mailchimp signup form so to make this form work you need to have a mailchimp account by the way if you don't have a mailchimp account you can just go to mailchimp.com mailchimp is basically an email automation tool so using this type of tool you can collect your customers email address from your website like this email field so whenever anyone put their email address and click on submit their email address will be stored inside your mailchimp account and then let's say if you have 2000 or 5000 customers email list inside your mailchimp account and on the next month if you have a discount offer or any announcement then from inside mailchimp dashboard you can send a discount email or announcement email to those two thousand or five thousand people at a time that's an amazing thing so if you don't have a mailchimp account from here mailchimp.com you can just create your own account and then go inside your wordpress dashboard from left side here you can see a list its name is mc4wp so that's basically mailchimp for wordpress from there just click here on this mailchimp now here you need to put your mailchimp api key so you can just simply click here on get your api key i'm just opening it from a new tab it's asking me to login so i'm logging in from here as i already have my account here on mailchimp okay so right now i'm logging in let's now go back to our wordpress dashboard again and this time if we click on get your api key here now it will take me to the right page so from here we can see an api key here i'm just copying this api key from here now let's go back inside wordpress dashboard and i'm pasting the api key here now click on save changes awesome it says connected now click here on save changes and then from the left side we can just click on this form so from here we can just change the form name so by default it's set to subscribe but here i'm naming it to restaurant subscribe or restaurant subscribers and i just want to keep it all default from the bottom i'm clicking here on save changes all right now let's go inside our footer builder here oops not here just go inside elementor page builder here so before doing anything first let's click on this green update button and then refresh the page otherwise we won't get the latest information that we have made from the mailchimp like we have already created a new form that's name is restaurant subscribers so make sure you are refreshing the page before making any change so now again if we click on this blue pencil icon and then from here mailchimp sign up form just click over it and here we can see restaurant subscribers all right now click on the green update button to save our work now it's done if any of your visitors or customers now put their email address and click on submit their email address will be saved inside of your mailchimp account and later you can send them email whenever you will have any announcement or any discount so let's now close our footer builder also let's close this tab let's now edit our next pages that's our about us page menu and contact page and as you are now comfortable with elementor page builder you know how to edit any text how to edit any image so now i will be doing everything very fast all right so let's now first go to our about us page so here first thing i want to do i want to also customize this header because this is the different header than the home page header you see this header color is black and also you can see here this search bar so i just want to remove this search bar from the secondary header to do it from top over over on edit header and folder and click here on header inner page that's the current error so i'm selecting this one click on edit with elementor and like i said i just want to remove this search bar so right click here and click on delete rest other thing is fine so click on update to save our work if we now go back to our about us page and if we refresh the page we can now see the updated header without the search bar alright so now i wanna customize this whole about us page to do it from top you can just click here on edit with elementor so first i just wanna change this background image and like the homepage we cannot select this section by clicking on the six dots so you know you just can hover over on an empty space of this section right click here click on edit section go under now style tab and let's change this background image go to upload files select files and from inside this about folder i'm selecting this image click on open now insert media it's looking great now let's go to the next section here you can talk about you talk about your restaurant also if you want you can put your signature here but i don't want that so i'm just right clicking here and deleting it but we can keep this section so you can put here your special dish or your team image so first let's change this image i'm selecting another image go to upload files select files and i'm selecting this image click on open then insert media and you know you can change this text very easily you are very comfortable with this just click over it you can change the heading secondary heading and the description from here let's now go to the next section is the why choose as section so here you can put your code values like if you have options for free delivery then if you have got expert shapes if you have got awesome recipes so you can put this in the three columns and if you have more features so you can just right click over it and you can duplicate it so here on the next row you can put other stuff like if we just click over it let's say you wanna say here best food and then if you want to change this icon you can just click here on this icon now you can upload any other icon and change that with this but for now i don't want that so let's close it and neither i need this secondary row so i'm closing it by clicking on this x all right now let's go to the next section in this section you can feature your best shape so if you want to change this background image you can just click here on the six dots and go on restyle tab from here you can change this background image if you wanna change this text click over it you can change the heading secondary heading and description now let's go to the next section this is the call to action section like the home page if you wanna put a call to action button here you can also put that but i just wanna keep it like this and then here will be our global footer so i'm happy with our about us page now to save this page just click on this green update button all right now let's go back to our dashboard now i wanna work with the menu page so this is our menu page click here on edit with elementor so here on the menu page again i just wanna change the background image so right click here click on edit section go under its style tab and here we cannot see any background image under the background type so if you don't find any background image under the background type you need to go under this background overlay so here we can see this background image is coming from the background overlay so click over it go to upload files or we can use our existing image so from media library i'm using this same banner i mean the same banner image now click on insert media so it's uploaded but i wanna reduce the opacity so i'm dragging it to the right now it's looking great all right let's now scroll down so it says testy menu today if you want you can change it you know and then here you can list your breakfast all the breakfast items here their price and their details you know just click over it and you can change everything from left also if you wanna change the right image just click over it select the image and i'm changing it with other image so from inside the menu folder here i'm selecting this image click on open now click on insert media so here you go by the way here i wanna show you another interesting thing like if you wanna put this image on the left column and this breakfast list on the right column you can do that very easily you just need to hover over on this column icon grab it and let's drag it to the left column here now the image is inside the left column and our breakfast list on the right side isn't it cool all right but for the sake of the consistency of our layout i'm just moving this image to the right column here so like the breakfast here you can also include your dinner you can change these items you can change the image you can also include the dessert then you may have your main course and at the end of this page you may also have chef selection so you can feature some best food item of your restaurant and then we will have our global food by the way let's say after the main course if you want to add more list then you can just right click here and duplicate it so you will have another food list here you can just replace this image and replace the text but i don't want that so i'm closing it and now i will be changing all of the images of this page very quickly because i don't wanna make a board to change these images one by one so i'm first forwarding the video all right i have updated all the images you will also get these images from inside the download folder right now i'm very happy with this menu page let's now click here on this green update button to save our work and let's now go inside our dashboard click on this wordpress icon so we have only our contact us page remaining so let's do it very quickly click on this edit with elementor button or link and again first just change the background image right click here click on edit section go under style tab and let's now change this background image i'm selecting the same image that we have used on our home page so let's select this image click on insert media here we go by the way here position instead of top right i'm making it to center right now it looks prettier than before all right let's now scroll down here we can see a contact from section and here it's a google map but i will redo this section to make it easier for you but let's now have a look after that here we have got the address phone number and working time i'm in the open hours and after that we have our global footer all right and again don't think these are broken as we have this left bar just to minimize it you can see these are looking perfect so you know if you want to change the address the phone number and the working hours from the wordpress not wordpress from the elementor builder you can just hover over or click over it then if you want to change this icon to any other icon then you can select the icon from this icon library and then if you want to change this text just click over this content so this address text you can change that from inside the title field and the address details you can change that from inside this content field here and it's same for the phone and working column so you know you can change your phone number from this place you can change your working or opening days from here all right and like i said we will be deleting this form and also we will be deleting these existing google maps so first let's delete this map actually i wanna delete this whole column so just right click over this column and click this delete button to delete this entire column all right now i want you to be very attentive on this portion because we will be now creating the most important part of our website that's the contact forms because when anyone wants to contact with you they will contact you through this contact form so you need to always make sure your contact form is working for 100 percent so first i will be creating a contact form using the contact from 7 plugin so let's now have a look how we can create this type of contact form from scratch using contact from 7 plugin let this page like this inside the elementor page builder and we can now go to our wordpress dashboard from other tab now from our dashboard on the left if we hover over on contact from there just click on contact forms so here you see there are two existing contact forms but i don't wanna use any of them i wanna create a contact form from scratch so to create a new contact form from top let's click on add new and i'm naming it to restaurant contact and then here this is our contact form actually it's the coding of the contact form so here at first you can see this is the name field and this is the email field this is the subject field and this is the message field if you are happy with it and if you hate to put your hand inside of coding then i highly suggest you not to do anything inside of this because actually we just need this information for our customers the name their email address the email subject and their message is all what you need from our customers all right let's just keep the default value i'm in the default form and let's scroll down so here is some settings if you want you can change some of them like here first we can see the two address this is the email address where you will receive the contact form informations by default it's set to cite admin email so the email address you are using on your wordpress website your this wordpress website by default is set to that email address but instead of that if you want to set it to other gmail address or yahoo or any of your other email address you can put that email address in this place but i wanna keep it the default and then we can keep the from subject and additional headers the default and then here inside we can keep the default actually as these codes are very sensitive so you don't need to do anything with this i only suggest you to work with this two field so if you wanna receive the emails to your other email address you can just put this email address in this place for example if i put here gym at gmail.com though this is not my real email address i will receive all the contact forms email inside this email address but i don't want that i'm just keeping the default email address here this is the email address that i'm using on this wordpress website alright now let's scroll down keep everything default just go to the very bottom of this page and click on save all right let's now go inside our contact page and this is the page we were editing now here inside of this page i don't want this pre-made contact form so right click over this pre-made contact form and click on delete now it's gone all right at this moment just click on this green update button to save our work and let's now refresh the page so by refreshing this page we will get all the latest contact form information that we have recently created using contact form 7 plugin all right so let's now scroll down to this section right now it's empty so from here just i'm typing here contact form 7 this is the widget i'm looking for is contact form and make sure here is the little flux icon on the right side so here i'm just dragging this contact from at the below of the send us a message text here now from left here you can see contact from type so from here i'm selecting the contact from save and shortcode and here in this place we need to put the shortcode to get the shortcode let's go inside wordpress dashboard from here contacts click on contact forms so here this one the restaurant contact we have just created this one now i'm just copying its shortcode from this place so just copy it and now go inside limiter page builder paste the shortcode inside in this field and here we go right now we have our own fully functional contact form so right now if any visitor or customer put their name email address subject and message and after that if they hit enter i mean if they click on this submit button we will receive that on our email address cool and the very last thing i wanna do i wanna just put here uh google map so to do it just click here on this rubik's cube icon and here i'm searching for map i will be using this map not the flux one the general elementors one the google maps let's just drag it underneath this contact form so here we can see the form oops not firm so here we can see the google map let's say if you want to increase its zoom option so you can increase the zoom from here instead of 10 i'm making it 13 so it's now zoomed in also if you want to increase its height you can increase the height from here so i'm making it to 440 pixel like this or let's just keep it 400 awesome so when you are happy with it just click on this green update button to save your contact page now let's go back to our wordpress dashboard then click on this wordpress icon and let's now have a final look on all of the pages so from top let's now click on visit site i'm opening it from a new tab so this is our beautiful home page that we have made or customized these are our featured foods there is another featured section and here is our menus this is the popular main course section and then here is another featured food section this is the shape section right after that here is a call to action button then we have got the client's testimonial and here is our global folder all right also if we click on this go to top button it jumps to the top of the section if we now click on the about us that will take us to the about us page here we have our beautiful banner then after that this is the text about us or about our restaurant right after that here we have our features section and then we have got our expert safe section then if we scroll down here we have our another city section our call to action section and then here is our global footer all right let's now go to the menu page our menu page is also looking great here we have got our different menu sections with their images and food list they are looking really amazing let's now scroll down here is some chef selected food not selection it's chef selected foods all right here we have got the global food let's now go to the contact page here is the beautiful banner and then we have got our fully functioning contact form right after that we have got the google map then here is the address phone number and working hours section and lastly we have got the global footer all right so we have completed making our restaurant website and it's now looking really really amazing so if you're a restaurant owner just go ahead and make your own restaurant website if you like it please give this video a big thumb up and don't forget to subscribe this youtube channel also press on that bell icon to get notified before anyone whenever i will upload a similar valuable video like this on this youtube channel once again thank you so much for watching this full tutorial i will see you on the next video for now bye bye
Info
Channel: Jim Fahad Digital
Views: 8,331
Rating: undefined out of 5
Keywords: How to Make a FREE Restaurant Website in WordPress, How to make a Food Website in WordPress, how to make a restaurant website with wordpress, Create a restaurant website in Elementor, Phlox theme tutorial, Phlox Theme, Phlox Free Theme, Jim Fahad Digital, Elementor, how to make a website, elementor tutorial, restaurant website design, Fast Food Restaurant Website, fast food restaurant website, WordPress, WordPress Tutorial, make a website, wordpress elementor, Elementor Phlox
Id: 4t6E9NTxWNU
Channel Id: undefined
Length: 88min 16sec (5296 seconds)
Published: Wed Sep 01 2021
Related Videos
Note
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.