|  Login
 HelloWorld3 - Live Sample
 Silverlight 3 Hello World [Start Here]

You have to begin somewhere. The goal of this tutorial is to walk you through creating a simple Silverlight module in DotNetNuke that authenticates the currently logged in user through a web service.

What you need for this tutorial

Setting things up

You will first need to set up a DotNetNuke development environment. You will want to use this environment to develop your DotNetNuke Silverlight modules. You can later create a module package for installation in another DotNetNuke production web site.

Follow the appropriate link to set up your DotNetNuke development environment:

Note: If you are using IIS you also need to add the MIME Type to your web server.

Create The Application

Use Visual Studio to open the DotNetNuke site (File then Open Web Site...)

In the Solution Explorer, right-click on the DesktopModules folder and create a new folder named HelloWorld3

Right-click on the HelloWorld3 folder and select Add New Item...

Create a Web User Control control named View.ascx. Make sure the box "Place code in a separate file" is checked.

Open the View.ascx page in Source view and replace all the code with the following code:

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="View.ascx.cs" Inherits="HelloWorld3.View" %>
<script type="text/javascript">
function onSilverlightError(sender, args) {
var appSource = "";
if (sender != null && sender != 0) {
appSource = sender.getHost().Source;

var errorType = args.ErrorType;
var iErrorCode = args.ErrorCode;

if (errorType == "ImageError" || errorType == "MediaError") {

var errMsg = "Unhandled Error in Silverlight Application " + appSource + "\n";

errMsg += "Code: " + iErrorCode + " \n";
errMsg += "Category: " + errorType + " \n";
errMsg += "Message: " + args.ErrorMessage + " \n";

if (errorType == "ParserError") {
errMsg += "File: " + args.xamlFile + " \n";
errMsg += "Line: " + args.lineNumber + " \n";
errMsg += "Position: " + args.charPosition + " \n";
else if (errorType == "RuntimeError") {
if (args.lineNumber != 0) {
errMsg += "Line: " + args.lineNumber + " \n";
errMsg += "Position: " + args.charPosition + " \n";
errMsg += "MethodName: " + args.methodName + " \n";

throw new Error(errMsg);
<asp:Panel ID="silverlightControlHost" align="center" runat="server"
<object data="data:application/x-silverlight-2," type="application/x-silverlight-2"
style="height: 50px; width: 500px">
<param name="source" value="<%=SilverlightApplication %>" />
<param name="onError" value="onSilverlightError" />
<param name="background" value="Transparent" />
<param name="windowless" value="true" />
<param name="minRuntimeVersion" value="3.0.40624.0" />
<param name="autoUpgrade" value="true" />
<param name="InitParams" value="<%=SilverlightInitParams %>" />
<a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=3.0.40624.0" style="text-decoration: none">
<img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight"
style="border-style: none" />
<iframe id="_sl_historyFrame" style="visibility: hidden; height: 0px; width: 0px;
border: 0px"></

Open the


file in source mode and replace all the code with the following code:

using System;
using DotNetNuke.Entities.Modules;

namespace HelloWorld3
    public partial class View : PortalModuleBase
        public string SilverlightApplication { get; set; }
        public string SilverlightInitParams { get; set; }

        protected void Page_Load(object sender, EventArgs e)
            // Register Silverlight.js file
            Page.ClientScript.RegisterClientScriptInclude(this.GetType(), "SilverlightJS",
                (this.TemplateSourceDirectory + "/Silverlight.js"));

            // Set the Web Service URL
            string strWebServiceURL = String.Format(@"http://{0}{1}/{2}", 

            // Set the path to the .xap file
            SilverlightApplication = String.Format("{0}{1}", TemplateSourceDirectory,

            // Pass the Initialization Parameters to the Silverlight Control
            SilverlightInitParams = string.Format("WebServiceURL={0}", strWebServiceURL);

Save the page.

Download this file: Silverlight.js and save it to your local hard drive, and place it in the DesktopModules/HelloWorld3 directory:

Right-click on the HelloWorld3 folder and select Add New Item...

Add a Web Service called Webservice.asmx. Make sure the box "Place code in a separate file" is un-checked.

Open the Webservice.asmx file in source view and replace all of the code with the following code:

<%@ WebService Language="C#" Class="HelloWorld3.WebService" %>

using System.Web.Services;
using DotNetNuke.Entities.Users;

namespace HelloWorld3
[WebService(Namespace = "http://ADefWebserver.com/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
public class WebService : System.Web.Services.WebService
#region GetUsername()
public string GetUsername()
string strUsername = "World!";

// Get the current user
UserInfo objUserInfo = UserController.GetCurrentUserInfo();

// If the user is not -1 they are logged in
if (objUserInfo.UserID > -1)
strUsername = objUserInfo.DisplayName;

return strUsername;

Create the Silverlight Application

From the Menu, select File, then Add, then New Project...

Create a Silverlight Application named "HelloWorld3"

In the Add Silverlight Application box, add the project to the existing web site.

The project will be added to the Solution Explorer

Right-click on the References folder (in the Silverlight project) and select Add Service Reference...

Click the Discover button to locate the web service you created in the earlier step.

Enter HelloWorld for the namespace

Click the OK button

Open the App.xaml.cs file and change the Application_Startup method to the code below:

        private void Application_Startup(object sender, StartupEventArgs e)
            this.RootVisual = new Page(e.InitParams["WebServiceURL"]); 

Open the Page.xaml file and replace all the code with the code below: 

<UserControl x:Class="HelloWorld3.Page"
d:DesignHeight="50" d:DesignWidth="400">
<Canvas x:Name="LayoutRoot">
<TextBlock Canvas.Left="8" Canvas.Top="8" FontSize="26.667" Text="Hello:" TextWrapping="Wrap"/>
<TextBlock Canvas.Left="91" Canvas.Top="8" FontSize="26.667" x:Name="UserName" TextWrapping="Wrap"/>

Open the


file and replace all the code with the code below: 

using System;
using System.Windows.Controls;
using HelloWorld3.HelloWorld;
using System.ServiceModel;

namespace HelloWorld3
public partial class Page : UserControl
private string WebServiceURL;

public Page(string parmWebServiceURL)

// Set the web service URL global values
WebServiceURL = parmWebServiceURL;


#region CallWebService
private void CallWebService()
WebServiceSoapClient objWebServiceSoapClient = new WebServiceSoapClient();
EndpointAddress MyEndpointAddress = new EndpointAddress(WebServiceURL);
objWebServiceSoapClient.Endpoint.Address = MyEndpointAddress;
objWebServiceSoapClient.GetUsernameCompleted +=
new EventHandler<GetUsernameCompletedEventArgs>(objWebServiceSoapClient_GetUsernameCompleted);

void objWebServiceSoapClient_GetUsernameCompleted(object sender, GetUsernameCompletedEventArgs e)
UserName.Text = e.Result;

Right-click on the Silverlight project in the Solution Explorer and select Build

The HelloWorld3.xap file will build into a directory in the DotNetNuke website called ClientBin

In the Solution Explorer, drag the ClicntBin folder so that it is under the DesktopModules/HelloWorld3 directory

Configure the Module

In your web browser, log into your DotNetNuke website as the host account. From the Host menu, select Module Definitions

At the bottom of the Module Definitions page, select Create New Module

Enter HelloWorld3 for the Name and Friendly Name and set 01 00 00 for the Version and click the Next button

On the Module Specific Details page click Next

On the Owner Details page click Next

The module will show up on the Module Definitions page. Click the pencil icon next to the HelloWorld3 entry to edit it

Click the Add Definition button

Enter HelloWorld3 for the Friendly Name and click the Create Definition button

Click the Add Module Control button

Enter "Hello World" for the Title, select DesktopModules/HelloWorld3/View.ascx for the Source and click Update

Navigate to a page in your DotNetNuke website and place the HelloWorld3 module on the page

The module will display.


Note: in IIS you will also need to set the MIME Type:

Setting .xap MIME Type for Silverlight

Download the module and source code here:


(only works with DNN5 or higher)