Wiki-in-the-Box – Is SharePoint Wiki Really that Bad?

Today I’m going to get off the SharePoint Designer shtick, and go back to SharePoint basics. In particular, I want to take a closer look at SharePoint’s built-in wiki functionality.

SharePoint’s wiki has taken a lot of grief online lately. Some people look at various dedicated wiki systems, then at SharePoint, and come to the conclusion that SharePoint’s wiki just doesn’t measure up to the "best of breed". There is a big difference, however, between "not the best" and "totally inadequate".

The Real Question

If you use SharePoint in your company, and are considering whether to purchase a third-party wiki replacement, the question you really need to ask isn’t, "Is SharePoint’s wiki the best there is?", but rather "Will SharePoint’s wiki do the job I need done?"

To help you answer that question, we’ll take a look at what a wiki is, what you might want it to do, and what SharePoint’s Wiki offers "in the box" to answer those needs. I’ll also check out what simple enhancements are available (both within SharePoint, and via add-ons) to extend that built-in functionality.

Just What is a Wiki, Anyway?

Creating pages for the web has historically been a complicated process. It required page creation and editing on a client computer (usually with a specialized tool), and then uploading the finished pages to the web site. Linking required knowing where the target pages were going be relative to the current page.

Wiki-wiki is Hawaiian for "quick". The first wiki was designed to make it quick and easy to create and edit web pages, as well as the links between them. Rather than force users to understand HTML markup, and site structure, a wiki lets them create a link, and if the target page doesn’t exist, it will be created automatically when the link is clicked for the first time. Combined with in-place editing, this effectively makes a wiki a form online content management system.

As noted earlier, a user doesn’t need knowledge of HTML markup to use a wiki. However, because wikis historically have used plain text boxes for entering content, over time conventions have developed for a "wiki markup" for such things as bold and italic text, intra-page section headings, etc… I’ll talk about this in more detail in the next section.

Note: WikiWikiWeb, the software created by Ward Cunningham for that first wiki, used a different syntax from most modern wikis when it comes to links. WikiWikiWeb used compressed text (i.e. Leading-cap words with no spaces between) to indicate text was a link. Current wiki markup convention calls for intra-site links (also known as wiki links) to be defined with [[double square brackets]].

In addition to being quick and simple, there is another, non-technical, aspect to a wiki – something of a "wiki philosophy". This philosophy holds that a wiki should be open to modification by anyone who has something to contribute – even anonymously. Most public wikis hold to this philosophy, however it is not without its problems. For example, while the desired benefit – people with actual knowledge of a subject contributing and correcting inaccurate information – is clearly achieved, it is just as easy for others to post deliberately incorrect information, or even vandalize sites.

While such defacement is just as easily corrected, most modern wiki systems do incorporate certain safeguards – such as authentication, change logs, and approval processes – which can be implemented at need. Indeed, even WikiPedia, the most prominent wiki site on the internet, treats authenticated and anonymous contributions differently, and allows article (page) creators to prevent anonymous edits.

SharePoint Wiki – On the Surface

Now that you know basically what a wiki is, and how they were created to make it easy for non-technical users – and particularly subject matter experts (SMEs) – to create and manage web content, let’s take a look at a SharePoint wiki site.

Note: SharePoint has two things called "wiki". The Wiki Library, and the Wiki Site template. A Wiki Library can be created on almost any SharePoint site, and is accessed through quick-launch just like any other SharePoint list or library. When you create a Wiki Site, a Wiki Library is created in it automatically, the site is set to use the Wiki Library’s home page as its default, and a Wiki Pages section is created in the Quick Launch bar. The behavior of the Wiki Library itself is otherwise identical.

In most respects, a SharePoint Wiki is very similar to any other SharePoint site, as shown below. However, when you look a little closer, you start to see some differences:

1. Wiki Toolbar – The wiki toolbar gives you direct, 1-click access to editing a page, viewing its change history, or discovering what other pages in the wiki link to it.
2. Quick Launch Bar – Notice the Wiki Pages section. This is created in a Wiki Site only. Other "normal" sections (e.g. Lists, Discussions, etc…) are generated as needed if you add them to the site. On non-wiki sites to which a Wiki Library is added, this section is not created automatically.
3. Recent Changes Bar – The Recent Changes bar lists the last five pages that have been updated.

Whether stand-alone, or part of a wiki site, two pages are created by default in a SharePoint wiki library – the Home page (shown above), and "How to use this Wiki" (the text varies slightly to reflect the library or site context). While wikis, by definition, are very easy to use, a quick glance through the "How to" page can still be very helpful. It provides quick tips on the two elements of a SharePoint wiki that are not "obvious", especially to new users – the [[double bracket]] wiki link syntax, and how to create new pages.

To help prevent the creation of orphan pages (those with no incoming links), users are encouraged to grow the site organically, by editing an existing page and adding wiki links. Recall that, if you create a wiki link to a page that doesn’t exist, a new page will be created when that link is first clicked.

Getting Started

The first thing you will probably want to do, is edit the home page to reflect your purpose in creating the wiki site, and create some "seed" links to get your users started.

Notice how I have "set the stage" for my users. I haven’t actually entered any information yet, but by creating these links and a description, I have let people know the purpose of this site. Now, anyone with write permission can click on one of the links with dashed underlines, and they will be able to create content.

Which brings us to the first area of concern in many environments – if "anyone" can go in and modify these pages, what if someone totally messes things up? This is where the page history comes into play. By clicking the History button in the wiki toolbar, I can easily see what changes have been made over time. For example, in the screenshot below, you can easily see the changes I have made to the home page from the default, with added and deleted text highlighted in different colors from that which was unchanged:

 

Because in most environments SharePoint is used with authentication, you will know not only what changes were made, and when, but by whom.

The Editing Experience

One of the complaints often leveled against SharePoint’s wiki is its lack of support for "wiki markup" beyond intra-site page links. While this is true as far as it goes, it doesn’t consider what that markup is designed to do – compensate for the plain-text editing features of most wiki systems. For example, to make italic text in many wiki systems, you enclose the text in ”double apostrophes”. Yet while there are some conventions, there is no true "wiki markup" standard.

