Custom Lightning Page Template / Layout

In this blog, I would like to discuss you about how to create a custom lightning page template or layout using SFDX.

Create Lightning Component

Lightning component resides inside a lightning project so create a project and follow the below steps. If you are not aware of project creation then go through my blog.

• Create a lightning component in Visual Studio Code
  • sfdx force:lightning:component:create -n <component name> -d <location>
  • Modify the design page to show the custom attribute in the layout selection or page layout editor

Push Code Into Scratch Org

• Create a scratch org
  • sfdx force:org:create -s -f config/project-scratch-def.json -a <alias name>
• List all connected orgs including scratch org with Visual Studio Code
  • sfdx force:org:list –all
• finally, push the code into scratch org created

Create A Page Named My Bike  In The Lightning App Builder.

• Go to setup –> Lightning App Builder -> New

• Select App Page in the options
• Then, fill the field with your Page name and click Next

• Select your custom or standard layout
• Our custom three column layout displayed under Custom section

• Then, Click Finish button to include the custom or standard component in the layout

• Click Save and Activate your page to the preferred profiles and apps

 

https://developer.salesforce.com/docs/component-library/bundle/lightning:appHomeTemplate