A lot of Ventrian’s users missed the old look of the lightbox button where it used to be images and not the ugly text links like this:

The reason of the above ugliness is a result of localization enhancement. Well, compare to the lightbox used in other platforms like wordpress and joomla, majority of the people are adapted to the image version and the look above certainly will give a bad impression to your visitors….”it is site still under construction or something???”

The fix is actually simple.

All you need to do is to change the language resource file. For you convenience, I’ve packed the buttons and the resx file. All you need to do download the file from the link below, unzip it and put the file accordingly:

Upload the 3 images to
/DesktopModules/PropertyAgent/Images/Lightbox/
and replace the “ViewProperty.ascx.resx” in
/DesktopModules/PropertyAgent/App_LocalResources

http://www.mylifebbs.com/FreeDownload/dnn/Property-Agent-Image-Buttons-UNZIP-ME.zip

Note: If you have previously localized your property agent from DNN, be warned that directly replace the file from FTP will override your other previous changes. You may open the new .resx file using a notepad, scroll to bottom to look for the changes and copy it to the DNN Language editor.

Have fun!

Frankly speaking, there are not much great designers specialized in DNN Skinning due to its complexity. The root of the cause is due to the different system structure where I believe it is more programmer friendly than designer.

To skip all the explanations and go for the download, please scroll till the end of this post.

The DNN login page is the most forgotten part in all DNN users and even some professional DNN portals like PokerDiy.com and neoteo.com. There are few modules that allow you to have a simplified login or pop up login like digg.com but you need to pay or it and it is not cheap and easy to change the design.

In order to make changes to your DNN Login page, you have to understand the components in the login module. The DNN Login module consists of 4 parts which is the DNN Membership Authentication System, The Authentication Provider, The Login Module itself and the Language Resources Files (.resx).

The linkage of these components are as below:
Login Module loads Authentication Provider(s) into it and the provider as a gateway to the DNN Membership Authentication System. For example, if a user using LiveID to login your DNN Portal, the LiveID Authentication Provider redirect the user to MSN LiveID Gateway and then pass the credential back to your DNN Portal and match it with the DNN Membership Authentication System.

However, DNN Membership Authentication System also consist of Member Registration, Password Reminder and Forgot Password Question which makes the designing work on Login Works kinda tricky, not even need to mention the words that are loaded from the language resource files.

Ok, lets start changing those ugly interface! First we need to locate all the files that need to be changed. You will need to have FTP access to your DNN installation root.

Step 1: Changing the Login Module Container
The Login Module is basically the Admin’s Container by default where there is actually no login page but a “DNN Control” (Home/ctl/Login.aspx) unless you create a page and specified it in Admin > Site Setting > Advance Setting > Login Page.

Step 2: Locating Files that need to be changed
Now we need to locate the Login Authentication Providers at
/DesktopModules/AuthenticationServices/
There will be 3 default providers which is DNN, LiveID and OpenID. You will find Login.aspx and Login.ascx.resx (under App_LocalResources) inside it and that are the files you are going to change it.

For the DNN authentication files, you can get them at:
/admin/Users/user.aspx and /admin/Authentication/login.aspx
Make sure you didn’t mixed up with login.aspx in providers.

Step 3: Changing the Text and Words
You can either change it using DNN Language editor which is located in Admin > Language in control panel are directly look for the files in FTP. I actually prefer the later method as it is more easier to read and modify using Visual Web Developer.

“Register” “Forgot and Password” at
/httpdocs/admin/Authentication/App_LocalResources/Login.ascx.resx

*If you have more than one portal, the file name will be “Login.ascx.Portal-0”

   1: <data name="Remember.Text" xml:space="preserve">

   2:     <value>Remember Login</value>

   3: </data>

   4: <data name="cmdForgotPassword.Text" xml:space="preserve">

   5:    <value>Forgot Password ?</value>

   6: </data>

   7: <data name="cmdRegister.Text" xml:space="preserve">

   8:     <value>Register</value>

   9: </data>

