Get 2024 Templates Mega Bundle!14 Bootstrap, Vue & React Templates + 3 Vector Sets
Get for 99$

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


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (1)


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
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(