function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
MaheemSamMaheemSam 

Pop page when user login in lightning

Hi, 

   When user logs in using lightning is there  a way to build a popup page with a message please suggest me how to implement this feature. 

Thanks
Sudhir
Best Answer chosen by MaheemSam
Ramesh DRamesh D
Put this lightning component on Home page:
Note: This popup will show only once when the user logins in first time, if you want this to show n times please reomve temperorySession condition

Aura Component:
<aura:component 
               implements="flexipage:availableForAllPageTypes"
                access="global">
    <aura:handler name='init' action="{!c.init}" value="{!this}" />
    <aura:attribute name="isOpen" type="boolean" default="false" />
    <div class="slds-backdrop" aura:id="Modalbackdrop"></div>
    <aura:if isTrue="{!v.isOpen}">
        <div role="dialog" tabindex="-1" aria-labelledby="header43" class='pop-up slds-modal' aura:id="popupDiv1">
            <div class="slds-modal__container">
                <div class="slds-modal__pinner">
                    <div class="message">
                        <p>You logged into salesforce Lightning </p>                    
                    </div>
                    <div class="slds-form-element">
                        <lightning:button variant="success" label="Ok" title="ok" onclick="{! c.close }" />
                        
                    </div>
                </div>
            </div>
        </div>
    </aura:if>
</aura:component>
JS Controller:
({
    init : function(component, event, helper) {
        var temperorySession = localStorage.getItem('tempSession');
        if(temperorySession == '1')
        {  
            component.set("v.isOpen", false);
        }
        else
        {
            component.set("v.isOpen", true);
            var cmpTarget1 = component.find('popupDiv1');
            var cmpBack1 = component.find('Modalbackdrop1');
            $A.util.addClass(cmpTarget1, 'slds-fade-in-open');
            $A.util.addClass(cmpBack1, 'slds-backdrop--open');
        }
        localStorage.setItem('tempSession', '1');
        
    },
    close: function(component, event, helper) {
        component.set("v.isOpen", false);
    }
})
STYLE:
.THIS.pop-up {
    display: block;
    opacity: 1;
    visibility: visible;
}

.THIS .slds-modal__inner {
    background: yellow;
    padding: 20px;
    text-align:left;
}

.THIS .slds-modal__pinner {
    background: #fff;
    padding: 20px;
}

OutPut:
User-added image


I hope you find the above solution helpful. If it does mark as best answer to help others too.
Thanks,
Ramesh D

All Answers

Khan AnasKhan Anas (Salesforce Developers) 
Hi,

Greetings to you!

You can use Login Flows. Please refer to the below links which might help you further with the above requirement.

http://docs.releasenotes.salesforce.com/en-us/winter15/release-notes/rn_forcecom_security_login_flows.htm

https://developer.salesforce.com/docs/atlas.en-us.securityImplGuide.meta/securityImplGuide/security_login_flow_examples.htm

https://automationchampion.com/2014/12/11/display-notice-when-users-log-in-to-salesforce-3/

I hope it helps you.

Kindly let me know if it helps you and close your query by marking it as solved so that it can help others in the future. It will help to keep this community clean.

Thanks and Regards,
Khan Anas
Ramesh DRamesh D
Put this lightning component on Home page:
Note: This popup will show only once when the user logins in first time, if you want this to show n times please reomve temperorySession condition

Aura Component:
<aura:component 
               implements="flexipage:availableForAllPageTypes"
                access="global">
    <aura:handler name='init' action="{!c.init}" value="{!this}" />
    <aura:attribute name="isOpen" type="boolean" default="false" />
    <div class="slds-backdrop" aura:id="Modalbackdrop"></div>
    <aura:if isTrue="{!v.isOpen}">
        <div role="dialog" tabindex="-1" aria-labelledby="header43" class='pop-up slds-modal' aura:id="popupDiv1">
            <div class="slds-modal__container">
                <div class="slds-modal__pinner">
                    <div class="message">
                        <p>You logged into salesforce Lightning </p>                    
                    </div>
                    <div class="slds-form-element">
                        <lightning:button variant="success" label="Ok" title="ok" onclick="{! c.close }" />
                        
                    </div>
                </div>
            </div>
        </div>
    </aura:if>
</aura:component>
JS Controller:
({
    init : function(component, event, helper) {
        var temperorySession = localStorage.getItem('tempSession');
        if(temperorySession == '1')
        {  
            component.set("v.isOpen", false);
        }
        else
        {
            component.set("v.isOpen", true);
            var cmpTarget1 = component.find('popupDiv1');
            var cmpBack1 = component.find('Modalbackdrop1');
            $A.util.addClass(cmpTarget1, 'slds-fade-in-open');
            $A.util.addClass(cmpBack1, 'slds-backdrop--open');
        }
        localStorage.setItem('tempSession', '1');
        
    },
    close: function(component, event, helper) {
        component.set("v.isOpen", false);
    }
})
STYLE:
.THIS.pop-up {
    display: block;
    opacity: 1;
    visibility: visible;
}

.THIS .slds-modal__inner {
    background: yellow;
    padding: 20px;
    text-align:left;
}

.THIS .slds-modal__pinner {
    background: #fff;
    padding: 20px;
}

OutPut:
User-added image


I hope you find the above solution helpful. If it does mark as best answer to help others too.
Thanks,
Ramesh D
This was selected as the best answer
MaheemSamMaheemSam
Thanks Ramesh for you reply I am trying your suggestion I am new to lightning please guide me since I am learning lightning components. 

I created Aura component. Please let me know how to add JS controller and Syle should this be included in the component itself please suggest

Thanks
Sudhir
Ramesh DRamesh D
Follow this and let me know 
User-added image
Thanks
Ramesh
MaheemSamMaheemSam
Thanks Ramesh one last question need a help I created component with name LogoinPop.cmp how should this be called from home page.  Do i have to create a page and add this component ?

 
Ramesh DRamesh D
Go to  Home page --> setup--> edit page-->

User-added image


and drag your component anywhere and then click Save

Thanks
Ramesh D
MaheemSamMaheemSam
Thanks Ramesh it is working now you solved my request. One last this can we grey out the background please let me know when popup shows. 
Ramesh DRamesh D
add this property to pop-up CSS
.THIS.pop-up {
    display: block;
    opacity: 1;
    visibility: visible;
    background-color:grey;
}
Output:
User-added image

I hope you find the above solution helpful. If it does mark as best answer to help others too.
Thanks,
Ramesh D
MaheemSamMaheemSam
Thanks Rames below is the changes I made. 
 
.THIS.pop-up {
    display: block;
    opacity: 1;
    visibility: visible;
    background-color:#000;
    opacity: 0.8;
}

 
Ramesh DRamesh D
Awesome, good work! Hope you learned something..
MaheemSamMaheemSam
Hi Ramesh, 

    Can we use this feature in salesforce mobile please let me know. 

Thanks
 
Harry McDonaldHarry McDonald
Hi Ramesh, I am trying to implement this code into my org. You have mentioned about 'removing the condition' to have it appear on every log in, not just the first. How would I remove this condition?
Thanks
Vishwas DhudumVishwas Dhudum
Not sure if others see issue with localStorage here...It is a persistant storage. I don't know of any easy way to update localStorage when user logs out or the session ends or remains idle for long time. I think for for a feature to be truely "Salesforce session" sepecific, session cache(a platform cache feature) is guaranteed solution. That way, life of any data we store in session cache has validity only until user's Salesforce's session last(regardless of user's browser tab, browser window). I would be interested to learn if there are other guaranteed options to keep a feature truly Salesforce session specific.