function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
lakshmi.sf9lakshmi.sf9 

How can we change PageBlockSection background color

Hi,

Can any one please tell how can we change pageblocksection background color.

I am trying the below code.It is not working

<apex:page standardController="Account">
<style>
.panelWrapper {
    background-color: green;
}
</style>
<apex:outputPanel styleClass="panelWrapper" layout="block">
    <apex:pageBlock title="Hello">
        <apex:pageBlockSection title="pageblocksectionName">
        </apex:pageBlockSection>
    </apex:pageBlock>
</apex:outputPanel>
</apex:page>

Thanks in advance
Arunkumar RArunkumar R
In standard way salesforce doesn't support Style for pageblocksection, But you can apply using script.

Here is the code,
<apex:page standardController="Account">

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

}
</script>


<apex:form>

<apex:pageBlock title="My Content" mode="detail">
<apex:pageBlockSection id="redSection" title="My Content Section" columns="2">
<apex:inputField value="{!account.name}"/>
<apex:inputField value="{!account.site}"/>
<script>colorPageBlock(document.getElementById("{!$Component.redSection}"), "red");</script>
</apex:pageBlockSection>

</apex:pageBlock>

</apex:form>

</apex:page>
Rehan DeveloperRehan Developer
Hi Lakshmi, 

If you want to just change the background color for only PageblockSection, then you have one option as specifying "tabStyle" in <apex:pageBlock> tag.

Eg:
<apex:pageBlock tabStyle="Contact" title="Hello">

Or if you want to do for whole Output Panel...then you apprach is correct just instead of using <apex:pageblock> inside of outputpanel use <table> tag to show you content.

I hope you will get answer to your question via this solution.

Please let me know your response.

Thanks