Super Sale Limited Time 50% OFF for All-Access Plans
Save 50% Now
Light
Dark
System
Ask  Question

change the design of the login page


how do we change the design of the login of the Laravel demo to have the design such as: https://preview.keenthemes.com/metronic/demo1/custom/pages/login/login-1.html


user
Moussa Diouf 2 years ago
Laravel
1 Answers
Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (1)

user
Faizal Author 2 years ago

Hi,

It appears that you're looking to change the design of the login page in the Laravel demo. Here's how you can go about it:

The link you provided corresponds to the layout for Metronic version 7. However, the Laravel starterkit you're working with uses Metronic version 8.

To change the design of the login page, follow these steps:

Locate the login form:
You can find the login form in this file: /laravel/starterkit/resources/views/pages/auth/login.blade.php

Modify the layout:
The layout you need to change is known as 'x-auth-layout,' and you can find it here: /laravel/starterkit/app/View/Components/AuthLayout.php

Adjust the authentication page layout:
The overall layout of the authentication pages can be customized by editing this file: /laravel/starterkit/resources/views/layout/_auth.blade.php

Reference the Metronic HTML version:
You can refer to the Metronic HTML version to replicate the layout. The HTML version provides access to the HTML code for layouts, pages, and more.
https://preview.keenthemes.com/metronic8/demo1/index.html


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(