[SalesForce] Want to open custom URL as a pop up in Lightning

I have my lightning component in which I have added few Custom URLs. I have added that component on home page in lightning experience. Now when I click on any of the URL, it is opening as new window. But my requirement is to open that URL as a pop up.

Best Answer

As far as i can think of, use a separate lightning component like UrlOPener and instantiate this component dynamically. Within this component embed an iframe and pass your url as an attribute to this component and use that attribute as source to the iframe. But using an iframe within lightning component is not recommended but still this works. use onclick handler in your url instead of anchor tag.

example:

<!--parent component-->
<aura:component>

<lightning:overlayLibrary aura:id="overlayLib"/>
<lightning:button label="{YOUR URL}" onclick="{!c.handleClick}">
</aura:component>

<!--Parent Component Controller -->
handleClick:function(component, event, helper){
var url = event.getEventSource().get('v.label');
var modalBody;
$A.createComponent("c:URLOpener",{"url":url},function(content,status){
if(status === 'SUCCESS'){
component.find('overlayLib').showCustomModal({body: modalBody});
} else{
console.log('error');
}

}) }

<!-- Child Component-->
<aura:component>
<aura:attribute name="url" type="string" />

<iframe width="your width" border="your border" src="{!v.url}"/>
</aura:component>