All you need to to change the text inside between the “value” attribute. I’d not recommend you to put html/css into it as it will increase the load time and may messing up xhtml coding standard…

Step 4: Changing the files.

First, we need to deal with the Login Tabs which is using the DNNTabStrip webcontrol. You can find this file at:

/httpdocs/admin/Authentication/Login.ascx

Inside the file, look for:

   1: <DNN:DNNTabStrip

   2: ID="tsLogin"

   3: runat="server"

   4: TabRenderMode="All"

   5: CssTabContainer="LoginTabGroup"

   6: CssContentContainer="LoginContainerGroup"

   7: DefaultContainerCssClass="LoginContainer"

   8: DefaultLabel-CssClass="LoginTab"

   9: DefaultLabel-CssClassHover="LoginTabHover"

  10: DefaultLabel-CssClassSelected="LoginTabSelected"

  11: visible="false" />

The Css Classes are located at /Portals/_default/default.css by default. You can either change the css file, override it in skin.css / portal.css or redefine the classes in login.ascx

If you look at the pokerDIY login tabs, you will see that the tabs have been pushed into 2 lines which makes the layout very messy. You can simply widen it by changing the “width=160” to a larger number in the following lines and you will have the problem solved.

   1: <asp:panel id="pnlLogin" runat="server" Visible="false">

   2:     <table cellspacing="0" cellpadding="3" border="0" summary="SignIn Design Table" width="160">

Ok, now you have change the “Register” and “Forgot Password?” text but what about the design? For these, you need to look for “cssclass=”CommandButton” in the following lines located inside the same login.ascx.

   1: <asp:Linkbutton id="cmdRegister" resourcekey="cmdRegister" cssclass="CommandButton" text="Register" runat="server"/>

   2: <asp:Linkbutton id="cmdPassword" resourcekey="cmdForgotPassword" cssclass="CommandButton" text="Forgot Password?" runat="server" />

We’ll leave the other parts of codes inside the file and CSS coding for a moment. Now we proceed to change another login.ascx which is located in:

/DesktopModules/AuthenticationServices/DNN.ascx

There are few basic things you need to change to make your login looks beautiful which are: The width, Label text/icon, login button, input box and the text inside it. You can find them in these lines:

   1: <dnn:label id="plUsername" controlname="txtUsername" runat="server" resourcekey="Username" />

   2: <dnn:label id="plPassword" controlname="txtPassword" runat="server" resourcekey="Password" />

   3:

   4: <asp:textbox id="txtUsername" columns="9" width="150" cssclass="NormalTextBox" runat="server" />

   5: <asp:textbox id="txtPassword" columns="9" width="150" textmode="password" cssclass="NormalTextBox" runat="server" />

   6:

   7: <asp:button id="cmdLogin" resourcekey="cmdLogin" cssclass="DNNLogin" text="Login" runat="server" />

Like many others, you probably thought of removing the stupid help icon in the login page. It is simple if you’re only having a single language website version. All you need is to replace the <dnn:label to standard html code.

If you need to persevered the language resources function, you may substitute the dnn label control into standard asp label control as follow:

   1: <asp:label id="plUsername" controlname="txtUsername" runat="server" resourcekey="Username" />

To change the textbox design as well as the font inside, simply look for <asp:textbox and change the cssclass value and thing applies to <asp:button for the login button.

After you’ve changed all the cssclass value in dnn.ascx, you may proceed to LiveID.ascx and OpenID.ascx using the same method.

Step 5: CSS Styling codes

Now we’ve reached into the hardest part where we need to use css to make a stylish login page. First, I would suggest you to put a new name for each of the value inside the CssClass attribute. This is because the default value are general classes which are shared with other modules and controls in the whole portal.

Instead of teaching you how to code CSS, I’ve made a nice login page which complete codes for you to download. For FREE of course!

Updated: Please read this How to DotNetNuke Customizing your Login – PART 2 for example codes and screen shots.

301 Redirection

