Changing the look and feel of a DNN module

DNN modules consist of business logic and presentation logic.

The module's logic is in *.dll assemblies in the Bin\ folder. These cannot be changed without re-compilation.

The presentation is contained in front-end controls (in *.ascx files) in DesktopModules\<Module_Name>\ folder. These can be changed by directly editing the text files. However Controls cannot be deleted, because they are referred to in the .dll, instead you have to make the controls non-visible.

For example change:

<asp:label id="lblArchive" ...>Archive</asp:label>

to:

<asp:label visible="false" ...>Archive</asp:label>

Of course, its even better if the Module developer has moved most of the presentation style to the styles sheet (eg. table widths). These can be edited directly on module.css

For an explanation of simple edits to modules Presentation:

http://dotnetslackers.com/articles/dotnetnuke/Improve_a_DotNetNuke_module.aspx

However the text settings for the modules are in separate resx files.  These are in DesktopModules\<Module_Name>\App_LocalResources and are in a XML format specified by MS http://msdn2.microsoft.com/en-us/library/ekyft91f(VS.80).aspx

Data is defined in pairs so for example a read more link is defined as:

 <data name="lnkMore.Text">
  <value>Read more></value>
  </data>

 which in terms is defined in the corresponding control file by id

<asp:linkbutton id="lnkMore" runat=server commandname="Entry" commandargument='<%# DataBinder.Eval(Container.DataItem, "EntryID") %>' CssClass="CommandButton" ResourceKey="lnkMore" >
                            [More]
</asp:linkbutton>

You can clean up a lot of the embedded tables in modules.  But you will start to run into situations where there is no clear separation of presentation.  For example in the blog module the asp:datalist Controller is used, instead of the Repeater Controller.  The datalist wraps a table around the repeated block which is unfortunate.

 For example;

<asp:datalist id="lstBlogView" runat="server" width="100%">

is outputted in html as a wrapper of a sinlge cell table:

<table id="dnn_ctr388_MainView_ViewBlog_lstBlogView" style="width: 100%; border-collapse: collapse;" border="0" cellspacing="0">
<tbody>
<tr>
<td>
content
</td>
</tr>
<tbody>
</table>

 Of course you can live with the table output by removing 100% width, which can screw css based designs in IE.  There is another altennative, that is to use he MS data Control parameters. You can change the output from table to a span, using the Flow command for example:

<asp:datalist id="lstBlogView" runat="server" RepeatLayout="Flow"> 

See more information about datalists at:

http://www.wwwcoder.com/Directory/tabid/68/type/art/site/3890/parentid/254/Default.aspx
http://www.w3schools.com/aspnet/aspnet_datalist.asp

Categories: DNN web development,Code bits

Write a comment

  • Required fields are marked with *.

If you have trouble reading the code, click on the code itself to generate a new random code.
Security Code: