Using Iframe in Service portal

[salomesimpsone]

Hi all,

I am learning about service portal

what I am trying is to display an external page(e.g google,...)using iFrame in service portal.

So, I created a widget and included the iframe as below

<iframe src="http://www.w3schools.com" height="500px" width="500px"></iframe>

but expected page is not getting displayed and the iframe is blank

How to use iframe in service portal??

Thanks in advance

[reginabautista]

Hi Philip, did you get your iframe height content issue resolved? I am having the same issue. I need to use iframe as I need the native UI form functionality intact within the page (i.e. Process Flow chevron on top, tabs etc). I was able to get the height of the content and dynamically set the iframe height based on that. However, if the content adjusted real-time (say user hits on Enter on the description field 20x), the frame wouldn't auto-adjust as it is fixed to the height i set it to on the initial load. I wonder if there is a solution to this..

Regina

[ark6]

Hi Regina,

Are you using the service portal or the cms.

If you are using cms, then try to use the OOB IFrame block and select the sizing to autosize fit content.

Also, dynamic height of the iframes can be controlled through the below code

<script>
  function resizeme(ifm) {
  ifm.style.height = ifm.contentWindow.document.body.scrollHeight + 'px';
  }
</script>

<iframe src="..." frameborder="0" scrolling="no" onload="resizeme(this)" /> //scrolling=0 if you don't want a slider in the iframe

Do let me know if this works...

[DrewW]

I know this is a really old post but if you want to use an iFrame in Service Portal this is one way to go about it.

//HTML Template
<div>
<iframe ng-src="{{target_url}}" width="100%" height="100%" style="border:none;">
</div>

//Client Script
function($scope, $sce) {

    var c = this;

    $scope.target_url = $sce.trustAsResourceUrl(c.data.link);
}

//Server Script
(function() {
	/* You should probably store the URL in a system property but that is up to you and will depend on how often it will change. */
	data.link = "SOME_URL";

})();

[Andrea A]

Sorry, not working for me....

[DrewW]

So far the three times I have been forced into an iFrame this has worked every time. Soooo... 

Are you seeing a client error in the browser console?

Are you sure you are passing the right thing as the URL?

Can you open the URL passed in the same browser just different tab?