Out of the box the comments on SharePoint blogs dont look that good.
Here is a way to fix that problem. Just add this CSS to the page and things should start looking alot better.
When working with multiple browser windows open its hard to tell one from the other because most SharePoint pages don’t offer a useful title. So in most cases you will see something like this (I am using the dreaded IE 6 unfortunately). As you can see most SharePoint pages only show the title of the page. On the home page of some sites the site name is shown as well.
Ideally the page title should not only tell you the title of the page you are looking at but also what site you are on. Chris Coyier of CSS-Tricks talks more about different options in this post. After some experimenting I was able to get this working in SharePoint.
This is a simple news slider I put together using SharePoint web services, jQuery and the Easy Slider Plugin from CSS Globe. You can get the plugin here. The Web Part points to the local site’s Annoucements list and display the title, body and a link to view the item. The jQuery connection to the SharePoint web service is based on code from Jan Tielens.
A while back there was a post on EndUserSharePoint.com by Paul Grenier that described how to use jQuery and the CEWP to make a preview pane. I thought it was a very nice solution and worked better than the out of the box preview pane SharePoint uses.
The only issue is the preview pane solution is that in environments with slow internet connections the preview pane will be almost as slow as if the user actually broswed to the display form for the item.
Although its done through AJAX jQuery is still having to load the whole DispForm.aspx and then only displaying the contents of a specific element. DispForm.aspx when rendered through the borwser (like most pages in SharePoint) is very code heavy with over 700 lines of code ( An Announcement List item). Reducing the amount of code jQuery has to load from the diplay form will decrease load times and make everyone happy.
Gabe Hilado and I decided to try to make it faster. The simple solution is to make your own diplay form in SharePoint Designer. First we tried creating a blank .aspx page and putting the list view webpart on it. The reduced the amount of code on the page but I wanted it to be even faster.
When you want to create a custom theme for a SharePoint site the top navigation menu is an important part of the design. Using the out of the box themes you can change the colors but if you really want it to look like a non-SharePoint menu it will take some work. In the standard sharepoint masterpage you will see the following code that defines the horizontal navigation. If you are not familiar with styling ASP server controls it can be somewhat confusing.
There is an updated version of this solution for SharePoint 2010 found here
I have used Dynamic Drive’s Featured Content Slider on a couple of recent projects and wanted to see if I could get it working in SharePoint. There were several key requirements:
Here’s how I did it.
First I created a custom list to store the slider items. These are the columns I used:
On the page I used a DataView WebPart to display the Title, Body, Image and Link URL columns. Using Sharepoint Designer I setup filtering on the expiration date. To do this in design view right click on the data view webpart and bring up the “Common Data View Tasks ” box and choose Filter. In the window I set the conditional statement so that items would only be shown if the expiration date was greater than today.
I got the idea for this from here: http://cssglobe.com/lab/searchfield/. The idea is that by giving users suggestions of what they should be searching for they can be guided to the most important information. When I am searching for something many times I am unsure what what search terms will give me the best results.
To get started we will need a search box to work with. The out of the box search box could work but I prefer to use the one mentioned here by Kyle Schaeffer because it gives me a lot more flexibility with the design.
Many people use a hidden content editor webpart for this purpose but there is a second option. On each page layout there is a Content placeholder called “AdditionalPageHead”.[sourcecode language=”plain”] <asp:ContentPlaceHolder id="AdditionalPageHead" runat="server">
Anything placed inside this placehodler will be added to the head of the rendered page.
You can also create your own custom placeholders in the masterpage and page layout to allow you to add items to any part of the masterpage. For instance I have created a custom placeholder to insert webparts in the footer area of the masterpage.
Designing for IE6 means you must consider its lack of support for PNG transparency. There are many PNG hacks out there, I prefer this one from Unit Interactive Labs . The problem with this one is that it has to read through the whole page searching for PNGs to fix which cna make load times noticable slower. I was trying top find a faster solution when I remembered that SharePoint uses PNGs on some of its pages.
On the all items view of most lists Sharepoint uses a png image. Built into the core code is a png fix that allows this image to work in IE6. You can take advantage of the built in png fix by using the following tag:[sourcecode language=”plain”]<asp:Content ContentPlaceHolderId="YourPlaceHolderName"
The tag will need to be inside of a content placeholder tag. You can name the placeholder whatever you want that makes sense. The placeholder canb be wrapped in a DIV tag for positioning purposes.
The ViewIcon tag will require a width and height to render properly and will not work for background images.