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
sushmaiyer2@gmail.comsushmaiyer2@gmail.com 

How to get Border for Account detail page & Change its text Colour?

I have a requirement which says Account detail page should have border and all its Section Names and Related List names should be in Orange Colour.

I went throught the following but couldnt implement :-

http://www.salesforce.com/us/developer/docs/pages/Content/pages_compref_component.htm
http://www.salesforce.com/us/developer/docs/pages/Content/pages_comp_cust_elements_attributes.htm

This is what till now i have done :-

<apex:page standardController="Account" tabStyle="Accounts__tab">
<apex:pageBlock >
<apex:pageBlockSection >
<TABLE BORDERCOLOR="RED" width="195%">
<tr>
<apex:detail relatedList="false"/>
</tr>
</TABLE>
</apex:pageBlockSection>
</apex:pageBlock>
</apex:page>

 

The problem in the Above is:-
1.Section Names are not Visible.
2.Related lists should be available outside account detail.
3.Names of Section and Related list needs to be Orange in colour.


Please Kindly Help and Guide...:(

Best Answer chosen by Admin (Salesforce Developers) 
Puja_mfsiPuja_mfsi

Hi,

You can use css for this  and u need to override the sandard CSS

<apex:page standardController="Account" tabStyle="Account">
<apex:form>
<style>
          .pbTitle h3 , .pbTitle h2 , .pbSubheader h3{
                  color : orange !important;
          }
          body.detailPage .bDetailBlock.bPageBlock[id^="ep"] {
                   border: 1px solid red;
           }
</style>
<apex:detail relatedList="true"/>

</apex:form>
</apex:page>

All Answers

Puja_mfsiPuja_mfsi

Hi,

You can use css for this  and u need to override the sandard CSS

<apex:page standardController="Account" tabStyle="Account">
<apex:form>
<style>
          .pbTitle h3 , .pbTitle h2 , .pbSubheader h3{
                  color : orange !important;
          }
          body.detailPage .bDetailBlock.bPageBlock[id^="ep"] {
                   border: 1px solid red;
           }
</style>
<apex:detail relatedList="true"/>

</apex:form>
</apex:page>

This was selected as the best answer
AmitdAmitd

Great work done. Hats off to you Puja....
sushmaiyer2@gmail.comsushmaiyer2@gmail.com

Hi Puja & All,

 

Can the same requirement be fullfilled using Jquery in Salesforce?As I have never used Jquery have no idea,Please kindly Help and guide...
Puja_mfsiPuja_mfsi

Hi,

For using Jquery you need to include a java script file in your Visual Force Page .You can download "min.js" file from any site after that uplaod this into static resource and use in Visual force page .

and I have use the Jquery below to achieve the same functionality :

 

<apex:page standardController="Account" tabStyle="Account">

<apex:form >
<apex:includeScript value="{!$Resource.JSQuery}"/>

<apex:detail relatedList="true"/>
<script>
$(".pbTitle h3,.pbTitle h2,.pbSubheader h3 " ).css({
color : "Orange"
});
$("body.detailPage .bDetailBlock.bPageBlock[id^='ep']").css({
border: "1px solid red"
});
</script>
</apex:form>
</apex:page>

 

If you have any query you can write down in post..

Please feel free to ask.

 
sushmaiyer2@gmail.comsushmaiyer2@gmail.com

Hi Puja,

 

That worked...Thanks a Lot...:)

But in that i have a requirement like i need to create custom subsections of a Section,how can i achieve that?