Here is an example of the page editing experience in a SharePoint wiki:

Notice that SharePoint’s wiki actually provides a full rich-text editor, with direct toolbar-based access to text formatting, external hyperlinking, etc… The results from these tools are stored as standard HTML markup. This strongly mitigates the need for specialized wiki markup beyond the already included internal linking.

Note: Out of the box, the rich-text editing experience is only provided for users of Internet Explorer. If you have many non-IE users, I strongly suggest that you download and install Telerik’s RadEditor Light. This is a free tool, the use of which is fully supported by Microsoft. I have provided a detailed write-up of it in an earlier blog post. Even if you do use IE, RadEditor Lite provides many other features that are particularly useful in a wiki environment.

Digging Deeper

So, looking at the "wiki" features of SharePoint’s wiki, we see a very easy to use system, which, while it may not offer everything a competitor’s wiki has, isn’t too bad. But the story doesn’t stop there. The other side of the "SharePoint Wiki" equation is SharePoint itself. As a part of SharePoint, the wiki library comes with a number of very useful capabilities, especially around site management.

Much of the "SharePointiness" of the wiki library is suppressed from the default page views. Nevertheless, it is in there, just below the surface. The easiest way to access it is to click the "View All Pages" link in the Recent Changes bar. This brings up a standard SharePoint view of your wiki library:

From here, you have access to all sorts of abilities:

• Setting Alerts to be notified of changes
• Setting the permissions of the library, or even individual pages
• Adding metadata fields – for example, subject tags, or even links to supporting documents
• RSS feeds
• Requiring approval and document check-out for changes.
• Creating different views of the information

In addition, because wiki pages are considered individual files by SharePoint, they have individual URLs, making it easy to provide "friendly" links to users, as well as get detailed usage reports.

Because a wiki page is a "page" in SharePoint, you have a second editing option, under the Site Actions menu. This edits the SharePoint, rather than Wiki aspects of the page, and allows you to add web parts to a page in your wiki. These parts will only appear on that specific page, but can be used for virtually any purpose. For example, here I’ve added a web part that is a view of the wiki library which displays a page preview when you roll over a title:

Content in a SharePoint wiki is also automatically included in SharePoint searches, making it easy to find information even if you don’t know exactly where in the wiki it is.

Conclusion

SharePoint’s wiki features are a bit like Rodney Dangerfield – they "don’t get no respect". Yet, while on their own they may not be best-of-breed in the wiki world, they are still quite useful. In addition, they do something no other wiki system does, they bring the rest of SharePoint, with all of its power and flexibility, along for the ride.

If you are considering deploying a wiki in your company, and you are already using SharePoint, look beyond what a wiki purist might see as perfection, and consider your actual needs. You will probably find that SharePoint’s wiki will fulfill them.

SharePoint Designer and Expression Web – Separated at Birth

As part of Microsoft’s making SharePoint Designer available as a free download, they also announced a rough roadmap for its future, as well as that of another tool, Expression Web. You might wonder why Expression Web was designated a successor (from a licensing standpoint), when it doesn’t have any ability to modify SharePoint sites.

To help you understand, I’m going to give you a little bit of history of these two tools, in the form of a "bedtime story." Then I’ll talk about some of their similarities and differences, as well some of what I see as the ramifications of this change.

Once Upon a Time…

Once upon a time, when the Web was new, and the Internet was still wet behind the ears, there was born a little web design tool called FrontPage. FrontPage was blessed with many talents, from page editing, to web site management.

Yet in its youth, FrontPage also had many bad habits. It liked to do certain things its own way, and tended to enforce its will on unsuspecting developers. Often, the result was broken script. The developers did not find this habit endearing, and shunned FrontPage.

As FrontPage grew up, it matured and learned many new skills. It made friends with a new product called SharePoint. It also gradually put away its childhood arrogance, and learned the value of industry standards. Yet try as it might, its youthful indiscretions continued to haunt it, and it could not earn the respect of the community at large.

One fateful evening, FrontPage found itself at a crossroads, and was torn. One way led to greater integration with SharePoint, while the other promised great adventures with the industry standards. "Perhaps," it thought, "Perhaps I am trying too hard to be all things to all people." Yet it liked both its association with SharePoint, as well as its new-found friendship with the Standards. It gazed into the heavens and made a wish upon a falling star.

"I wish people could forget about my past, and see me as the wonderful tool I have become, both for designing SharePoint sites and expressing web standards!"

Then FrontPage fell into a deep, sound, sleep. Sometime during the night, a strange and wondrous thing had happened. When morning came, FrontPage had disappeared, and in its place were two new children – SharePoint Designer, and Expression Web. At first glance, while neither looked quite like FrontPage, they were still hard to tell apart. Both had stylish modern clothes, and found an understanding of CSS and ASP.NET came as naturally as breathing.

Yet there were differences. When SharePoint Designer wanted to talk about SharePoint, Expression Web just threw up its hands and wouldn’t hear a word of it. On the other hand, when Expression Web tried to strike up a conversation about the joys of PHP, SharePoint Designer could only tilt its head and say "Huh?"

SharePoint Designer also found it easier to remember its old life as FrontPage. Expression Web was resistant, and needed some prodding to deal with that part of its past.

And so each began a separate journey, taking their respective paths from the crossroads.

That was Then, This is Now

OK, so now you know that SharePoint Designer and Expression Web are both descendents of Microsoft FrontPage. In many ways, they are very similar. How similar? Here are both of them side-by-side:

 
They share all of the same core page editing features. The same CSS handling, ASP.NET support, IntelliSense code completion, etc.. They both also share the ability to work with local XML and external databases on non-SharePoint sites. So, where are they different?

First and foremost, a key differentiator is SharePoint support. As implied in the fable, SharePoint Designer is fully aware of SharePoint and most of its features. Expression Web, on the other hand, will not even open a site based on SharePoint, whether you are using SharePoint features or not. If you attempt to do so, it responds with this alert:

