Visual Force Pages & Detail Tab on Lightning Page

Question

I am in the process of moving to Lightning, and have some issues with Visual Force pages and when they display.

My VF pages are all set with the "Available for Salesforce mobile apps and Lightning Pages" un-checked. This is intentional, as the pages are complex, and not well-suited for Salesforce1. Due to their complexity, I also prefer to put them on a separate tab in the Tab Control on a Lightning page. But despite the setting being un-checked, the VF pages still appear on the detail tab of the in the Tab Control.

I know I can take it out of the details tab by changing the page layout, but then Salesforce Classic users don't see the VF pages at all.

Is there a way to make the VF pages / page layouts "respect" the "Available for Salesforce mobile apps and Lightning Pages" setting?

I have to obscure much of the page due to confidentiality reasons, but I've attached a screen shot of the Lightning Page, employing the Lightning Tab Component. The "Detail" tab pulls in the complete page layout.

Any help would be appreciated!

Answer 1

Sounds like a candidate for the ideaExchange .Currently the workaround can be wrapping the whole page inside an outputPanel and rendering only for classic theme .

Here is an example from sfdc on how to achieve this

<apex:page>
 <apex:stylesheet value="{!URLFOR($Resource.slds, 'assets/styles/salesforce-lightning-design-system-vf.css')}" />
<apex:outputPanel rendered="{!$User.UIThemeDisplayed == 'Theme3'}">
    <apex:pageBlock title="Visualforce (Using standard Visualforce Components)" mode="detail">
        <apex:outputLabel value="UI Theme Detection using Global Variables: {!$User.UIThemeDisplayed}"/>
    </apex:pageBlock>
</apex:outputPanel>
<apex:outputPanel rendered="{!$User.UIThemeDisplayed == 'Theme4d'}">
   <div class="slds">
<div class="slds-card slds-card--empty">
 <div class="slds-card__header slds-grid grid--flex-spread">
   <h2 class="slds-text-heading--small slds-truncate">Visualforce (Using HTML + SLDS)</h2>
 </div>
  <div class="slds-card__body slds-p-horizontal--small">
    <h3 class="slds-text-heading--small slds-p-top--large slds-p-bottom--large">UI Theme Detection using Global Variables: {!$User.UIThemeDisplayed}</h3>
  </div>
 </div>
</div>
   </apex:outputPanel>
 </apex:page>

In nutshell you will simply use the outputpanel and detect via theme 3 .