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
Christian Schwabe (x)Christian Schwabe (x) 

HelpText in Lightning is not rendered properly

Hi all,

I have built a vf-page, that should show helptext in classic, lightning experience and salesforce1 but does not rendered helptext in lightning experience properly.

Question:
Does anyone know why helptext is not rendered in lightning experience?

Related article:
  • https://salesforce.stackexchange.com/questions/21412/help-text-not-appearing-when-using-apexoutputfield-with-a-custom-label

That's the way it look (currently):
Lightning experience:
User-added image
Classic:
User-added image
Salesforce1:
User-added image

Following code is used for vf-page:
<apex:page applyBodyTag="false"
    applyHtmlTag="true"
    renderAs="html"
    docType="html-5.0"
    showHeader="true"
    sidebar="true"
    standardStylesheets="true"
    title="{!title}"
    controller="SepaTransactionController"
    tabStyle="SepaSearchTransaction__tab"
    lightningStylesheets="true" 
>

<apex:form >
        <apex:pageMessages id="pageMessage" escape="false"/>

        <apex:pageBlock title="{!title}" mode="detail" id="pageBlockSetionItemSearchCriteria">

            <apex:pageBlockSection title="{!$Label.Input}" columns="{!IF(OR($User.UIThemeDisplayed = 'Theme3', $User.UIThemeDisplayed = 'Theme4d'), 2, 1)}" id="pageBlockSearchCriteria">
                <apex:PageBlockSectionItem helpText="{!$Label.HelpGASATIds}">
                    <apex:outputLabel value="{!transactionPluralName} Ids" for="idsId"/>
                    <apex:inputText id="idsId" value="{!transactionIds}"/>
                </apex:PageBlockSectionItem>
            </apex:pageBlockSection>
        </apex:pageBlock>
    </apex:form>
</apex:page>

 
Best Answer chosen by Christian Schwabe (x)
Christian Schwabe (x)Christian Schwabe (x)
Hello Sarvani,

thanks for your reponse!
I found and read this article before, but thought that it only describe the missing helptext for fieldsets.

Encouraged by your statement, I went on another search and came across the following example: http://www.codebycody.com/2014/08/super-simple-help-text.html
I only made small adjustments to it and the result now looks like this:
User-added image

That looks like the original helpText in lightning. I like it and it stays that way now. Thank you.
 

All Answers

SarvaniSarvani
Hello Christian,

Seems your issue is a salesforce limitation for lightning experience. Please refer  https://community.zuora.com/t5/Zuora-CPQ/Help-Text-not-appearing-in-the-Lightning-instance-of-SalesForce/td-p/17501 (https://community.zuora.com/t5/Zuora-CPQ/Help-Text-not-appearing-in-the-Lightning-instance-of-SalesForce/td-p/17501" target="_blank)which addresses the same issue. However, you can insert an image like icon with a tooltip showing on hover via the alt/title attributes to acheive your need.

Hope this helps,

Thanks,
Sarvani
Christian Schwabe (x)Christian Schwabe (x)
Hello Sarvani,

thanks for your reponse!
I found and read this article before, but thought that it only describe the missing helptext for fieldsets.

Encouraged by your statement, I went on another search and came across the following example: http://www.codebycody.com/2014/08/super-simple-help-text.html
I only made small adjustments to it and the result now looks like this:
User-added image

That looks like the original helpText in lightning. I like it and it stays that way now. Thank you.
 
This was selected as the best answer
Benjamin Pirih 9Benjamin Pirih 9

Greetings Christian,

Were you able to find a solution to this?  The link provided no longer works correctly.  Facing the same issue..   Can you please provide us with the information on how you made this work ( if you did )?   

Thank you!   Ben

Christian Schwabe (x)Christian Schwabe (x)
Hi Ben

I am happy to be able to help you.

The adapted solution looks like the following:
 