Second, SharePoint Designer has more (and more obvious) support for "legacy" FrontPage functionality. In some ways, this follows from the previous point, as SharePoint is derived (at least conceptually) from the FrontPage Server Extensions. Expression Web suppresses any direct access to extensions based functionality. For example, the Insert menu in SharePoint Designer offers an option to insert a "Web Component", which is not present in Expression Web. The choices offered in the resulting dialog are mostly FrontPage pieces.

If you open a site which already contains FrontPage functionality, such as Shared Borders or Navigation/Link bars, SharePoint Designer lets you easily select editing options through the context menu, while Expression Web does not.

The first image above is from SharePoint Designer. Note the Shared Border and Link Bar properties options. See how they do not appear in the second image, which is the same page opened in Expression Web.

So it seems that Expression Web is just a subset of SharePoint Designer’s functionality. But is that the case? Doesn’t Expression Web have something to call its own?

It turns out that it does. Because Expression Web was intended to help you create sophisticated, standards-based web sites, it includes some templates for you to start with that SharePoint Designer does not. In version 1 of Expression Web, that was about it.

With Version 2, which has been out for a few months now, Expression Web added direct support for PHP.

Also notice the Media option. Expression Web now also supports the direct insertion and manipulation of Flash, Silverlight, and other media files. SharePoint Designer’s support for media is not as well integrated, and it doesn’t support PHP at all.

One other big difference between SharePoint Designer and Expression Web is in their online help systems. Not so much the system itself, but the content. SharePoint Designer provides a great deal of help on topics related to manipulating SharePoint Sites, and features such as Workflow and layouts pages, but almost nothing about how to use the basic editing features of the product. Expression Web’s help, on the other hand, includes all of the basic features, as well as PHP.

Where Do We Go From Here?

So, SharePoint Designer and Expression Web are both descendents of FrontPage, and they have roughly equivalent, if differently focused, feature sets. SharePoint Designer is now free for the download, and Expression Web is the designated successor as far as Software Assurance licenses are concerned. You still can’t use Expression Web to manipulate SharePoint Sites, so where does that leave us? What is next?

Microsoft has released a limited roadmap of the future of these products. They have said:

1. SharePoint Designer is free, but development has not stopped. It will remain free when the next version comes out, simultaneously with the next version of SharePoint.
2. SharePoint support will be added to Expression Web. (When? v.Next?)
3. Expression Web will continue to include tight integration both with the other Expression series and with Visual Studio.
4. Visual Studio is getting a big dose of SharePoint Friendliness in the next version.
5. Expression will be "where the action is" with regard to Silverlight integration.

Granted, there isn’t a lot of detail there. But I suspect SharePoint Designer and Expression Web will continue to be very similar to each other – possibly even more so than they are now – for a long time to come.

On Babies, Bathwater, and SharePoint Designer

On April 2nd, as has been rumored for quite some time, Microsoft announced that SharePoint Designer is available as a free download. (Get it Here…)

Reaction to even the rumors of this has ranged from very positive, to downright horrified. So, what’s all the fuss about? What is SharePoint Designer, and why should you care?

Just What is SharePoint Designer Anyway?

SharePoint Designer, at its core, is a web design and editing tool. Think of it as a word processor for Web pages. It gives users a roughly "what you see is what you get" (WYSIWYG) view of their web page as they build it.

This makes it very easy to create and edit web pages. But, because web sites can be much more complicated that Word documents, there are also a lot of options that allow the user to manage different bits and pieces of the site beyond the current page. Even if SharePoint Designer did nothing else, that would make it a very powerful tool for creating and editing web sites of all kinds.

Shameless Plug: You can get a nice overview of the basic Web-design features of SharePoint Designer from the freely-downloadable chapter 1 of my book. You can also read the Introduction to the book on this site, or at EndUserSharePoint.com. (Buy the whole book here.)

But Wait! There’s More…

What makes SharePoint Designer different from virtually all other web design tools is that it is fully aware of SharePoint and its functionality – such as lists, libraries, and master pages – as well. In addition, SharePoint Designer gives you easy access to many powerful SharePoint features, such as the ability to integrate with external data sources Data View/Form Web Parts, that are not readily available in any other way.

Now How Much Would You Pay? 😉

The Price of Freedom

"The price of freedom is eternal vigilance." – Thomas Jefferson, US Founding Father.
"With Mogwai comes much responsibility." – "Grandfather", in the movie Gremlins.

When this version of SharePoint (WSS 3.0 and MOSS 2007) first came out, SharePoint Designer was released for sale for several hundred dollars. And it was well worth it! It is an extremely powerful and versatile tool. By making it available as a free download, Microsoft is bringing that power and versatility to a whole new audience.

This is certainly cause for celebration!

Yet it is that very availability which is also causing the horror mentioned at the start of this article. In untrained hands, and/or without proper safeguards, a power tool like SharePoint Designer can also cause a great deal of damage. So how do you, as a corporate IT person, manage the risks involved?

Fortunately, there are many ways to control the use of SharePoint Designer within an organization. The SharePoint Designer team at Microsoft has published a great article on the various control mechanisms available, and I also talk about them in my book. I’ll just refer you there for the "how to". However, I do want to discuss a bit of the "why" side, or in some cases, the why not to, of implementing these controls.

First the "Not".

The control options described in the Microsoft article include hard-coding changes to SharePoint site definitions to block the use of SharePoint Designer on sites based on them. I believe that such a tactic is a knee-jerk reaction, overkill, and amounts to "throwing the baby out with the bathwater".

Blocking editors at the site definition level is asking for trouble on a number of different levels. Beyond the general cautions about making changes to site definitions (which are beyond the scope of this article), you need to be aware that this change impacts all users, forever. Even if you later decide that specially trained users should be allowed to make customizations with SharePoint Designer or its successors, they won’t be able to. Just don’t do it!!

The Right Way

Many enterprises use group policy to control what applications can be installed on users’ desktops, and even what features are available. If your organization already controls software installation, this is a great first step. You can use these policies to decide just who can install and use SharePoint Designer.

