Building A Great Contact Page

  

  1. Building A Great Contact Page Templates
  2. Building A Great Contact Page Template
  3. Building A Great Contact Page Website

When the Modern pages came out almost a year ago, I have written a blog post on how to bypass them. That is because when they first came out – they were buggy, had limited set of supported web parts and could not really be used for anything useful, in my opinion. A lot has changed since then! Modern pages are now more functional, and provide support or have similar functionality as classical pages. With this post, I would like to demonstrate to you how I built a cool-looking Intranet Landing Page in SharePoint using modern page functionality! And you know what? I am never coming back to classical Wiki Page! I am so much in love with my creation!

  • Ideally, an FAQ page should act as a filter so that people don’t overload customer support with easily answerable questions. Providing a variety of contact options on the FAQ page ensures that visitors don’t get frustrated if they don’t find the answer they’re looking for.
  • Code Quest offers another well-executed contact us page, with an eye-catching design, fun graphics, and a dose of personality. Code Quest also provides a map showing their locations, which is a great idea if your business is locally oriented. Friendly, convenient, and concise, Code Quest gets it right.

Freshbooks use their contact page to drive home one of their selling points – great customer support. They don’t offer an email support form, but rather encourage customers to call and talk to.

First of all, here is my new baby!

This is what my Intranet Landing Page looked like in Classical, Wiki page experience:

Contact

Let’s go ahead and build it together! Before we proceed, I suggest that you check out this post that talks about best practices for SharePoint Page Design. Though the mechanism of creating a page has changed, the best practices still apply.

Step 1: Add a new Page

To add a new, modern page, just click on Gear Icon > Add a page

Once you do, a new, modern page will be created, and you can now customize it.

NOTE: Modern Pages are not yet supported on site collections with publishingfeatures enabled. So in case you are creating a new page and it defaults to Classical – that would be one of the reasons.

Step 2: Customize page, add Web parts

As I stated above, not all web parts or functionality is supported with the modern web pages. So at the moment, you cannot replicate all of the functionality you might have on your main landing page (i. e. ability to embed social media feeds or have a slide show or Script Editor). That said, these are the most common staples of the Intranet landing page with the corresponding functionality/web parts in the modern page experience:

Banner

What cool website can survive these days without an overused stock banner image? 🙂 SharePoint is no exception these days with the development of Modern pages and Communication Sites! Modern Page allows you to splash your screen with a huge banner/hero image.

Building A Great Contact Page Templates

Announcements

Announcements web part is not supported on the Modern Page, but a great replacement would be to use a News Web Part, that is available with the Modern experience.

And this is how a News Web Part looks like on a page.

Calendar

Calendar is supported on the modern page as well but is called Events and has a nice looking interface.

And this is how it renders once added to a page and populated with some events.

By the way, individual event editing is totally cool as well and not like anything we had with the classical calendar. You can also add a stock image/banner to each event as well. Here is a screenshot.

Video

In case you want to embed a video on your landing page, you can use Embed Web Part which allows you to embed YouTube and any other sites you wish.

By the way, there are dedicated web parts to embed videos from Office 365 as well. So if you are hosting videos on Office 365 Video Portal or Microsft Stream, use those.

Map

Building

In case you want to highlight Company address or locations, you can utilize Bing Map Web Part.

Building A Great Contact Page Template

Employee of the Month

In case you want to highlight particular people (i.e. Employee of the Month), you can use People Web Part. Clicking n a person brings up a summary people card and then you can drill down all the way to User’s Delve profile. Neat!

Links

Building A Great Contact Page Website

In case you want to highlight link(s), you can use either Link Web Part or Quick Links Web Part.

Additional web parts for your consideration

You might want to embed a PowerBI Report Web Part to show off the company’s’ recent sales or Image Gallery Web Part with photos of drunk employees from the latest BBQ party. As new web parts are added to Modern Page Experience, I am sure there will be some additional ones we can utilize for the main landing page.

Step 3: Make new page the homepage

By default, the Out of the Box classic page located in SitePages Document Library (SitePages/Home.aspx) is the homepage. We need to make our new modern page the Homepage (meaning that when users click on Home they are routed to the modern page experience). To do this:

  1. Make sure your Modern Page is Saved and Published (unpublished pages cannot be made Homepages)
  2. Navigate to SitePages Document Library (Gear Icon > Site Contents)
  3. The Site Pages library houses all the pages you created on your site. Click the ellipsis next to your modern page and choose Make Homepage. Mazel Tov! Your new page now is THE homepage!

So the final product looks like this below. As I built this, I could not help myself but remind that this is still SharePoint! How can you not love SharePoint?