How to do 301 Redirection without touching IIS? Simplest way is to use URL Master from ifinity. One thing that you should always remember to do is: COPY DOWN THE OLD URL OF THE PAGE/CONTENT BEFORE YOU DELETE IT! Most of the people deleted the page and forgot which url need to be redirected.

If you need to change the URL of a page as it is shown in search engine results, we recommended that you use a server-side 301 redirect. This is the best way to ensure that users and search engines are directed to the correct page. The 301 status code means that a page has permanently moved to a new location. —From http://www.google.com/support/webmasters/bin/answer.py?hl=en&answer=93633

In ASP.NET There is no need touching the IIS to do 301 Redirection, so do in DotNetNuke.

To sum up, just do redirection whenever you delete or move the page location.

*Remember NOT to Redirect all the pages into same page like home page. You will be penalized by Google and having this message: “Too many redirections to single URL.” in the Google Webmaster Tool, and yup! the page will be de-indexed.

404 Page Not Found

So how to make a Custom Error Page for DotNetNuke? If you Google around, people will tell you do to IIS to do redirection. WTF? How am I going to do it in Shared Hosting then? The answer is, with Control Panal like Plesk, simply go to “IIS Setting” or “Custom Error Page” and type in the destination URL of your custom made error page and it is done! But that is stupid way.

By using the method above, all of your applications in the server will be redirected to the page! Since we only need to redirect 404 page in DotNetNuke right? Here comes the web.config file. To explain a bit further, DotNetNuke has it own Error Page in the root of DNN installation already which is ErrorPage.aspx. That file is actually trigger only when your DNN has configuration errors like failed to connect to database, module crashed or DNN installation failed. Most importantly, it has a ugly design that doesn’t match your website!

So, the easiest way (I never thought it is that easy, those ‘experts’ in DotNetNuke’s forum always goes too far for a simple solution) is as above:

How to make Custom 404 Error Page in DotNetNuke?

1. Create a page in your DotNetNuke and choose a skin and container that matches your design. Yup! Just like how you create a normal page as always.

2. Access to your DNN root files via FTP. Find your Web.Config File, download it and open using notepad.

3. Find (Ctrl+F) this line: <customErrors mode=”RemoteOnly” />
and replace it with ”
<customErrors mode=”RemoteOnly” defaultRedirect=”/Whatever-you-like.aspx” />

The mode attribute can be one of the following:

* On – error details are not shown to anybody, even local users. If you specified a custom error page it will be always used.

* Off – everyone will see error details, both local and remote users. If you specified a custom error page it will NOT be used.

* RemoteOnly – local users will see detailed error pages with a stack trace and compilation details, while remote users with be presented with a concise page notifying them that an error occurred. If a custom error page is available, it will be shown to the remote users only.

So, if you’ve already created a page called “/Whatever-you-like.aspx” in first step, then just put it inside “defaultRedirect”. And you may try to typed in wrong URL to visit your website, you should see this: http://www.example.com/Whatever-you-like.aspx?aspxerrorpath=/wrong.aspx

Remember that you can redirect the 404 Error Page to other website also, in this case, just type full url with http:// in inside the “defaultRedirect” attribute.

The best practice is to include your website navigation menu, sitemap and search box for the visitors that fall into this page so that they will not think that your website is broken or else. Therefore, try to match the DotNetNuke 404 Error Page same with your main design theme.

Furthermore, you can add Google Custom Error Widget (You can get your own custom code in Google Webmaster Tool) to show a search box which suggested links for visitors. Sadly, it seems that Internet Explorer is not supporting it if you’re using it in DotNetNuke. To be precise, the widget is still in beta and not quite ready for Dynamic websites.

One last thing, don’t forget to change the CustomError in web.config during DotNetNuke upgrade.

Hope this post solve your doubts and confusion in DotNetNuke Custom 404 Error Page. No need to change IIS setting! (Especially if you’re using Windows server 2008, most of the setting can be done within web.config)