On the SharePoint site itself, there are also many controls. The first line of defense here is, don’t give administrator or web designer rights to users who don’t need them. The default "member" or "contributor" roles available in SharePoint provide all of the access most users need. They allow users retrieve information through browsing and search, as well as add and edit documents or list items. Naturally, site owners will have administrative rights to their areas, and can further delegate enhanced rights to their users, but they can’t override your group policies.

So, between those two configurations, you will have nipped in the bud virtually any casual hazard that "free" access to SharePoint Designer may present. These also represent general enterprise networking "best practices".

Finally, like any powerful tool, you should make sure that users are trained in SharePoint Designer’s use before turning them loose. These users should understand not only SharePoint Designer itself, but the capabilities of SharePoint they are planning to modify. I have taken that into account in my book (which includes chapters on understanding SharePoint, as well as SharePoint Designer), and there are several other excellent resources available.

In Conclusion – The sky is not falling.

SharePoint Designer is a powerful tool, and Microsoft has just brought it to the masses by making it available as a free download. While caution on the part of IT managers is justified, there is a place for SharePoint Designer in the enterprise. Like any powerful tool, it is important to understand what SharePoint Designer is, and its true impacts on your systems. Users should be trained in its proper use before allowing it to be deployed. However, you do not need to "throw the baby out with the bathwater" by permanently blocking it from your organization.

Something Old In Something New

Using legacy FrontPage functionality in SharePoint and SharePoint Designer to create a file "drop box".

SharePoint is a great tool for information sharing. Document libraries allow your users to upload and collaborate on documents of all sorts. Sometimes, though, you don’t want to do things quite the way SharePoint does it.

Does this sound familiar?

"I want a place where users can upload a file, but I don’t want them to see what everyone else has uploaded."

Your first thought might be no problem, I’ll just set up a document library, but what about that bit about seeing what everyone else has uploaded? Now we’re getting a bit messy. Document libraries don’t have an "only their own" security option.

And what if this is supposed to be a "drop only" zone, such that they aren’t even supposed to get back at their own files? (This is a more common request than you might think). Again, very difficult with the standard SharePoint document libraries. Savvy users can figure out how to get to their files based on the address of the forms folder.

While there are many ways to get around these issues, most of them involve a lot of work customizing the target library and its forms. Fortunately, there are some old, but little known, tools in SharePoint and SharePoint Designer that can make short work of the problem.

It’s In There…

You may not realize this (unless you’ve been around a while, or read the Appendix to my book), but SharePoint is a descendent (at least conceptually) of the FrontPage Server Extensions (FPSE). Although there has been a lot of enhancement since then, many of the functions of these extensions still exist within SharePoint in a compatible way. SharePoint Designer, as a descendent of FrontPage, supports this FPSE functionality.

One of the things you may find surprising about the FPSE, is that most of its features are meant to be defined in "static" HTML pages. Specially crafted comments, called WebBots, were used to signal to the server that extra processing was to take place at either save or render time.

For this project, we’re going to make use of the FPSE form handler WebBot to let the user select a file and upload it into a hidden document library on your site.

Making it Happen

The first thing you need, of course, is a place to put the files. As stated earlier, the natural target is a document library. So, let’s create a library called DropBox.

Note: Most of these steps will take place in SharePoint Designer.

From the File menu, select New, SharePoint Content:

Select Document Library, and enter a name, such as DropBox. Click OK to create the library

Once the library is created, right-click it and choose Properties. Check the box "Hide from browsers", so that the library doesn’t appear in the Quick Launch or All Site Content lists. Set the Use version history to Major Versions. (You want versioning enabled so you don’t lose anything if users upload files that have the same name.) Since there won’t be a default document type for this library, you can also uncheck the "Use a template" option. Click OK once the settings are correct.

 

Note: There is one library setting you may wish to make in the browser, to block the library from appearing in SharePoint Search results. Under the Document Library Settings, Advanced Settings, set the Search option to "no".

Once you have created your target library, you create HTML pages to use for your upload form and confirmation page.

From the File menu, select New ->HTML. This will create an html file in the design surface.

From the Toolbox task pane, drag an Input (File) control onto your page.

This will automatically create a Form element to surround it.

Drag an Input (Submit) button into the new form as well.

I’m using the SharePoint Designer split-view of my page to show both the code and visual layout. Now we need to make a slight change to the automatically created Form element. To do this, we’ll click in the code area to place the cursor after the post statement. When you hit space, you will be presented with Intellisense options for parameters you can add to the form tag. In this case, we want to add an "enctype" parameter, and set it to "multipart/form-data", as shown below.

Without this change, the form will not be able to handle the binary file information we want to transfer. I’m also going to rename the Submit button to say "Upload" by double-clicking it and changing the Value/label field, and also place it on a new line.

This results in a form that looks like the image below in the editor:

Now that my form has all of the information I want, I’m going to tell it where to place the files. Right-click the form, and select Form Properties. In the Form Properties dialog, select "Send to (Requires FrontPage Server Extensions)". Enter "_private/dropbox.xml" into the File name field. This is not where the files go. Rather, it will be a log of all of the forms that have been submitted. If you add other fields to your form, their values would also be stored in this file.

Now, we click the "Options" button, and click the File Upload tab. Click the Browse button and select our DropBox library. Click OK to implement the changes. (Don’t worry about the other fields or tabs for right now.)

The first time you save your form, you may also get an alert telling you that files not saved in _private may be visible to others.

Save the page in the root of your site as "dropbox.htm" (you can move it later).

At this point, you can test the basic functionality of your form. Preview the page in your browser, and try uploading a file. You should see a confirmation page similar to the following:

And if you open the DropBox library in SharePoint Designer, you will see the file there as well (you may need to press the F5 key to referesh the view)

The only problem is that confirmation form – you’ve just told your user where you put the file.

Creating a Confirmation Page

You can also create a custom confirmation page for your form. Again, this starts as a simple, HTML page, so select File -> New -> HTML.

