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
Edward GeeEdward Gee 

Changing the look and feel of an S-Control page by entity name

From the Stylesheets and S-Controls Best Practice Guide, it was mentioned that we can reference an entity name to change the look and feel of our S-Control generated pages to look like that entity name.  For example:

<BODY class="account">

So what if I define my own custom object?  For example, we've created a Call object... I've tried "call", "Call", "call__c", "Call__c"... and none of them work.  Can we treat our custom objects as entities in this situation?

- Ed
Ron HessRon Hess
it should be something like custom18

look in at the page src for the custom object detail page you created.
Edward GeeEdward Gee
Hey Ron,

I tried that as well but it didn't work.  When viewing the page source, I see the following for my custom object:
<body ... class="Custom14Tab  overviewPage">
However, when I tried applying that same class name to my S-Control, everything renders in the default color black instead of the color schemes we chose.  I've tried "Custom14Tab", "custom14tab". "custom14" and "Custom14".  None of them seem to work.  Am I missing something here?

- Ed
Greg HGreg H
Stylesheets in general can be confusing and trying to utilize the styles that salesforce has in place can make anyone crazy.  Someone could probably start a salesforce stylesheets class and have a lot of people attend.
 
Anyway, rather than try to explain how it all works I'll simply add a template for you to use in your sControls.  Feel free to modify in any way that works for you.
Code:
<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title>salesforce Styles Example</title>
<!-- common styles --><link href="/sCSS/9.0/Theme2/en/common.css" type="text/css" media="handheld,print,projection,screen,tty,tv" rel="stylesheet">
<!-- custom styles --><link href="/sCSS/8.0/Theme2/allCustom.css" type="text/css" media="handheld,print,projection,screen,tty,tv" rel="stylesheet">
<!-- salesforce built functions --><script src="/js/functions.js" type="text/javascript"></script>
</head>
<body class="custom customTab4">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
 <tr>
  <td>
  <div class="bPageTitle">
   <div class="ptBody secondaryPalette">
    <div class="content"><img src="/s.gif" alt="Home" class="pageTitleIcon"><h1 class="pageType">Custom Layout Example<span class="titleSeparatingColon">:</span></h1><h2 class="pageDescription"> Home</h2><div class="blank">&nbsp;</div></div>
   </div>
   <div class="ptBreadcrumb"></div>
  </div>
  <div class="filterOverview">Comment out this div tag if you don't want any text...</div>
  <div class="bRelatedList">
   <div class="bNext"><div class="withFilter"><div class="clearingBox"></div></div></div>
   <div class="listCustom custom4">
    <div class="bPageBlock secondaryPalette"><div class="pbHeader"><table cellpadding="0" cellspacing="0" border="0"><tr><td class="pbTitle"><img src="/s.gif" alt="" title="" width="1" height="1" class="minWidth"><img src="/s.gif" alt="" class="relatedListIcon"><h3 class="bodyBold">Table Label</h3></td><td class="pbButton"><input value=" Want a Button– "  class="btn" type="button" title="Want a Button˜" onclick="#" name="testButton"></td></tr></table></div>
     <div class="pbBody">
      <table class="list" border="0" cellspacing="0" cellpadding="0">
       <tr class="headerRow">
        <th scope="col" class="">Column Header #1</th>
        <th scope="col" class="">Column Header #2</th>
       </tr>
       <tr class="dataRow odd" onmouseout="if (typeof(hiOff) != 'undefined'){hiOff(this);}" onfocus="if (typeof(hiOn) != 'undefined'){hiOn(this);}" onblur="if (typeof(hiOff) != 'undefined'){hiOff(this);}" onmouseover="if (typeof(hiOn) != 'undefined'){hiOn(this);}">
        <td class="dataCell">Text</td>
        <td class="dataCell">More Text</td>
       </tr>
       <tr class="dataRow even last" onmouseout="if (typeof(hiOff) != 'undefined'){hiOff(this);}" onfocus="if (typeof(hiOn) != 'undefined'){hiOn(this);}" onblur="if (typeof(hiOff) != 'undefined'){hiOff(this);}" onmouseover="if (typeof(hiOn) != 'undefined'){hiOn(this);}">
        <td class="dataCell">More Text</td>
        <td class="dataCell">More Text</td>
       </tr>
      </table>
     </div>
     <div class="pbFooter secondaryPalette"><div class="bg"></div></div>
    </div>
   </div>
   <div class="listElementBottomNav"></div>
  </div>
  </td>
 </tr>
</table>
</body>
</html>

Let me know if you have any specific questions but I hope this helps you out,
-greg
Edward GeeEdward Gee
Thanks Greg for the example... I needed the first character lowercased in my custom tab name for this to work... guess I should've figured that out... "standard" naming conventions.

I agree... I would think salesforce would be expanding their knowledgebase to include more details about their use of stylesheets beyond their current Best Practices guide.

- Ed
Edward GeeEdward Gee
Hey Greg,

I've noticed in your example, you reference the "sCSS" directory for salesforce's standard stylesheets but the example in the Best Practices Guide points to "dCSS".  Do you know what the difference is between the two?  Is one an antiquated version of the other?

- Ed
Greg HGreg H

Hi Ed,

That's a good question and I don't know if one is older than another or if the sCSS version is where they try styles out?  My guess is that they probably only support use of the version in the documentation and that I should change my template.  Maybe one of the salesforce guys can provide some feedback on your question?

-greg
Edward GeeEdward Gee
I've noticed that references to the "sCSS" stylesheets generate the tan-ish backgroud in the subheaders of a page whereas "dCSS" doesn't.  I've also noticed that "sCSS" is used by the current salesforce pages so maybe that is the correct one to use nowadays.  I've noticed other people comment on the message boards  that the Best Practices Guide on stylesheets is outdated or contained old information.

But yes, I'm hoping someone from salesforce can comment directly on this question.