Monday, March 23, 2009

Getting the code you want from DotNetNuke

Introduction:
DotNetNuke development is always an interesting for me. New developers come to the forums posting same silly questions again and again, and guys out there on the forums give them a gentle reply with some guidelines. This happens always everyday on DotNetNuke Forums. Sometimes i think is it really hard to find what we want from DotNetNuke source and DotNetNuke web app?

Understanding the way DotNetNuke works:
I think developers should start learning DotNetNuke from the basic understanding about portals, tabs, modules, skins, skin objects etc. Don't start your development before understanding these terms. I am not going to introduce or summarize these terms as you will find many web logs regarding this.

Getting started with development:
Once you get basic understanding about this, you will be able to understand how DotNetNuke development will go for you. Once you are done with this, whenever you need to write a code that you don't have ask this questions to your self: Is DotNetNuke doing this? How DotNetNuke is doing this? For instance, if you are looking for code to dynamically create a tab in dotnenuke. you should ask, is DotNetNuke creating dynamic tabs? and the answer is obviously yes. Second question is how it is creating the tab? This is a hard question for new developer. Basically, all the DotNetNuke admin related stuff can be found in admin directory. If you look at ~/Admin/Tabs/ManageTabs.ascx, You will see the page that is used to create a new tab from DotNetNuke UI. Click on update link and you can easily find the code written in vb. You just need to find a part of code you basically want. You can also convert this code to c#.

How to search the code i want?
Well its really depends upon what code you want. But if you think like the way I demonstrated above, you will probably find the code you want after some trial and errors. The big help will be from the DotNetNuke UI and the way the directory structure is provided. Let's take another example of updating a user. So for finding that code, if you look at admin folder, you will find ~/Admin/Users where we think the code can be. Let's try that folder first. Opps! looking at the folder increases the problems, we have many controls in it unlike tabs folder. So let's try the controls one by one. Just open the ascx control on by one in design mode and see if you can find update button on it. Well the control ~/Users/User.ascx controls a floppy icon which is obviously a universal icon for save in DotNetNuke . so let's see what is written in the code of the click event of it. Well it contains a code to create a new user as well as update an existing user. Am I right? Ok, so this code says UserController.UpdateUser() is a method you can use to update the user. Just pass userportalid and userinfo object to it, and it will update the stuff. So if you want to implement a custom user profile update page, you just need to get the userInfo object from UserController.GetUserByName and assign the new values to the object properties and UserUser Method of the UserController class. An you are done.

Conclusion:
So basically DotNetNuke has all the code you want. You just need to guests where can i find the code and just go through the code and you will definately find the code you want. Accessing source code is more complecated than accessing web application because you don't have UIs to compare with, but once you got familiar with DotNetNuke , you will find your required code in the source code also. I think DotNetNuke documentation is also helpful finding the right code as well as if you understand the way DataProvider and SqlDataProvider implemented, it will be fun digging into the code.
Best luck with your DotNetNuke code review and hope you will find the code you need from DotNetNuke .

Friday, March 20, 2009

Free DotNetNuke skin template of BluePrint CSS framework

There are lots and lots of css framework available across the world which means to solve the repetative css code writing problem for you. There are two remarkable frameworks that earn respect in the designing web 2.0 websites, 960 grid framework and BluePrint css framework. There are some good articles for comparing the the two and lots of other one, and most of the discussions ends with BluePrint css framwork is better than anyone else and after that 960 css framework. You can just click here for search results about comparing BluePrint vs 960 framwork. There are good css frameworks which can be found through google by the term Css Framework.


I found an implementation of 960 grid framework for dotnetnuke in dotnetnuke forums. You can visit the site here. Its always helpful to get this kind of efforts available online. Because of this implementation news, I started thinking about which is the css framework that really can help speed up the skin development in dotnetnuke. As 960 is a good option to go with, those who want to use 960 will get started with the implementation at http://www.dnngrid960.com/. Those who think BluePrint is a better option, I implemented a very basic skin. Here is how it looks like the one shown in the image. Here is a quick summary:

  1. The template is of so basic lavel
  2. There is a single container
  3. Single skin file with html4 strict doctype validation.
  4. No skin objects or dotnetnuke controls are added in it
  5. Very light weight and simple template

You can download the skin template from here. The template will help you implementing your skin quickly.

You can find an example skin BluePrint0.1 implemented here.

  • The example skin implementation is a very basic level and same as the default dnn blue skin
  • Tried implementing the sking with just a grid.css and only core basic classes so that everyone can understand the dnn classes as well as blue print css classes easily
  • IE and Mozilla fonts are leaved intentionally different so that users can understand they can fix ie related css stuff in ie.css
  • No images, single basic container.
  • YSlow : 28.4k Stylesheet files(4 files), 0.05k image (BluePrint.png), 169.2k Javascript files, total 214.4k with 17 requests.
Hope this will help you understand the BluePrint css implementation as well as help speed up your dotnetnuke skin development.

Thursday, March 5, 2009

Free DotNetNuke Skin - Nutica

My third free dotnetnuke skin converted from a free xhtml template. Here is a quick description:

  • Different layout support - supports one column, two column, three columns
  • Different containers - 4 containers, each for left, right and middle column and a middle column block quote container
  • Single package for skin and container, its working in dotnetnuke 4.5.5, but if its not working for you, extrack the file, and you will get different zips for skin and container, paste them to different folder and rename them with Nutica.zip
  • Again, the limitation with this is, menu and submenu are not formated properly and not looking too good. please tell me how can we improve this?
  • Download the skin

Please give your valueable feedbacks about the skin, so that i can improve the stuff. Providing feedback will help me understanding the skins conversion, that will help me write my tutorial about converting xhtml template to a dotnetnuke skin.

Note: Free skins are in this blog are distributed under creative common licence, you can use all skins for free, but please provide credit link to my blog. Thanks

Wednesday, March 4, 2009

Adding javascript events to dropdownlist items

This code applies to all the controls which contains ListItem, Here is a code sample for DropDownList:
XHTML Code

<asp:DropDownList ID="DropDownList1" runat="server">
<asp:ListItem Value="1">Item 1</asp:ListItem>
<asp:ListItem Value="2">Item 2</asp:ListItem>
</asp:DropDownList>

C# code

foreach (ListItem item in DropDownList1.Items)
{
item.Attributes.Add("onclick", "itemclick(this);");
}

Javascript code:

function itemclick(obj)
{
alert(obj.text);
alert(obj.value);
}

DNN 5 - Get All tabs


TabController controller = new TabController();
TabCollection tabs = controller.GetTabsByPortal(0);
IDictionaryEnumerator hs = tabs.GetEnumerator();
while (hs.MoveNext())
{
TabInfo tab = (TabInfo)hs.Entry.Value;
Response.Write(tab.TabName + "<br/>");
}

Popular Posts