1. Customization Options with SharePoint
SharePoint is full of options for
customization and development. These changes can be made from many
different tools by many different users. Although every developer
doesn’t need to know each tool in depth, it helps to know what each
tool’s capabilities are and what the strengths are of each tool. Table 1 shows an overview of the different types of users and the tools they use to customize their SharePoint experience.
TABLE 1: Tools for Customization
USER |
PRIMARY TOOL |
End user |
SharePoint Sites |
Power user/Designers |
Microsoft SharePoint Designer 2013 |
Developer |
Visual Studio 2012 |
The largest group of users is end users. They
understand how to use the user interface to build an application for a
specific need. End users primarily make out of the box (OOB) changes
directly in the SharePoint site that the user has access to. Although
many developers don’t initially think of these changes as development,
SharePoint has grown over the years to include end users that fully
understand how to make small modifications to HTML, CSS, JavaScript,
and customizable web parts that allow them to build dynamic
applications.
Many of the changes focus on changing the look
and feel of the site, input entry, and information management with deep
knowledge of the problem domain the user works on. For many end users
SharePoint development is not their primary job, but a requirement to
have functional and optimal applications for the solutions they solve.
The next group of users is the power users. They
need more capabilities than the user interface provides them, and the
tool of choice is Microsoft SharePoint Designer. As the name implies,
the tool has its roots as an HTML editor for designing web pages. The
tool is a must-have for many power users, especially with improved
capabilities added in SharePoint Designer 2010 that included additional
workflow capabilities, packaging integration, BCS integration, and
richer HTML capabilities. The SharePoint Designer team understands the
importance of both the end user and developers, especially for
Application Lifecycle Management (ALM). Developers using SharePoint
Designer can deploy solutions directly to their production sites if
they build only a single site, or they can save the changes locally.
The changes stored locally can be reopened in Visual Studio for further
customization and stored in source control when they are completed.
The final group of users is developers,
and the tool for coded or packaged solutions is Visual Studio 2012.
Visual Studio 2012 gives a familiar interface for developers of .NET
languages such as ASP.NET that requires less learning time to quickly
start building apps. One of the major challenges facing new developers
has always been learning the SharePoint API Framework and understanding
how to modify the XML that defines SharePoint. The enhancements in
Visual Studio 2012 have created an improved experience and added new
tools to give developers a user interface for many common changes in
the XML.
2. OOB Developer Experience
The user interface for SharePoint has
become one of the most used development platforms. This is due to the
number of users of SharePoint and the different ways users can change
the application directly through the user interface. Many end users can
create powerful applications and experiences with a few clicks. In
addition to building the applications directly on the site, you can use
the UI to quickly create mock-up lists and sites that can be reused in
SharePoint designer and Visual Studio. This adds a great capability for
developers looking for a rapid application development (RAD) platform
for proof-of-concept code or expediting development. Each option has
been improved with SharePoint 2013 for creating full-featured business
applications.
The Get Started with Your Site web part provides
users with a quick set of actions to start customizing their sites.
They can change the look and feel, title, and logos, and share the site
with others. Not every site must have the getting started web part, but
you can allow site owners to add and remove it easily through the user
interface. When the users no longer need the web part, they can click
the Remove This link and start using the Settings menu for any future
changes.
One of the quick actions is to add the new
Project Summary web part. This new Project Summary web part can be
quickly added to the page using the Working on a Deadline? link on the
Get Started with Your Site web part. Click the link and you are
prompted to add two apps: the Tasks (with a Timeline) and Calendar (as
shown in Figure 1).
You can add other applications to the site to
further customize the look or provide added functionality, such as a
Site Mailbox. From the quick actions, click Add Lists, Libraries and
Other apps to bring up the Add apps menu. The new SharePoint store
enables you to select from a number of prebuilt applications without
coding them. When you select the SharePoint store, you can access full
prebuilt apps or apps that enhance your site.
Understanding the User Interface for Customization
Customization of sites is one of the
main actions that a developer needs to perform, whether that modifies
the look and feel or just uses web parts and apps on the page. There
have been major changes to the user interface look and feel, but the
page customization experience remains familiar. This means that the
major changes to the page with editing using the SharePoint Ribbon have
not changed. Don’t forget to click the Page tab if the Ribbon does not
automatically appear. The Ribbon is still there; it just might not be
needed at the moment. There are still contextual tabs based on the
actions you perform and the web part that you select. There is a subtle
difference with how the Ribbon displays to the user. Instead of
requiring page real estate to always be reserved, the Ribbon now drops
down onto the page and then can be hidden to display the content under
the Ribbon as shown in Figure 2 (hidden Ribbon) and Figure 3 (displayed Ribbon).
Branding the site continues to evolve because
this is one of the biggest modifications performed. SharePoint 2013
introduces a new branding experience that builds on previous versions
of SharePoint called composed looks.
SharePoint 2010 has themes that are a grouping of the files needed to
change the colors on a site. This makes it easy to quickly apply the
colors you want to the CSS on the SharePoint pages without changing the
CSS location or making any changes to the page. This did not allow
designers to completely change the look and feel with a single package,
as composed looks provide. Each composed look is made up of a Display
Name, Master Page, Theme, Background Image, and Font Scheme. Also, a
new Try It Out link has been added to make it easier to view the site
before applying any changes. As you can see from Figure 4, you can change the entire look and feel of the site with a single click.
SharePoint 2010 made great changes to the way
users edited pages using wiki page editing and adding the ability to
place web parts anywhere on the page. The ability to create and design
your layouts remains part of the rich user experience.
Microsoft has created a more intuitive user
interface by adding common language terminology and adding inline
editing for some common navigation. The use of the Pencil icon, along
with the text “Edit”, can be seen in any location that allows users to
edit. For navigation you can now click the Edit Links icon to manage
the top navigation links or the quick launch links.
Anyone new to SharePoint finds that the page
editing still provides the familiar Microsoft Word experience using the
wiki pages that enable you to add all types of rich content, from text
to images. The experience is more fluid than previous versions with new
features such as Paste Clean and a preview of applying styles before
you select them. Users were always asking what the styles looked like
to know which one to apply to the content. The Change with Preview
feature enables users to know what the pages, styles, and fonts are
before they make the content changes. Also the Styles menu is now
similar to the Microsoft Word Style menu layout with the name and a
preview of what the style looks like. Users now see the full set of
styles on the Ribbon without needing to try each one or have a style
guide printed out and next to each computer.
One feature that users have wanted is to add code
to the page without the page manipulating it when it is saved. Two new
options enable this change: the Embed Code option and the Video and
Audio embedding option. With the exponential growth of many cloud
services, users need a way to add embedded video from such sites as
YouTube and Vimeo (in addition to adding custom scripts to sites such
as Facebook, LinkedIn, and Twitter). These cloud services enable users
to build customized sites by using generated code that users can add by
copying and pasting.
Getting your web parts onto the page and
customizing them has not changed from SharePoint 2010. The Web Part
menu appears on the Ribbon for inserting your web parts onto the page.
You can select your web parts and insert them into the page as in the
previous version. In SharePoint 2013 there are also app parts that can
be added to your pages to enrich the content. These app parts are added
to the page in the same way that traditional web parts are added to the
page through the Parts viewer. To make it easier to find all of the
parts, the layout of the Web Part menu has categories: the web parts
available in that category, a description of the web part, and the
location of where to add to the web part, as shown in Figure 5.
The Modify Web Part settings have not changed
from previous versions of SharePoint. They continue to appear on the
right-side tool pane, enabling you to customize the properties for the
web part, change its appearance, or modify its layout.
One of the nice things about SharePoint
development is that you get a number of out of the box (OOB) web parts
to speed your development so that you do not need to write everything
from scratch. Although the following isn’t an exhaustive list of all
the web parts in SharePoint, it includes a number of key, new web parts
that you should be aware of: Timeline, Project Summary, and Community
Changes.
Microsoft focused on the needs of users to keep
all their tasks organized. One area that was needed was to keep tasks
visible and updated. The quickest way to add the Project Summary web
part to the page is to use the quick actions from the Get Started web
part as previously mentioned. After the web part has been added to the
page, you can allow end users to update the timeline or manage the task
list providing the data to the web part. You can see that the Project
Summary web part provides an overview of the upcoming tasks and a
timeline of the current tasks. Now you can manage all your tasks,
create a project site, and allow users to have a full view of the
timeline, all within the user interface, as shown in Figure 6.
The Timeline web part provides the timeline
without the Summary or Quick Edit links. This allows the user that is
managing the site to use the web part that fits their needs, whether
that is managing the tasks or simply viewing them. The Timeline web
part provides the ability to move the layout of the tasks. Users can
still quickly interact with the tasks on the timeline by clicking the
task, which brings up a dialog with common editing options such as
opening the full item or removing the task from the timeline.
Microsoft has created a new set of web parts
based on the new Community features. The new web parts are About This
Community, Join, My Membership, Tools, and What’s Happening. These web
parts can be added to a site that has the Community features enabled,
shown in Figure 7.
The community site already has the web parts on the page, but you can
also add them or move them on the communities you create. You can see
they are all grouped into the Community category to easily find and add
them.