Visualforce missing as option on Page Include component

Peter HerzogPeter Herzog Member
edited September 2018 in Questions
Why is Visualforce missing as an option under the Page Include component on one of my Skuid pages?


  • John NelsonJohn Nelson Admin, Sonar 🛠️ 
    edited July 2018
    Hey Peter.

    This feature was rolled back as part of the Spring 14 release. The primary reason is that inserting visualforce pages into skuid pages opens up all sorts of issues where Javscript can conflict and the page actions returned by the VF page's controller can take over the entire page. 

    We recommended you use a template component with an iframe to pull in your VF pages, as it allows execution of the page's JS to occur in its own private context. If needed, you can always bubble up JS events/functions via window.parent. 


    Sorry for the confusion! 
  • Kaede HollandKaede Holland Member ✭✭
    edited September 2018
    Hey - I am so close but so far. 

    What am I doing wrong here? How do i get the little component to show up instead of pulling in an entire page?


    Here is the start of the visualforce I am trying to pull in:


    <apex:page sidebar="false" extensions="HubSpot_Inc.HubSpotController" standardController="Lead">
      <apex:stylesheet value="{!$Resource.HubSpot_Inc__hubspotcss}"/>   <apex:stylesheet value=""/>      <div class="hs-iframe-page">         <apex:outputPanel rendered="{!hsIntelExists==false}">           <div class="hsheader">               <img src="" height="20" width="53" />           </div>           <h2>No HubSpot Data on file.</h2>         </apex:outputPanel>              <apex:repeat value="{!hsIntels}" var="hsIntel">                      <apex:outputPanel rendered="{!hideIframeIntels[hsIntel.HubSpot_Inc__Portal_ID__c] != 'true'}">             <apex:iframe height="200px" width="100%" src="{!hsIntel.HubSpot_Inc__HubSpot_Detail__c}embed/" />           </apex:outputPanel>                      <apex:outputPanel rendered="{!hideIframeIntels[hsIntel.HubSpot_Inc__Portal_ID__c] == 'true'}">            <div class="hsheader">                <img src="" height="20" width="53" />                <apex:outputPanel >                    <div class="hsIntelColumn" style="float:right;">                        <div class="hsdmz">                            <a class="btn small submit" href="{!hsIntel.hubspot_detail__c}" target="_blank" style="border:0;background-color:#444;">                                <span class="corner left"></span>                                <span class="nested">                                View Lead in HubSpot</span>                                <span class="arrow next"></span>                                <span class="nested ie7_spacer"></span>                                <span class="corner right"></span>                            </a>                        </div>                    </div>                </apex:outputPanel>            </div>            <div class="hsbody">                <div class="hsIntelColumn" style="max-height:180px;overflow:auto;">                    <h2>Visit Information</h2>                    <table>                    <tr class="hsitem">                        <td class="hslabel"><label>Found Site Via</label></td>                        <td class="hsdata"><span>{!foundSiteViaMap[hsIntel.portal_id__c]}</span></td>                    </tr>                               <tr class="hsitem">                        <td class="hslabel"><label>First Visit</label></td>                        <td class="hsdata"><span>{!earliestVisitMap[hsIntel.portal_id__c]}</span></td>                    </tr>                    <tr class="hsitem">                        <td class="hslabel"><label>Recent Visit</label></td>                        <td class="hsdata"><span>{!latestVisitMap[hsIntel.portal_id__c]}</span></td>                    </tr>                    <tr class="hsitem">                        <td class="hslabel"><label># of Visits</label></td>                        <td class="hsdata"><span>{!totalVisitsMap[hsIntel.portal_id__c]}</span></td> 
  • John NelsonJohn Nelson Admin, Sonar 🛠️ 
    edited March 2014
    Hey Kaede, you need to add the "showHeader" attribute to your VF page like this:
    <apex:page sidebar="false" showHeader="false" extensions="HubSpot_Inc.HubSpotController" standardController="Lead">
  • Kaede HollandKaede Holland Member ✭✭
    edited August 2014
    What if it is part of a managed package?
  • Jason HardyJason Hardy Member
    edited March 2014
    You can copy the managed page and use the new version with the appropriate option.
  • Kaede HollandKaede Holland Member ✭✭
    edited August 2014
    Since it is a managed package, I am unable to access to necessary class. 

    I get the following error: Error: The installed managed class HubSpot_Inc.HubSpotController is not visible

  • Jason HardyJason Hardy Member
    edited March 2014
    It's been a while since I've done this, but I remember you have to do something with the namespace. Try dropping the namespace (HubSpot_Inc.) and seeing if it works for you like that.
  • John NelsonJohn Nelson Admin, Sonar 🛠️ 
    edited March 2014
    Yeah, Kaede, the fact that it's part of a managed package makes it tougher. Unfortunately you're not going to be able to specify whether or not to show the page's header because of that, and the iframe is going to render the page as it's built. Lame, I know.

    We are bouncing around a few alternatives to the vf page include that could possibly be added as part of the next release. 
  • Rob HatchRob Hatch Skuad, Sonar ✭✭
    edited December 2016
    We were able to fix this for a customer today.  Even thought this post is 5 months old,  it seemed appropriate to go back and update this. 

    You can still use the mangaged package VF page but tweak the iFrame code that you put in the template component in skuid.  It should look like this: 

    <iframe src="/apex/<<VFPageName>>?Id={{{Id}}}&isdtp=vw" width="100%" height="600px" frameborder="0"/>

    1.  Of course replace <<VFPageName>> with your namespace__pagename__c combination. 

    2  Then tweak the query string by adding this parameter:  &isdtp=vw     Apparently this turns off header and sidebar in the VF page.   

    Early results are encouraging. 

  • JD BellJD Bell Skuad ✭✭
    edited December 2015
    Be aware, though, that the isdtp feature is not officially supported outside the service console and can cause other problems (for example, "the isdtp parameter will break any and all apex:outputLink elements on a visualforce page with the apex:page showHeader parameter set to false"). It does seem to work most of the time and I know that a lot of developers use this parameter, but it's something you'll want to keep an eye on in case Salesforce drops support for it without warning.
  • Dave ZadarekyDave Zadareky Member
    edited February 2015
    If anyone is trying to do this with Person Accounts. This is how we made it work
     <iframe src="/apex/HubSpot_Inc__HubSpotContactIntelligence?Id={{{{PersonContactId}}}}&isdtp=vw" width="100%" height="300px" frameborder="0"/>
  • Rob HatchRob Hatch Skuad, Sonar ✭✭
    edited September 2016
    Thanks Dave. 
  • edited December 2016
    I am also trying to include a third party visualforce page in my SKUID lead detail page.  I tried both of the above iFrame code suggestions and can't get either to work.  I get a greyed-out box with the message "Unable to resolve the server's DNS address".  Any ideas?

  • edited December 2016
    Thanks for the "100%" tip!
Sign In or Register to comment.