+ Start a Discussion
Swamy P R NSwamy P R N 

How to change section header title and sub title format in visualforce pages by using css or any?

Hello guys,

I want to change the section header title, subtitle format i.e, in default it will shows as predefined format. But i want it to be customize i.e, title format should be in italic and subtitle format should be in arial format.

So is thery any snippet of code to cusomize it in visualforce page?

Thank you!!
Best Answer chosen by Swamy P R N
shiv@SFDCshiv@SFDC
We need to forfully apply font size on section title. I have tried following and it's working for me.

.bPageTitle h2 {
            font-family: arial,"Times New Roman", Georgia, Serif;
            font-size: 90% !important; 
            // you can write this way also font-size: 40px !important;
        }
        
        .bPageTitle h1{
            font-style: italic;
            font-size: 100% !important;
        }

Please mark answar as solution if it resolve your issue.

All Answers

Tushar sharmaTushar sharma
bind section with style class and in the css you can change font format and other thing as per your requirment
shiv@SFDCshiv@SFDC
Add following style in your VF Pages.

<style>
        
        
        .bPageTitle h2 {
            font-family: arial,"Times New Roman", Georgia, Serif;
        }
        
        .bPageTitle h1{
            font-style: italic;
        }
        
 </style>

If it resolve your issue, please mark answer as solution.
Swamy P R NSwamy P R N
Hi Shiv,

your answer was fantastic, its working perfectly. When i gave sizes, it is not changing. I did like this,
<style>
        .bPageTitle h2 {
            font-style:italic;
            font-size: 90%;           
        }
       
        .bPageTitle h1{
            font-family: arial,"Times New Roman", Georgia, Serif;
            font-size:200%;
        }
</style>

Will you confirm me, whether it is correct or not. If not, where i need to change?
Thanks Shiv.
shiv@SFDCshiv@SFDC
We need to forfully apply font size on section title. I have tried following and it's working for me.

.bPageTitle h2 {
            font-family: arial,"Times New Roman", Georgia, Serif;
            font-size: 90% !important; 
            // you can write this way also font-size: 40px !important;
        }
        
        .bPageTitle h1{
            font-style: italic;
            font-size: 100% !important;
        }

Please mark answar as solution if it resolve your issue.
This was selected as the best answer