I want to apply some styles to PageBlock title like changing font color, style and background color. and Can I assign image or logo as pageblock title.. Give me some working example.

this is my code: this is my code

This is the output this is my output

I want apply same style effects to the title also..

  • can u share your current code and highlight where you need help – Vamsi Krishna Apr 24 '15 at 5:43

You may one to try using apex:facet to override pageBlock Title

 <apex:pageBlock  >
      <apex:facet name="header">
          <apex:image url="{!URLFOR($Resource.SiteSamples, 'img/force_logo.gif')}"/>
        <apex:pageBlockButtons >
     <apex:pageBlockSection title="My Content Section" columns="2">
| improve this answer | |
function colorPageBlock(pageblock, color) {
if (pageblock != null) pageblock.firstChild.style.cssText = "background-color: " + color + ";";

enter image description here

apex:page standardController="Account">

function colorPageBlock(pageblock, color) {
if (pageblock != null) pageblock.firstChild.style.cssText = “background-color: ” + color + “;”;


colorPageBlock(document.getElementById("{!$Component.redSection}"), "red");

colorPageBlock(document.getElementById("{!$Component.greenSection}"), "green");

colorPageBlock(document.getElementById("{!$Component.orangeSection}"), "orange");

| improve this answer | |
  • i guess it would help out out – Paarth Jolly Apr 24 '15 at 6:23

You can apply CSS to Pageblock header like following:

.pbHeader {

  //put your custom css here

| improve this answer | |
  • thank you for your answer.. it seems quite simple.. but could you provide an example for a better understanding.. – aravind pabbathi Apr 24 '15 at 6:15

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.