You may skip this paragraph. Taking a break of the day, Headache always killing me. My eyes is very tired a really need to keep away from monitors, thank god Chinese New Year is around the corner and I can escape from this information overloaded world.

Back to the topic (Skip this paragraph for direct guide) . In traditional hosting, you’re only able to host one domain in one hosting. The Domain Alias function is like domain redirection or domain parking which all point back to the main domain hosting account. However, with DotNetNuke, you are able to host different domains hosting under one hosting account by utilizing the Portal Alias function in DotNetNuke (DNN) and Domain Alias in your hosting.

Domain Alias which also known as Host Header in technical terms, always confuse people that search for answer on creating Parent Portal in DotNetNuke. Because Shared Hosting does not allow you to have the privilege to configure the server’s IIS, the hosting control panel often provided with Domain Alias feature to allow user to configure the IIS in restricted / safer manner.

Using Plesk Control Panel for example, Normally you will see the Domain Alias on the Domain Setting panel, click on the ‘add Domain Alias’ and you will see this:

Make Sure to Check on the 3 options provided in the first time or you will not able to access to the parent portal later.

*Apply to some version of Plesk only, if you cannot access to the parent portal later, try delete the domain alias and recreate again.

**Sometimes, you’ll need to restart the DNS Service to make it work. To do this, simply click on the button as demonstrated in the picture below:

That’s it. Below is the summarized steps and notes in creating Parent Portal in DotNetNuke and hosting DNS / Host Header setting:

Steps:
1. Login to your domain control panel and point it to your Hosting Account. It also known as NameServer pointing. Please remember to wait for the DNS propagation which takes about 12-72 hours before your domain successfully point to the right server.

*Note: If you’re in a rush, you can modify your Operating System DNS to access the website. Here’s the configuration:

I. Identify where is your workstation Hosts file.
Linux / Unix = /etc/Hosts
Windows 3.1/95/98ME = c:\windows\Hosts
Windows NT/2000/XP Pro = c:\winnt\system32\drivers\etc\Hosts or c:\windows\system32\drivers\etc\Hosts
Windows XP Home = c:\windows\system32\drivers\etc\Hosts
Netware = SYS:ETC/Hosts
Apple = System Folder:Preferences and in the System Folder itself

II. After you have identified the location of respective Hosts File, you may open it with text editor such as notepad under Windows Operating System.
III. As for your case, kindly add the following entry to the Hosts file and it will tell your workstation to direct the domain traffic to respective server.

111.11.11.11       example.com

IV. You may now proceed to save the Hosts file and try to browse it from your web browser.
V. Once you have done the testing, you may remove the entry from the Hosts File.
VI. test it in command prompt. cmd > ping www.example.com see if the IP is same with your main hosting account.

2. On your Hosting Control Panel, Domain Alias > Add Domain Alias > Type your domain name without www, check the 3 options if you’re using Plesk.

***There’s no need to change the DNS Records for your Domain Alias, it will automatically created if you’re using Plesk or Helm.
* Try to restart the DNS service if not working.

3. Login as Host in your main DotNetNuke installation.
Go to Host > Portals > Add Portal > type the domain without www and fill out other details > Create.

* If you encounter error when creating portal, most likely it is because of the file permission problem set by your host, contact them to fix it.

4. Done.

Updates

1. If you’re creating a sub-domain, there’s no need to follow the above setting. All you need is to click ‘add sub domain’ in your Plesk Control Panel.

2. However, you do not need to create Physical Directory for your sub domain. DNN will create one for you.

3. Now, go to DNN Portal Setting (Host > Portals) to add a child portal and that’s it.

Keynotes:
1. Make sure to restart your DNS Services if your domain redirect to default Plesk Page.
2. There’s no need to configure Host Header Manually in IIS if you’re using Control Panel like HELM or Plesk.
3. Make sure your Hosting Provider allow you to create Domain Alias.
4. There’s no need to change your Domain Alias DNS Records!

That’s all. Good luck.