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
Neha LundNeha Lund 

Can we remove the blue header of the page Block in visual force page ?

Best Answer chosen by Admin (Salesforce Developers) 
kiranmutturukiranmutturu
<apex:page>
<apex:pageBlock mode="maindetail">
</apex:pageBlock>

</apex:page>

All Answers

Avidev9Avidev9

Yes you can use the Mode attribute of the pageblock.

try using mode="edit" or mode="maindetail" .

From the component reference
The default user mode for the pageBlock component's child elements. This value determines whether lines are drawn separating field values. Possible values are:

  • detail -- data is displayed to the user with colored lines.
  • maindetail -- data is displayed to the user with colored lines and a white background, just like the main detail page for records.
  • edit -- data is displayed to the user without field lines.
  • inlineEdit -- data is displayed as in detail mode, but child components that support it are enabled for inline editing.

Displayed lines have nothing to do with requiredness, they are merely visual separators, which make it easier to scan a detail page. If not specified, this attribute defaults to detail.

 

PS: will suggest you to go through the documentation. http://www.salesforce.com/us/developer/docs/pages/Content/pages_compref_pageBlock.htm
Neha LundNeha Lund

Hi Avi,

 

Just try this code

 

<apex:page>

<apex:pageBlock>

</apex:pageBlock>

<apex:page>

 

I want to remove the blue box which comes there

 

Can it be achieved ?

 
Avidev9Avidev9

THere is a Blue bar ?
Try this
<style>
.bPageBlock {
border-top: 0px;
}
</style>

 

Or try changing the mode to maindetail
kiranmutturukiranmutturu
<apex:page>
<apex:pageBlock mode="maindetail">
</apex:pageBlock>

</apex:page>
This was selected as the best answer
Neha LundNeha Lund

Hi,

 

Well I cannot see any style class attribute to associate with page block

 

I feel we cannot remove it

 
Neha LundNeha Lund

I was talking about blue bar not header.

 

Thanks anyways
Avidev9Avidev9
Just add this into the page


<apex:page>
<style>
.bPageBlock {
border-top: 0px;
}
</style>
<apex:pageBlock mode="maindetail">
</apex:pageBlock>

</apex:page>
Neha LundNeha Lund

Thanks, It worked fine

:)