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
Bob1352Bob1352 

How do show many icons

I ran out of tabs, so I'm developing an SControl to show a link to many applications. I want to add some icons on the left, but when I see others code I find that the source is always s.gif

Can anyone please tell me how to display more than the original image that belongs to the class??
thank you!!

lee.boonstralee.boonstra
That s.gif is reffering to a stylesheet. When you have the Webdeveloper Toolbar for Firfox installed as browser plugin, you can inspect the image and see the salesforce paths in the stylesheet as a background-image of s.gif.
For example:

Code:
documentTab .bPageTitle .pageTitleIcon {dStandard.css (line 443)
 background-image:url(/img/icon/documents32.png);
 height:32px;
 width:32px;
}

 
Greg HGreg H
The s.gif file is an image that gets placed on top of the actual icon used by salesforce.com.  This is done because older versions of Internet Explorer cannot properly display .png files and many of the icons used by salesforce are .png file types.
 
By combining many of the styles that salesforce uses you can mimic the various icons and colors for use in your sControl and rather than get into the details about how or why this works I will simply provide you some code that can give you the skeleton for whatever it is that you are trying to design.  That code is here:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
 <title>Multi-Icon Sample</title>
<!--
 Created by: Greg Hacic
 Last Update: November 08, 2007
 Questions?: greg@interactiveties.com
 2007 Interactive Ties, LLC
-->
<!-- common styles --><link href="/sCSS/10.0/Theme2/default/common.css" type="text/css" media="handheld,print,projection,screen,tty,tv" rel="stylesheet">
<!-- custom styles --><link href="/sCSS/10.0/Theme2/allCustom.css" type="text/css" media="handheld,print,projection,screen,tty,tv" rel="stylesheet">
</head>
<body class="Custom1Tab detailPage">
<div class="bRelatedList individualPalette">
 <div class="listRelatedObject Custom21Block">
  <div class="bPageBlock secondaryPalette">
   <div class="pbHeader"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="pbTitle"><img src="/s.gif" alt="" class="minWidth" title="" height="1" width="1"><img src="/s.gif" alt="" class="relatedListIcon" title=""><h3>Heading 1</h3></td><td class="pbButton">&nbsp;</td><td class="pbHelp"><span class="help" title="">&nbsp;</span></td></tr></table></div>
   <div class="pbBody">Put Content Here</div>
   <div class="pbFooter secondaryPalette"><div class="bg"></div></div>
  </div>
 </div>
 <div class="listElementBottomNav"></div>
</div>
<div class="bRelatedList individualPalette">
 <div class="listRelatedObject Custom23Block">
  <div class="bPageBlock secondaryPalette">
   <div class="pbHeader"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="pbTitle"><img src="/s.gif" alt="" class="minWidth" title="" height="1" width="1"><img src="/s.gif" alt="" class="relatedListIcon" title=""><h3>Heading 2</h3></td><td class="pbButton">&nbsp;</td><td class="pbHelp"><span class="help" title="">&nbsp;</span></td></tr></table></div>
   <div class="pbBody">Put Content Here</div>
   <div class="pbFooter secondaryPalette"><div class="bg"></div></div>
  </div>
 </div>
 <div class="listElementBottomNav"></div>
</div>
</body>
</html>

On a related note, I just built an application that will allow you to organize and display any number of links on a single tab.  I built this app to get around the tab limitations in Enterprise Edition and also because it makes testing and accessing sControls much easier.  In addition it creates a single source for many applications or important URLs for your users.  Since I already built this it would save you a ton of development time so email me if you are interested in purchasing and we can work through the details .
 
Thanks,
-greg