+ Start a Discussion
srinivasusrinivasu 

how to hide/remove related list icons while rendering in a VF page?

Hi,

 

I have a requirement where i have to hide or remove the icons of related list like Contract/Account,Contacts etc.

I have to use <apex:relatedlist> because of some restrictions. But the icons are also appearing which is not required.

 

I tried below code by reading the html source and tried to hide the relatedListIcon class but it is not working.

Can you please suggest.

 

 

<apex:page standardController="Account" standardStylesheets="true"  sidebar="false" showheader="false">

<style>
body
{
font-size:13px;
}
</style>
   
<style>
.relatedListIcon{display:none;}
</style>

 

<apex:relatedList list="Contacts"></apex:relatedList>

 

</apex:page>

 

 

 

Thanks and regards

Srinivasu

Best Answer chosen by Admin (Salesforce Developers) 
Chris JohnChris John

You could use facets to replace the header of the relatedList to something other than the default icon and buttons.

 

E.g. something like:

 

<apex:page standardController="Account" standardStylesheets="true"  sidebar="false" showheader="false">
<style>
body
{
font-size:13px;
}
</style>
   
 
<apex:relatedList list="Contacts" >
    <apex:facet name="header">My New Header</apex:facet>
</apex:relatedList>
 
</apex:page>

All Answers

Chris JohnChris John

You could use facets to replace the header of the relatedList to something other than the default icon and buttons.

 

E.g. something like:

 

<apex:page standardController="Account" standardStylesheets="true"  sidebar="false" showheader="false">
<style>
body
{
font-size:13px;
}
</style>
   
 
<apex:relatedList list="Contacts" >
    <apex:facet name="header">My New Header</apex:facet>
</apex:relatedList>
 
</apex:page>
This was selected as the best answer
srinivasusrinivasu

Hi John,

 

Thank u for the simple solution.

But is it possible to increase the font size of only the header part using this piece of code.

 

Thanks and regards

Srinivasu

Greg RohmanGreg Rohman

Hello.

 

I ran into a similar problem, and was able to style the title of the related list by extracting the <table> code from an existing related list, and wrapping that in my "header" facet. See below:

 

<apex:relatedList list="Contact_Call_Report_Links__r" pageSize="10">
<apex:facet name="header"><table border="0" cellpadding="0" cellspacing="0"><tbody><tr><td class="pbTitle"><img src="/s.gif" alt="" width="1" height="1" class="minWidth" title=""/><img src="/s.gif" alt="" class="relatedListIcon" title=""/><h3>PUT YOUR RELATED LIST TITLE HERE</h3></td><td class="pbButton">&nbsp;</td></tr></tbody></table></apex:facet>
</apex:relatedList>

 I'm not sure if that's the best way, and it might break with future saleforce updates, but it's working for me right now. Let me know if there is a better way.

 

-Greg