Laravel 10 E-Commerce Project - Changing the Login and Registration page Layout

hi everyone welcome back to the laravel 10 e-commerce project tutorial in this video we are going to learn about changing the login at register page layout so let's see how can we apply HTML template on login and register page you can see here this is the default login page and here is the default register page okay now let's apply the HTML template on this login page and register page okay so for that go to the project and let's uh coincide them Resources directory then views and then auth and from here let's open the login dot update.php file and inside this file first of all let's change here the layout name so just write here layouts Dot just remove this app and add here the layout name which is base okay and now from here inside this uh content section just remove this container so select this and delete this container okay and now go to the template directory here is the template directory okay and now let's open this login.html file in vs code so right click and open with Visual Studio code okay and from this file let's select this one this login section okay so just collapse yes so just copy this uh select this section and also copy this a style okay so just select this and copy and go to the login.play.php file and inside this content section now just paste here okay and now inside this form or just remove this and add here the route which is logged out so right here login method post okay and now just remove this hidden field okay and add here the at the rate csrf okay csrf stands for cross site request repository attacks okay which is a useful uh prevent the unauthorized activities and now uh here designed the user section this input section okay just add here after this input email field for displaying the validation message just add here then delete error directive and then set this put here the name email and inside this error Direction Just Add here span tag in class text tensor okay and also set some margin so empty task three and now you close this span tag and it's uh span okay and inside the suspended this display and the error message right here double curly bracket then download message okay and now just close here the error direct tips right here and delete end headed okay and now let's copy this and paste further password so here after this just paste here and only change here the name and just write here password okay and now uh change here the register link so just remove this and add your double curly bracket route and Route name which is the resistor let's save this file now it's done so let's check this login page so go to the browser and just refresh the page and you can see here the new designer new login page it means a template has been applied on this login page okay now let's check this so just add here the username so let's try it here user and delete subside media dot in and password okay now let's click on login and you can see here it's working okay now let's log out and just click on the register link and now let's apply the template on this for the install page okay so go to the auth directory and from there let's suppose register.blad.php file and now do the same thing just change the layout name and just right here base and now let's remove this container div okay just remove this and now go to the template directory and open this register.html file in Visual Studio code and now this register.html template file let's copy this this section okay so just select this and also copy this style copy and go to the registrator created PHP file and inside this contact Section content section just paste here okay and now this changer the form action so stand here the double curly bracket route and then route name to register and also remember this hidden fail as a stand here and create csrf okay and for displaying the validation message after this input field just add here at the rate error directive then add here the name name and now and the span tag and at the class here text tensor and give some margins right here margin top 50 empty Dash three okay this is the go to strip class and now it is a double curly bracket and just display the message error message okay and then I'll just close this span tag and now just close this error direct tips right here and delete error now let's copy then press paste here for the phone all right and this change here the column name phone [Applause] and here for the this time just remove this this input field okay phone this is not required and inside the email address field just paste here and change here the name email and here from the password so right here password okay now let's add here the login route here so remove this route and Route M which is login okay now it's done so save this file and let's check so switch to the browser and refresh the page and you can see here the register page and if I click on this link login page okay now let's check the register page so just add here the name and just enter the name user to email address let's say user this time just I'm going to add the same email address and password click on sign up you can see here the validation error message the email is already been taken okay if I share the user true and this time user 2 at the sun side media dot in and password one two three four five six seven eight input password and now just click on Signal and this time you can see here user 2 is logged in okay all right so in this way uh it's showing the 404 okay inside the layout file just go inside the layout or change the link for the home page so here just remove this index.html and right here also change here the link okay so just press Ctrl t and right here double curly bracket route and then route name which is app dot index okay now save this file and now refresh the page and now if I click on this logo you can see here the home page okay so in this way you can apply the HTML template on login in Android store Page okay so that's all about changing the login and register page layout don't forget to subscribe my channel thanks for watching

Channel: Surfside Media

Views: 3,850

Keywords: How, to, Program, laravel (Software), laravel, laravel v10, laravel 10, laravel project, laravel setting up, laravel v10 setting up, laravel v10.0, v10.0, laravel 10.0, laravel 10 playlist, laravel 10 tutorial, laravel tutorial, laravel 10.0 tutorial for beginners, laravel for beginners, laravel tutorial for beginners, laravel10, laravel 10 ecommerce tutorial, laravel 10 ecommerce, ecommerce project in laravel 10, laravel 10 ecommerce project, surfside media project

Id: I-q4as-cvXE

Length: 12min 19sec (739 seconds)

Published: Mon Sep 18 2023