From the Insert menu, select "Web Component". This will summon a dialog box, in which you will select Advancved Controls as the component type, and Confirmation Field for the actual control:

Click Finish. You will be asked for the name of the control to use. Type Submit1 and click OK. (Submit1 is the name of the upload button in our form.)

Enter the following text after the form field:

complete!

Thank you for your submission. Click here to return to the form.

Highilight "Click here", and press <ctrl>+k. In the insert hyperlink dialog, select the dropbox.htm file. You should end up with something that looks approximately like:

Save the file as "DropConfirm.htm".

Meanwhile, back on the dropbox.htm page, right-click on the form and select Form Properties. Click the Options button, and select the Confirmation Page tab. Click Browse, and select the DropConfirm.htm page you created above.

Click OK to save the change, and also on the Properties dialog. Save the dropbox.htm page, and preview it in the browser. Upload a file, and ensure that your new confirmation page is displayed:

Using Your Dropbox

Once your form and confirmation page are working to your liking, you need to make them available to your users. The best way to do this is to use a "Page Viewer" web part. This web part allows you to display virtually any page within the context of a SharePoint web part page. We’re going to use the standard SharePoint web interface to add this part.

To add the web part, Navigate to the page where you want the form to appear, and select Edit Page from the Site Actions menu. Click the Add a Web Part link in the zone you want. From the dialog, select Page Viewer Web Part. (It will usually be in the Miscellaneous section). And click the Add button.

This will add the part to the top of the zone you selected. Click the "open the tool pane" link.

That will open the Page Viewer Web Part’s task pane:

Enter the URL path to your dropbox form in the Link field. I suggest using a "root relative" address (i.e. preceding backslash, but without the " http://server ").

In this case, I also changed the web part title, and set fixed height and width settings for the web part in order to prevent scrollbars (these numbers may vary on your site). Click OK to save your changes, and click the Exit Edit Mode link to see your final page. (You may need to check-in the page on MOSS Publishing sites.)

Summary

There you have it! A simple way to give give your users an "upload only" dropbox. You can easily change the destination location for the files, without needing to make any changes to the underlying SharePoint document libraries or their associated forms.

While this example only provided a simple form, you can enhance it with more text, or additional fields for the log file. You can, of course, format the text any way you like, or even make it a stand-alone page, copying all of the chrome from your site (not a trivial task, but possible.)

Until next time, Happy Dropping!

Introduction to “Professional SharePoint Designer 2007”

Note: This article is also posted on EndUserSharePoint.com

Hi Everyone! One of the things everyone likes to do while they’re browsing for books in the store is read the covers and the introductions. While the listings for my book on the various sites include the back-cover description, and Wrox has posted the Table of Contents and Chapter 1 as PDF, the introduction hasn’t been posted anywhere. I thought you might like to read it, so here it is – an Introduction excerpt from Professional Microsoft Office SharePoint Designer 2007…

 

INTRODUCTION

"Can you make it look less like SharePoint?"

Such a simple question, and yet, like someone opening the lid to Pandora’s Box, the customer asking it can release a whole range of troubles into the life of a web designer. The latest release of Microsoft SharePoint products has taken the world by storm. Faster than anyone could have foreseen, businesses large and small have discovered that SharePoint addresses a range of needs, and have rushed to jump on the bandwagon.

SharePoint is not merely a web server. It is a large and complex application, with many moving parts. Some of them are easy to customize; others require a bit more finesse. Tools and guidance for that customization are few and far between. Fortunately for you, SharePoint Designer is such a tool, and this book provides the guidance. Together, they enable you to look your customer in the eye and answer with a resounding: "Yes!"

Yet SharePoint Designer can do far more than customize SharePoint sites. It is a fully-featured web design tool in its own right, with excellent support for many industry standards, as well as backward compatibility with a few nonstandard capabilities.

Who This Book Is For

This book is for anyone who has been asked the opening question. You may be an experienced web designer or a web application developer who has never used SharePoint. You may be a system administrator who needs to tweak a few things to match an existing standard. Perhaps you are a business analyst looking for ways to integrate some CRM information into the company’s home page. All of you will find something useful here.

If your familiarity with SharePoint is limited, chapters 2, 3, and 4 will be indispensable for you. They cover the key features of SharePoint, and how they are viewed from the user’s, administrator’s, and web designer’s perspectives, respectively.

This book is also for people upgrading from Microsoft FrontPage. SharePoint Designer is one of two direct successors to FrontPage. As a result, FrontPage users will find much that is familiar, as well as many things that have changed. In general, you will find that while you can edit existing sites that use legacy features, SharePoint Designer’s function layout encourages a much more standards-compliant way to design new sites and content.

This book assumes you have a more than passing familiarity with designing applications for the web. A basic knowledge of JavaScript is assumed, as is an understanding of HTML tags. Some allowance is made for the rise of certain technologies in recent years. A few chapters deal with CSS, XML, and XSL, and a short introduction to each is provided where appropriate.

The book also assumes a certain willingness to explore. Although all of the core functions, menus, and toolbars of SharePoint Designer are described, this is not a Bible that explains each and every menu item and dialog tick in excruciating detail. If a program feature offers several options, a representative few are described, and one may be used in an example.

The book assumes you are familiar with basic Windows operations and applications. Where functions are common in many applications, they probably are not discussed at all. (You are shown where to find the Formatting toolbar, for instance, but your familiarity with the icons and meanings of Bold, Center, and the various bulleting options is assumed.) It’s also assumed that you know how to point, click, cut, copy, and paste.

The later chapters move out of SharePoint Designer and into Visual Studio. They cover creating extensions to SharePoint, SharePoint Designer, or both. Examples are provided in both C# and Visual Basic .NET. Although the source is discussed and/or documented in the text, no attempt is made to teach the languages themselves, so proficiency in one of these languages is desirable. Many readers may consider these chapters optional, although system administrators should at least pay attention to chapter 18.

What This Book Covers

This book covers Microsoft Office SharePoint Designer 2007, with an emphasis on using it to customize web sites based on Microsoft SharePoint products and technologies. You will learn about Master Pages, Themes, and various Web Parts that enable you to create powerful applications with little or no code.

