Creating a News-ticker on the salesforce.com Home Page

Animated text messages and custom HTML styling can be very effective in gaining users’ attention.

Not only do they allow a reasonably large amount of characters to be presented on a single line of text but they also provide a visually dynamic “headline news” style of message delivery for what can otherwise be overlooked static text.

You can draw attention to your news message on the Salesforce Home Page using this custom home page component recipe and by following these steps:

How to do it…

Carry out the following steps to create a News-ticker message on the Home Page:

1. Navigate to the home page components setup page, by clicking the following: Your Name | Setup | Customize | Home | Home Page Components.

2. Click New

The New button is found by scrolling down the page to the Custom Components section.

3. Click Next (on the Understanding Custom Components Splash screen if shown)

4. The Next button is found on the Understanding Custom Components Splash screen (this page is only shown if the checkbox Don’t show this page again has not previously been checked) as in the following image:

Understanding Custom Components

Here, we are presented with the Step 1. New Custom Components page.

5. Enter the name of the Custom Component in the Name field.  In this recipe,  type the text News Ticker.

6. Select the HTML Area option from the Type options list.

7. Click Next.

8. Ensure the option Wide (Right) Column is selected within the Component Position option list.

Note: You are unable to change this setting after the component is created.

9. Check the Show HTML check box

The above step is important! Locate and check the Show HTML checkbox as shown in the following image:

Check the Show HTML Checkbox

10. Paste the following code (as shown in the image further below):

<center>

<div style=”border: 1px solid rgb(51, 153, 255); width: 96%; color: black; font-size: 18px; background-color: rgb(255, 255, 204);” id=”NewsTicker”>

<marquee onmouseover=”this.scrollAmount=0″ onmouseout=”this.scrollAmount=6″ width=”98%”>Welcome to the Salesforce CRM Admin cookbook</marquee></div></center><br>

11. Click Save

We have created our News Ticker custom home page component but we are not finished yet. We now need to add the custom home page component to a home page layout

12. Navigate to the home page components setup page, by clicking the following: Your Name | Setup | Customize | Home | Home Page Layouts.

13. Determine which home page layout to place the component and click Edit. Here we are editing the home page layout named DE Default as shown:

Home Page Layouts

We are presented with the Step 1. Select the components to show page.

14. Check the News Ticker check box in the Select Wide Components to Show section as shown:

News Ticker

15. Click Next

16. Position the News Ticker as the top position in the Wide (Right) Column using the Arrange the component on your home page. section as shown:

Step 2 Order the Components

17. Click Save

How it works…

By using HTML and in particular the HTML Marquee tag and CSS (Cascading Style Sheets), we are able to present a moving text section.  You can see what this looks like in the following image:

How it Works

There’s more…

Replace the text Welcome to the Salesforce CRM Admin cookbook text with a suitable message of your choice.

When entering HTML and Javascript code into the HTML editor section (in Step 2 of the New Custom Component wizard) you must ensure that the code is valid.

Please pay particular attention to the displayed warning message Please ensure that the HTML code entered below is valid, well formed HTML. Poorly written HTML in this component may cause the entire Home tab to appear incorrectly.

There is a maximum of 20 Custom Components that can be added to a Home Page layout.

The marquee tag is a non-standard HTML element which causes text to scroll up, down, left or right automatically. “The marquee element was first invented for Microsoft‘s Internet Explorer and is still supported by it. Firefox, Opera, Chrome and Safari web browsers support it for compatibility with legacy pages.”  from http://en.wikipedia.org/wiki/Marquee_element

Reference: Salesforce CRM Admin Cookbook

Salesforce CRM Admin Cookbook

  Packt Publishing – http://www.packtpub.com/salesforce-crm-admin-cookbook/book

Book and eBook expected May 2013. Pre-order now!