Hi All,
We need a lightning console page template with 25%, 50% and 25% sections.
So we are using "Pinned header and left sidebar[2 regions]" and creating a lighting record flexi page to case, but this one is opening other case's in a actual way[attached screenshot],
But we are needed that the cases should be opened in a expected way[attached screenshot - this one the sections percentage[33%,33%,33%] is differed but expectation is {25%,50%,25%}].
I am looking for sample code to create the lightning Console page template's for [25%.50%, 25%] sections??
Hi Krishnamoorthi,
can you please try creating a aura componenet like this code and put this component as template under your flexipage
<aura:component implements="lightning:recordHomeTemplate" description="Main column and right sidebar. On a phone, the regions are of equal width"> <aura:attribute name="left" type="Aura.Component[]" /> <aura:attribute name="middle" type="Aura.Component[]" /> <aura:attribute name="right" type="Aura.Component[]" /> <aura:attribute name="region_header" type="Aura.Component[]" /> <aura:handler name="init" action="{!c.doInit}" value="{!this}" /> <lightning:workspaceAPI aura:id="workspace" /> <div style="height:100%;"> <div> <div class="slds-card slds-page-header forceHighlightsPanel slds-scrollable_y" role="banner" id="myHeader" aura:id="stickySection" style="max-height:40vh;background-color: rgb(230, 229, 228);"> <lightning:layout multipleRows="false" > <lightning:layoutItem class="slds-size_12-of-12" flexibility="auto"> {!v.region_header} </lightning:layoutItem> </lightning:layout> </div> </div> <div> <div class="content" aura:id="content"> <lightning:layout > <lightning:layoutItem class="slds-p-top_small slds-size_3-of-12"> <div class="slds-scrollable_y" style="max-height:48vh;"> <div style="width:97%;"> {!v.left} </div> </div> </lightning:layoutItem> <lightning:layoutItem class="slds-p-top_small slds-p-left_small slds-size_6-of-12"> <div class="slds-scrollable_y" style="max-height:48vh;"> {!v.middle} </div> </lightning:layoutItem> <lightning:layoutItem class="slds-p-top_small slds-p-left_small slds-size_3-of-12"> <div class="slds-scrollable_y" style="max-height:48vh; "> {!v.right} </div> </lightning:layoutItem> </lightning:layout> </div> </div> </div> </aura:component>