A short overview of SharePoint is provided to ensure that you are not flying blind when you customize SharePoint sites. At the other end of the scale, you are taken outside the box with chapters that teach you how to use Visual Studio and other tools to extend the capabilities available in both SharePoint and SharePoint Designer.

Aspects of SharePoint Designer beyond SharePoint customization are not ignored, however. You will find sections that cover the basic web-editing features, generic application of the CSS editor, and site administration functions provided by SharePoint Designer. Many elements, such as data views, while described in the SharePoint context, are also relevant without a SharePoint environment.

How This Book Is Structured

This book is made up of 18 chapters, in five parts. Each part brings together related tasks and content. Part I is fundamental to everything else, but the other parts do not necessarily need to be read in a particular order. They are, however, largely progressive in their complexity.

Part I, “The Basics,” provides an overview of SharePoint Designer, SharePoint technology, and their relationship to one another.

Part II, “Customizing the SharePoint Look and Feel,” shows how to use SharePoint Designer to customize various aspects of your sites.

Part III, “Applications without Programming,” shows how SharePoint Designer can create many powerful applications that in the past would have required considerable programming effort.

Part IV, “Programming on the Client Side,” demonstrates some tools provided by SharePoint and SharePoint Designer to enable even more custom interactivity.

Part V, “Beyond SharePoint Designer,” takes you far past the built-in capabilities of SharePoint Designer with extensions, add-ins, migration, and conversion tools.

Web design is an intrinsically visual process, web designers tend to be visual learners, and SharePoint Designer is a visual tool. This book takes that into account by including a relatively high proportion of screenshots. There are also step-by-step exercises where appropriate. Finally, it wouldn’t be a Wrox Professional book without sample code, and that is here in abundance. In this case, "code" is interpreted liberally to include markup, CSS, and scripting, in addition to compiled source.

What You Need to Use This Book

While you can learn much from this book simply by reading, to follow along with the exercises and step-by-step instructions, it will be helpful to have a few things. Most important, of course, is a copy of SharePoint Designer 2007. You should also have access to a SharePoint environment that you can use without adversely impacting production sites.

Certain examples make use of Web Parts that are only included with editions of Microsoft Office SharePoint Server 2007 or Microsoft Search Server 2008. The Express Edition of Search Server (MSSX) is available as a free download from Microsoft, and is a sufficient version of SharePoint to perform all of the exercises and examples in this book, except for those in chapter 8.

Chapter 8 describes Publishing layouts and content management. These are features exclusive to Microsoft Office SharePoint Server 2007. You will need access to this if you wish to follow the examples in that chapter.

To compile the example programs in Part V, you need Visual Studio 2005 or Visual Studio 2008, Standard Edition or higher. You also need to download the following add-ons from the Microsoft MSDN site:

· The Windows SharePoint Services 3.0 Software Development Kit (WSS SDK)

· The Microsoft Office SharePoint Server 2007 Software Development Kit (MOSS SDK)

· Visual Studio Tools for Office (VSTO)

· Visual Studio Extensions for Windows SharePoint Services (VSeWSS)

The SharePoint Designer add-in example in chapter 17 requires the SharePoint Designer 2007 Add-In project template from the Microsoft CodePlex site.

Most SharePoint designers and developers find it convenient to create a sandbox development environment containing all of the tools listed here (and other favorite development utilities) on a virtual machine (VM). All versions of SharePoint require Windows Server 2003 or Windows Server 2008, with at least 1GB of RAM to install successfully (2GB or more of RAM is recommended).

Related Products

SharePoint Designer is not the only Microsoft product created for manipulating web pages. It is closely related to Microsoft Expression Web, which sprang from the same FrontPage roots. In addition, Visual Studio is a useful tool for web designers of all stripes.

SharePoint Designer Compared to Expression Web

As with the mythical Hydra, who grows more than one head if the first is cut off, the end of FrontPage was the beginning several children. Like SharePoint Designer, Microsoft Expression Web is a direct descendent of Microsoft FrontPage. In fact, from a basic page-editing standpoint, SharePoint Designer and Expression Web appear virtually identical.

Scratch the surface, however, and the differences become clear. Nothing says it better than the dialog shown in Figure 1, which you get when you try to open a SharePoint-based site in Expression Web. Expression Web has no capability to work on a SharePoint site.

Figure I-1

SharePoint Designer, on the other hand, happily opens web sites created with most versions of SharePoint. In addition, SharePoint Designer offers more complete support for sites created using the FrontPage Server Extensions.

So, why use Expression Web? If you don’t need to work with SharePoint, Expression Web provides an excellent set of tools for creating standards-based web sites. It integrates with Visual Studio, supports PHP (which SharePoint Designer does not), and includes several web site templates that are not available with SharePoint Designer.

SharePoint Designer Compared to Visual Studio

The other tool you might consider for working with SharePoint is Visual Studio. In fact, there are certain things that cannot be done with SharePoint Designer. Some of these tasks are described in Part V, “Beyond SharePoint Designer.” The key is to remember that SharePoint Designer is generally used to customize SharePoint sites and manipulate existing features, whereas Visual Studio is used to develop new SharePoint functionality.

Professional Microsoft Office SharePoint Designer 2007
Woodrow W. Windischman, Bryan Phillips, Asif Rehmani
ISBN: 978-0-470-28761-3

Binary Free SharePoint Twitter Search Web Part

No Assembly (or C#, or VB) Required

Searching Twitter from SharePoint has become all the rage since I originally posted my Twitter Search Federation articles (Part 1, Part 2). Federation is great if you have Search Server, or the Infrastructure Updates. But what if you are only using WSS? Or what if you just want to drop a Twitter search into any old SharePoint page, rather than a full Results page? And more critical – what if you don’t have direct access to the SharePoint server in order to install binary web part and feature – with or without a Solution Package (WSP)?

Well, buried in Part 2 of my article was the the solution. A Data View Web Part (DVWP) that displays the results of a twitter search. In the original article, that DVWP was just an interim step on the way to Federation. For this article, a form of that web part is the actual goal. So, I’m going to start by re-using the DVWP section of the Federation article – with a tweak or two :). But then, I’ll also show you how do two very important things – connect the web part to an input form (or any other web part), and export it for use on other SharePoint sites.

