You are currently browsing the monthly archive for February, 2009.
Today, I am going to describe a way to color rows in a SharePoint list. We’ll cover two cases:
- highlight rows on mouse over
- apply color coding to rows (cf. picture)
The implementation will be done through the standard SharePoint UI (no SharePoint Designer, no server access).
In this post, I assume that you are familiar with the “HTML calculated column“. If not, be prepared to read several other references to catch up!
In the past 6 months, I have proposed many examples using calculated columns to write HTML. If you are not familiar with this method, I strongly recommend that you first check out the post that started it all before reading the rest of this article.
Warning! This article doesn’t offer any plug and play example. Wait for my next article to see the method at work.
The HTML calculated column method has allowed us to include ”div”, “a”, “img”, “iframe”,”table” and other tags in our formulas. Now, have you tried to use “script” tags? If it worked, this would open up a whole new world of opportunities! Read the rest of this entry »
In my quest for SharePoint blogs, I came across several other useful resources. I have published them on my SharePoint site:
http://www.pathtosharepoint.com/Lists/Resources/AllItems.aspx
You’ll find ~50 links in this list. They cover various topics, including calendar, social networks, screencasts, live demos, forums, etc. The most represented sites are WSSdemo.com (4 links) and EndUserSharePoint.com (3 links).
As usual, feedback and suggestions are welcome!
Even virtual workers have a real desk…
Although I have found a great SharePoint community online, nothing replaces real life contacts.
Here are the areas where I plan to spend some time in the next 6 months:
- Europe (France/Luxembourg)
- California (San Diego)
- China (Shanghai, Beijing, Sichuan)
I am looking forward to opportunities to meet other SharePoint addicts. If you know either SharePoint professionals or user groups in these areas, please let me know!
My e-mail address: Christophe@PathToSharePoint.com.
Yesterday I shared a live demo that shows how the usability of boxed views can be improved. Really cool effects, thanks again jQuery!
But, as Charlie Epes commented, a script that changes the boxed view from two columns to one would already be really useful.
So here is a simple one – 4 lines!
<script type="text/javascript">
var boxedview = document.getElementById("WebPartWPQ1").innerHTML;
boxedview = boxedview.replace(/<td width="1.5%"> <\/td>/gi,"<\/tr><tr style='font-size:6px\;'><td> <\/td><\/tr><tr>");
boxedview = boxedview.replace(/<td width="1%"> <\/td>/gi,"<\/tr><tr style='font-size:6px\;'><td> <\/td><\/tr><tr>");
document.getElementById("WebPartWPQ1").innerHTML = boxedview;
</script>
Add the script to a CEWP, under the boxed view. You can see it at work on this page.
The above script is written for wss. It identifies the Web Part by its id “WebPartWPQ1″. If you use MOSS, or if the boxed view is on a page along with other Web Parts (typically on the site home page), you’ll need to change the id to “WebPartWPQ2″ or ”WebPartWPQn“. Or you can modify the code to scroll through all the Web Parts on the page and grab the boxed views.
Among the OOTB views offered in SharePoint, the boxed view is the one I find the most elegant. I like to use it on a home page, to display announcements for example.
However, there is one drawback with this view: it is not very flexible, and in particular, it forces the display of items in two columns.
jQuery to the rescue!
I have created a live demo to show how the boxed view can be tweaked with the help of some client side JavaScript. You can see the result on the home page of my demo site:
http://www.pathtosharepoint.com
In this example, I have chosen to display a list as scrolling news. If you press the “Next” button, or wait for 6 seconds, the list will move to the next announcement. Each announcement has the original ”boxed” look.
Once again, I am relying on jQuery here. This time I am using a carousel plugin called jCarousel lite. Note that the same plugin is also included in this page, where I display feeds from SharePoint blogs.
I still need to work on the script. In particular, there are several carousel plugins available for jQuery, and I haven’t yet figured out which one works best with SharePoint. Stay tuned!
Most pages on your SharePoint site display a left navigation, also known as “Quick Launch”. However, new Web Part pages that you add through the Create menu do not have it.
So how can we add the Quick Launch to these pages, using only the SharePoint UI? Here again, the iframe can help. On our Web Part page we are going to:
1/ load the site home page in the background
2/ extract the Quick Launch
3/ include it in our page
4/ do some cleanup to avoid conflicts with the rest of the page
This is very similar to the method I described to display a list in another site – just here everything happens within the same site.
Recent Comments