Get 2024 Templates Mega Bundle!$1000 worth of 19 Bootstrap HTML, Vue & React Templates + 3 Vector Sets for just $99
Get for 99$

Change login Layout


How can I change the login layout to creative layout in Angular?


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)


I apologize for any inconvenience, but it appears that there is currently no specific tutorial available to change the login layout to the "creative layout" in Angular using the provided Metronic template. However, you can achieve this customization by extending the existing auth module and making the necessary adjustments.

Here are the general steps to change the login layout:

You can find the auth module in your project structure, typically in a path like /src/app/modules/auth/.

Inside the auth module, there is a login component. You'll need to replace this component with the new login layout you want to use (in this case, the "creative layout").

Modify the templates for the login component to match the structure and design of the "creative layout" you want to implement. You can typically find the login component's template in a file like /src/app/modules/auth/components/login/login.component.html .

Extend the existing auth module to incorporate any new components or features from the "creative layout" into your application. This may involve creating new components, services, or routes as needed.

Styles and Assets:
Apply the necessary styles and assets (CSS, images, etc.) to achieve the desired visual appearance of the "creative layout."

Thoroughly test and debug the login functionality to ensure that it works as expected with the new layout.

Document your changes for future reference, and be prepared to maintain this customization as you update your application or the Metronic template.
Please note that this process involves extending and customizing the existing auth module and components to match the "creative layout" you desire. The specific implementation details will depend on the structure and design of the "creative layout" and your project's requirements.


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  :(