Thursday 3 February 2011

Pimp My SharePoint

This post is about customising SharePoint and is part of my series on Supercharging SharePoint Server.

If you already develop web applications on the Windows, IIS, SQL and ASP (WISA) stack you may be forgiven for thinking that writing for SharePoint will be relatively painless, after all SharePoint has a base layer – Windows SharePoint Services (WSS) – which is built on top of the ASP.NET framework (with SharePoint Server built on top of this assemblage).

Developing for SharePoint may however require you to suspend this thinking (a bit) and understand that many complex challenges have already been solved in SharePoint; and that the task at hand is shifted away from developing the architecture to subscribing to a more delineated framework in which to design your application.

Some common elements of a SharePoint site are:
  • Top-level website – a top-level site is the uppermost site in a site collection.
  • Sub-sites – one or more sub-sites can be created below the top-level site; sub-sites can also be created beneath other sub-sites.
  • Lists – a list is a table of columns and rows (similar to a database table), items can be added to a list using the list’s form. Lists are highly customisable and can be used to store many types of data.
  • Document Libraries – a document library is a special kind of list that is designed to hold documents.
  • Web part pages – a web part page usually contains one or more web part zones where users can add web parts.
  • Web parts – web parts can be used to redefine content from lists and libraries or to endow the page with additional functionality.
  • Event Handlers – custom event handlers can be added to sites, lists, items and content types to alter or extend their behaviour, such as performing additional business logic when an item is added to a list.

To deliver the site 'My UK Youth' on SharePoint Server we used all of the common elements of a SharePoint site and then applied some configuration changes, custom pages and form layouts, content types, controls and web parts including:

Tips and pointers

Enhanced site map path control

Our take on the Microsoft Office SharePoint Server People Picker using Microsoft ASP.NET Ajax

Saturday 22 January 2011

SharePoint Branding and Design

This post is about SharePoint branding and design and is part of my series on Supercharging SharePoint Server

There are several options to choose from when designing a Microsoft Office SharePoint site and – as well as the regular HTML and CSS layout techniques that you might use on any other type of web page – you can harness master pages, page layouts, themes, site templates and site definitions to put your design on SharePoint.

Referring to my first post on Supercharging SharePoint Server, this study site is made up of a number of site collections organised in a hierarchy that reflects the structure of the Youth Achievement Awards. Most of the pages in each of the site collections are derived from page layouts (or content pages) that in turn refer to a single master page at the top level. This master page provides the fixed layout and content that is reflected throughout the site as a whole.

The Youth Achievement Awards master page on Microsoft Office SharePoint Server

The layout for this master page was developed using ordinary HTML and CSS, it is a fluid layout – which means it will size to the user’s browser – and has a header with logos, a toolbar and a breadcrumb, and a footer containing other links – the space between the header and footer is where our individual page content will sit. You can initially design the master pages and page layouts away from SharePoint, in fact we developed the HTML and CSS layouts and checked these in all popular browsers long before plumbing them into SharePoint itself.

Page layouts are framework pages that once deployed carry the site's content; this content may include lists of user content, document libraries, and other web parts – used to redefine content or endow the page with additional functionality. User's can easily add their lists, libraries and web parts to one or more web part zones declared in the page layout.

Stepping back to our site design, we originated single column, two-column and three-column layouts for the inside pages and allowed for a corresponding number of web part zones on each page. This approach, in tandem with the master page, allowed us to lay down the arrangement of all site content into just three different types of page on which web parts could be placed.

2-column and 3-column layouts with web parts added

Wednesday 12 January 2011

Supercharging SharePoint Server

For my first set of blog posts I'll be exploring the end-to-end production of a real-world custom site built on Microsoft Office SharePoint Server.

In the forthcoming series of blog posts I'll be showing you how we planned, developed and deployed an exciting social site using Microsoft Office SharePoint Server, forms-based authentication, ASP.NET and a bunch of other tools and techniques to supercharge the out-of-the-box offering and transform the delivery of the Youth Achievement Award – an activity-based approach to peer education.

The idea to leverage the content, document and user management capabilities of Microsoft Office SharePoint Server had to be finely balanced against the need to create a simple, friendly and intuitive environment for our users – who, on the whole, would not relate to the ordinary workings of Microsoft Office SharePoint Server.

Our final design allowed us to make the leap from an office style environment to an exciting social space where users can engage with their peers and work towards a nationally recognised award.

The Youth Achievement Awards home page on Microsoft Office SharePoint Server

Our take on the Microsoft Office SharePoint Server People Picker using Microsoft ASP.NET Ajax

Planning and deploying the web site was a large-scale team project that encompassed multiple planning, deployment, and customisation tasks. In this blog I’ll be taking you on a journey through the deployment and customisation tasks necessary to create this solution based on Microsoft Office SharePoint Server.

Background


Developed by UK Youth, the Youth Achievement Awards have long been established in youth groups, schools and colleges as a means of recognising and accrediting young people's achievements through a peer group approach.

An overtly simplistic way to describe the award programme is to say that a youth group delivers an award programme (bronze, silver, gold and platinum) to a learner. Each award comprises a number of challenges which are defined by the learner doing the award and appraised by their award group (whom they choose). At the end of the challenge a series of approval workflows are carried out that will finally result in the learner's challenge being awarded and ultimately (with all of the challenges completed) the award itself.

From our perspective we needed to design a site that would accommodate a large number of youth group sites (each independently managed by the youth group) which would house a collection of learner's award portfolios. Each portfolio would contain one or more award sites that the learner was working toward or had completed, with each award site in turn hosting a collection of challenge sites that the learner had developed as part of their award.

Moreover, the site needed to provide the tools to help young people complete their award challenges, collect evidence, collaborate with their peers, assess their own development and use it as a vehicle to articulate their achievements.

To clarify this viewpoint:
  1. A learner searches for and submits a portfolio request to a youth group
  2. The youth group's site owner is notified and approves the request; the learner's portfolio site is automatically provisioned and the learner is notified
  3. The learner visits their portfolio site and adds other registered users to their own award group
  4. The learner chooses and starts a bronze award; the bronze award site is automatically provisioned
  5. From their new award site the learner plans and starts a bronze challenge; the challenge site is automatically provisioned
  6. During the course of their challenge the learner logs in and visits their challenge site to record information about their challenge, upload evidence and interact with their award group online
  7. The learner completes their challenge
Now, there’s quite a bit more to it than that but hopefully you get the general idea.

SharePoint Branding and Design