Note: You can find a link to download the Twitter Search Results Web Part at the end if this article.

A Data View Refresher

The Data View Web Part is a way to display information from virtually any source within SharePoint. Data Views are created in SharePoint Designer, in association with another feature called the Data Source Library. This is not to be confused with the "Business Data Catalog", or BDC. While both the Data Source Library and the BDC deal with presenting data from external sources within SharePoint, the BDC is a part of MOSS Enterprise, and allows a much deeper integration of the data with various aspects of SharePoint. The Data Source Library, on the other hand, is available in all editions of SharePoint – from WSS on up – and is primarily used to generate Data View/Data Form Web Parts.

Data Views and the Data Source Library are a very powerful combination – so much so that almost two whole chapters of my book are devoted to them. Obviously, I can’t go into that kind of detail here, but while this particular example is fairly simple, it covers a lot of ground.

The link between Federation and Data Views is pretty close. In fact, prior to Search Server or the Infrastructure Updates, you could use a Data View to achieve very similar results. We’re going to take advantage of this by building the look we want in a Data View, then transferring it into the Federated Location definition.

Creating a Data View

Before we can create a Data View, we need create a new item in the Data Source Library for our Atom feed.

To do this, Select "Manage Data Sources…" from the Data View menu in SharePoint Designer to summon the Data Source Library task pane. Atom and RSS feeds fall into the category of "Server-side Scripts" that return XML, so expand the Server-side Scripts section and click "Connect to a script or RSS Feed." You will see the dialog below. Fill in the URL with the same Twitter Atom query we have been using: http://search.twitter.com/search.atom?q=sharepoint (See Part 1 of the original article for details on how this was derived.)

The query parameter (q) will automatically be passed into the list as soon as you change the focus from the URL field. "SharePoint" will become the default parameter value, and give us something to see as we customize the look. If you are following along, you can replace "SharePoint" with any default query term that might be appropriate to your environment. Make sure the Runtime Parameter box is checked, otherwise you can’t change the query later.

Now that we have the Data Source, we need a place to put it. This can be any web part page. While you can use the results page if you feel so inclined, because we aren’t going to be using the Data View directly, it doesn’t need to be.

Once you have a web part page open, select a Web Part Zone, and then pick "Insert Data View…" from the Data View menu. The Data Source you created above will have a drop-down menu associated with it. Select "Show Data".

You will see the Data Source Details task pane, with the structure of the Twitter Atom feed displayed.

I’ve maximized my task pane for this screen shot in order to show you how the SharePoint Designer data source displays the entire structure of the feed. Notice the folders and item scrolls for the various elements. The Twitter Atom feed is a "hierarchical" data source. This means that the data has nested, potentially (and in this case, actually) repeating, elements, which in turn may have their own nested elements.

For now, the primary entity we are interested in is the "Entry" folder. Look at the screen shot to the right. Highlight the elements in the "Entry" folder as shown, and select "Multiple Item View" from the "Insert Selected Fields as…" menu. (Yes, I know. It looks like a button, but trust me – it’s a menu!)

A table will be inserted into the web part. That’s got most of the information we want, but it isn’t terribly pretty. So, let’s fix it up!

The first column contains the "href" entity. Ironically, even though there is a separate entity for the Author, one of the two links listed for each user is the Author’s avatar. The other is a link to the Twitter URL of the tweet itself. For our results, we really only want the avatar, so we’re going to do two things – Change the display to show the image instead of the URL, and hide the other URL.

To change to an image view, click one of the URLs in the href column. To the right will be a little box with a chevron in it:

When you click it, you will have choices to modify the current field. Select Picture.

You will get a warning that URLs and Pictures can be dangerous. We know that, so click Yes.

The changes you make here will affect all of the items of that series. (You probably noticed that they were all highlighted in a different color when you clicked on any one of them.)

Once you have done that, to suppress the other image (which will show as a "broken" picture), Right-click the broken link and select "Conditional Formatting". In the Conditional Formatting task pane, select "Show Content" from the "Create" menu (another one of those "buttony" menus). In the Condition Criteria box, set the conditions like this:

The broken link will go away.

Next, we want to merge the rest of the cells in the row. This is just like any other table action – highlight the data cells (not the labels) for content, updated, name, and uri. Right-click, and select "Modify/Merge Cells". Now we’re cooking! Just a couple more tweaks, and it will be there.

Select the tweet content text, and change its format to Rich Text (just like changing the image format above).

Select the date, and format it to your regional liking.

Notice that we have a link to the Author, the Author’s name, and the Author’s avatar. Wouldn’t it be great to have the name and the avatar actually link to the Author’s page? Well, we can. If you click the chevron by the link, you will see that the field being displayed is called "ddw1:author/ddw1:uri". For the text, change the format to Hyperlink, you will see the following dialog. You can use the "fx" icons to select the fields you wish to use in the hyperlink, or enter the values manually. In either case, you want the "Text to display" and "Address" fields to be set as shown:

Setting the link on the picture is easy, too. Just right-click the image, and select "Hyperlink" from the context menu. Set the address to the same token as you used above. Now you can delete the field that shows the text of the author link.

You should now have a web part that looks a lot more like what you would expect from a Twitter search:

Pretty good, but I’m still not satisfied. 🙂

Notice the chevron icon in the upper-right corner of the web part.

If you click it, you will summon the "Common Data View Tasks" menu:

Click Data View Properties. You will get this dialog:

Click "Show view header" and "Show view footer", then click the "Paging" tab.

Click "Limit the total number of items displayed to:" and enter a reasonable number for a search results page. (I picked 5). Click OK.

