We've built a custom lightning component that we’re using as the header in our Napili template. We’re trying to incorporate the standard ‘Profile Header’ component into our custom header (or something similar). I couldn’t find anything online about the code behind the profile header component. Does anyone have any suggestions?

enter image description here


You should be using new custom theming for this

<aura:component implements="forceCommunity:themeLayout" access="global" description="Sample Custom Theme Layout">
<aura:attribute name="search" type="Aura.Component[]" required="false"/>
<aura:attribute name="profileMenu" type="Aura.Component[]" required="false"/>
<aura:attribute name="navBar" type="Aura.Component[]" required="false"/>
<aura:attribute name="newHeader" type="Aura.Component[]" required="false"/>
    <div class="searchRegion">
    <div class="profileMenuRegion">
    <div class="navigation">
    <div class="newHeader">
    <div class="mainContentArea">

If you still want to override the profileMenu you can do using below code

<aura:component implements="forceCommunity:profileMenuInterface" access="global">
<aura:attribute name="options" type="String[]" default="Option 1, Option 2"/>
<ui:menu >
    <ui:menuTriggerLink aura:id="trigger" label="Profile Menu"/>
    <ui:menuList class="actionMenu" aura:id="actionMenu">
        <aura:iteration items="{!v.options}" var="itemLabel">
            <ui:actionMenuItem label="{!itemLabel}" click="{!c.handleClick}"/>

After you create a custom profile menu component, admins can select it in Community Builder in Settings | Theme to replace the template’s standard Profile


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.