<apex:variable var="showTwoColumns" value="{!IF(OR($User.UIThemeDisplayed = 'Theme3', $User.UIThemeDisplayed = 'Theme4d'), true, false)}"/><!-- salesforce1-app: only one column. -->
            <apex:variable var="lightningExperienceOnly" value="{!IF($User.UIThemeDisplayed = 'Theme4d', true, false)}"/>
            <apex:pageBlockSection title="{!$Label.Input}" columns="{!IF(showTwoColumns, 2, 1)}" id="pageBlockSearchCriteria">
                <apex:PageBlockSectionItem helpText="{!$Label.HelpGASACSearch}">
                    <apex:outputPanel >
                        <apex:outputLabel value="{!$Label.Searchcriteria}" for="searchcriteriaId"/>
                        <c:SepaHelpText text="{!$Label.HelpGASACSearch}" rendered="{!lightningExperienceOnly}"/>
                    </apex:outputPanel>
                    <apex:inputText id="searchcriteriaId" value="{!search}"/>
                </apex:PageBlockSectionItem>

And the vf-component looks like this:
 
<!-- http://www.codebycody.com/2014/08/super-simple-help-text.html -->
<apex:component selfClosing="false">
	<apex:attribute name="text" description="Help Text." type="String" required="true"/>

	<div class="mouseOverInfoOuter" id="searchInvoiceHelper" onfocus="addMouseOver(this)" onmouseover="addMouseOver(this)" tabindex="0">
	    <apex:image value="/s.gif" styleClass="helpOrb" style="vertical-align: top;"/>
	    <div class="mouseOverInfo" id="searchInvoiceHelperText" style="display: block; opacity: -0.19999999999999996; text-align: left;">
	        <div class="body">{!text}</div>
	    </div>
	</div>
</apex:component>


Best regards,
Christian
elen maoel 2elen maoel 2
Can you share the complete script of this program? I want to apply this on my page of nextgenapk (https://nextgenapk.com/gta-vice-city-apk/).
Christian Schwabe (x)Christian Schwabe (x)
Hi Elen,

the solution looks like the following:
<apex:PageBlockSectionItem helpText="{!$Label.HelpRowsPerPage}">
                    <apex:outputPanel >
                        <apex:outputLabel value="{!$Label.RowsPerPage}" for="searchPerPage"/>
                        <c:SepaHelpText text="{!$Label.HelpRowsPerPage}" rendered="{!lightningExperienceOnly}"/>
                    </apex:outputPanel>
                    <apex:selectList id="searchPerPage" multiselect="false" value="{!pagination.selectedPerPageValue}" size="1" style="width:130px">
                        <apex:selectOptions value="{!pagination.selectPerPageListItems}"/>
                    </apex:selectList>
                </apex:PageBlockSectionItem>
 
<!-- http://www.codebycody.com/2014/08/super-simple-help-text.html -->
<apex:component selfClosing="false">
	<apex:attribute name="text" description="Help Text." type="String" required="true"/>

	<div class="mouseOverInfoOuter" id="searchInvoiceHelper" onfocus="addMouseOver(this)" onmouseover="addMouseOver(this)" tabindex="0">
	    <apex:image value="/s.gif" styleClass="helpOrb" style="vertical-align: top;"/>
	    <div class="mouseOverInfo" id="searchInvoiceHelperText" style="display: block; opacity: -0.19999999999999996; text-align: left;">
	        <div class="body">{!text}</div>
	    </div>
	</div>
</apex:component>


Best regards,
Christian
 
Aryan Gupta 11Aryan Gupta 11
Hojayega ye isme koi oroblem nhi , problem isme hai ki call details kaise nikale hindi me. To ye lo link, abhi dekhlo baad me mat rona. https://blogseva.com/call-details-kaise-nikale-vodafone-airtel-jio/
Roolk star440Roolk star440

That is a big problem in everybody’s mind. Since more importantly business hours vary from place to place, your best chance is to use McDonald’s location finder.
However, most of the, more importantly, locations stop at around the same time serving breakfast each day, so the information below will be sufficient in most cases.

visit here:https://mcdonalds-breakfast-menu.info/mcdonalds-breakfast-hours/