Display the Data Source Details task pane, and drag the first title field available into the newly created header. Click in the footer, and delete the Item Count. In the "link" group (above the "title" field you just used), make sure item 1 (rel = "alternate") is selected. Highlight the "href" and select "Item(s)" from the Insert Selected Field menu. Change its format to a Hyperlink. Leave the Address as-is, but change the Text to Display to "More Results…"

I’m going to delete the field name row, rearrange the fields slightly, and also apply the style "ms-searchChannelTitle" to the Header cell. This results in a part that looks like this:

Now I’ll make one more change to this web part to allow it to respond to a URL query string. From the Common Data View Tasks menu, select Parameters. You should see this dialog, displaying the "q" parameter that got created when we built the Data Source:

From the Parameter Source menu, select Query String. This will add a field for you to enter the name of the URL parameter you will be passing. The standard for SharePoint Search keyword parameters is "k", so I suggest using this (without the quotes, of course). This allows you to use this web part on a standard SharePoint results page and have it respond appropriately. But you can also then use the k parameter in the query string of any SharePoint page you drop the part on!

Your Twitter Search Results web part is done! You can save the page and close SharePoint Designer.

The Twitter Search Results Web Part in Action!

When you display the page on which you created the Twitter Search Results web part, you will see the default result set:

To show that the URL Query string works, append a "?k=twitter" to the URL (again, no quotes), and hit the Enter key. The results will change to Tweets containing the word Twitter:

Notice also how the search form recognized the "k" parameter, and set it as the default keyword for an internal Sharepoint search…

Now that we know the part is working, delete the k parameter from the address bar and hit Enter to return to the default page. We need to do this because the query string parameter will override the web part connection we’re going to be making. (You might want to keep that in mind, as there may be times you find that behavior useful in your own data views…)

Let’s insert a "form" web part on the page. From Site Actions, select Edit Page. In one of your Web Part zones, click the Add a Web Part link, and select Form Web Part from the Miscellaneous section, and click the Add button:

By default, this form will have a text box, and a "Go" button, and will be called "Form Web Part". On your site, you will probably want to set the web part properties to give it a different label, such as "Twitter Search". For purposes of this article, I’m going move directly on to setting up the connection.

From the edit menu on the part you just inserted, select Connections.

From the fly-out submenu, select Provide Form Values To, and select the Twitter Results web part. You will get this dialog:

Select Get Parameters From, and click the "Configure" button. The dialog will then ask for the Consumer Field Name. Select "q" (the parameter name), and click the "Finish" button.

You can then also exit Edit mode on your page.

Now just enter a term into your form, and click "Go". You will get Twitter Search results for the term you selected!

You don’t need to use a form for the web part connection. You can connect to almost any web part in SharePoint to get query parameters. For example, you could connect to a client list and use the company name as the search term. You could then just click on each client’s record to see their Twitter buzz.

Exporting and Importing the Twitter Results Web Part

Important: Remove the web part connection created in the previous exercise before exporting! 

One of the great things about the Data Views you create in SharePoint Designer is that you can easily export them for use on virtually any SharePoint site that has access to the data used to define it. To do this, Use the little arrow in the top right corner to summon the web part menu, and select Export:

A standard download box will appear, allowing you to save the file to your local machine. In our case, the part will be called Twitter_Results.webpart. ".webpart" is one of two extensions you might see when exporting SharePoint web parts. (The other is ".DWP")

So, what do you do with the file once you have it? You import it back into SharePoint!. As mentioned earlier, it doesn’t need to go on the same site – or in this case, even the same server! As long as the server you are installing the part on has access to Twitter, you can use this part.

There are two ways to import the part:

1. Directly importing onto a page
2. Adding it to the Web Part Gallery

To import it onto a page, start the same way as always: From Site Actions, pick Edit Page. Then click Add a Web Part over a Web Part zone. However, this time, you need to click the link on the bottom of the window: "Advanced Web Part gallery and options"

This will close the dialog and open the Add Web Parts task pane. At the top of the task pane is a menu. Select Import from the menu:

This changes the task pane to Import mode. From here, you can either type the path to the .webpart file, or use the standard Windows file dialog to browse for it:

Click Upload, and the part will appear on a list below the form. You can then drag it into the Web Part zone of your choice.

The down side of this method, is that you have to re-import the web part for every page on which you want it to appear. Fortunately, you can make it available to any page in your site by adding it to the Web Parts Gallery.

To access the Web Parts gallery: From the Site Actions menu, select Site Settings. On the Site Settings page, you will see the list of Galleries. Click the "Web Parts" link.

Essentially the Web Parts gallery works just like any other document library in SharePoint:

To add the web part, click Upload, and browse to the web part file. After you upload it, you can enter a full description, and determine the context(s) in which the part will be selectable.

Click OK to complete the Save process. From then on, your Twitter Results web part will be available from the standard Add Web Parts dialog box:

Of course, these techniques apply to almost any Data View or Content Editor Web Parts you create, not just this Twitter Search.

You can Download this part here!

http://cid-773832677f575173.skydrive.live.com/embedrowdetail.aspx/.Public/Twitter|_Results.webpart

Back on Point

The Sanity Point is Back on the Air!

The downturn in the economy is affecting everyone, myself included. For the time being, I cannot justify the expense of maintaining a dedicated server, so I have been migrating my content onto some less costly hosting. I made sure my RSS feed on Feedburner was still up and contained live content. Unfortunately my actual web site domain has been down for a few weeks.

I humbly apologize for the inconvenience.

I am pleased to announce, however, that The Sanity Point is now back on the air!

I am now using Microsoft Office Live for my primary web address of TheSanityPoint.com. This offers some interesting options, as there is some SharePoint behind the scenes. It is not, however, a standard SharePoint system, so (for example) I don’t have SharePoint blog functionality available. Instead, an Office Live site hooks into Live Spaces to pull blog entries for display. This means you may find yourself on my http://woodywindy.spaces.live.com site for some operations (like leaving comments).

While I miss the flexibility that having my own server provided, the fact is, "content is king", and I look forward to getting back into the swing of providing the kind of helpful posts you have come to know and love!

Until next time…

– Woody –