How to add the “Contact Us” gadget to your Office 365 Publishing Site

This follows on from my previous post which describes how to enable the Publishing Features for your Office 365 website and resolving issues with Custom Master Pages in Office 365.

Having done that on my own site (www.hatchsolutions.co.uk) I found that one of the key “Gadgets” was missing .. the Contact Us form.

This was an immediate conundrum.. Sandbox Solutions do not allow email access so I knew I couldn’t use that as an out, so I thought I would hunt down that Gadget.

STEP 1 – Add Office 365 namespaces to your Custom Master Page
This is a pre-requisite, as you will be using some of the “Office 365” web controls. I found these in the header of the “oob” root.master which you will find in the All Files section of your public website in SharePoint Designer.

Add these to the top of your Custom Master Page.

<%@ Import namespace=”Microsoft.SharePoint.Spx.WebSite.Controls” %>
<%@ Import namespace=”Microsoft.SharePoint.Spx.WebsiteCore” %>
<%@ Import namespace=”Microsoft.SharePoint.Spx.WebsiteCore.Controls” %>

(note the special Microsoft.SharePoint.Spx namespace!)

STEP 2 – Create Custom Page Layout with Contact Us Control Embedded
This was the way I chose to do it .. you don’t have to do the same (although I couldn’t work out an easier way of doing this myself).

I created a new custom Page Layout (based from one of the others). I deliberately removed any references to any custom code-behind or code-blocks.

This means that I will be running OOB code, and won’t be consuming any Sandbox Resource points!

Then add the following ASP.Net snippet into your page:

<iws:ContactUsControl runat=”server” EmailTo=”info@hatchsolutions.co.uk” CultureName=”en-US” SendToBCM=”on” xmlns:iws=”iws” />

This is the same ASP.Net tags that get used when you drop the gadget onto your page.
You can see in my example I have added my own EmailTo and CultureName attributes .. you can set these to whatever is appropriate.

The other thing to note is that you must place this control in an EditModePanel with PageDisplayMode=”Display”. The Contact Us form otherwise tries to validate the page when you try and Save Changes or Publish (not good!)

And that is it .. simply save your changes, publish your page layout and create your own page! 🙂
I have created my own custom page layout here;
https://www.hatchsolutions.co.uk/Pages/ContactUs.aspx

Please let me know how you get on with yours!

  • Anonymous

    Can you tell us "where" to put <iws:ContactUsControl in page layout? I am new in coding in page layout. Any link or reference is appreciated.

  • Martin Hatch

    Yeh good point .. at first I had designs on doing this as a web part but that fell through which I think is why I went the master page approach

  • Anonymous

    Is there any need to update master page? can't the following code be embedded in page layout?
    <%@ Import namespace="Microsoft.SharePoint.Spx.WebSite.Controls" %>
    <%@ Import namespace="Microsoft.SharePoint.Spx.WebsiteCore" %>
    <%@ Import namespace="Microsoft.SharePoint.Spx.WebsiteCore.Controls" %>

  • Anonymous

    Thanks, good stuff, works like a charm!

  • Martin Hatch

    You are welcome 🙂

    The problem you would always face with the Sandbox is that you cannot access Email functionality through Sandbox Solutions so the OOB "gadget" really is the only way.

  • sh

    Thank you so much for posting this contact us gadget. i have been struggling for tis from past 4 days using custom code but it did not work for anonymous users..

    Once again thank you very much