Custom Dotnetnuke (DNN) Skin Design

How to add an ICON area for dotnetnuke containers

Location: DotNetNuke
 

After recently receiving an email regarding icons not showing up in my template DNN containers, I thought it best to explain why they aren't included in my current container packs, and the solution for including icons if they are necessary (This is a small piece of HTML that needs to be added to the container .html file in the skin pack).

1. The reason they're not included in my current container packs is so the design of the containers won't break when icons that are too large for the space provided is used. Understandably the main point of templates is to offer the most amount of functionality within the skins, however I felt that this wasn't one of the main pieces of functionality that the containers needed to provide so I didn't include it.

2. The solution for including the icon space in the container skins - As with all the dynamic areas of dotnetnuke skins, this is added during the design process through a DNN skin Token, in this case the [ICON] token within the container skin HTML file.

If you unzip the main container skin files and locate the html for the specific container you are adding the icon to, and open this so you can edit the html. Find the area within the html code where you would like to see the icon, I'd assume this to be somewhere near the [TITLE] token if you are going with popular trends in design. Insert the [ICON] token, including the brackets and save the html. replace the existing html file in the upload zip with this new one and upload the whole skin file as a container upload if you're uploading individual containers, or a skin file if the containers are part of a skin upload. the dotnetnuke framework will now parse this new information and update the container.

Now when you select an icon for a container it will show where you inserted the [ICON] token.

 

Your name:
Title:
Comment:
Add Comment    Cancel  

Rhoek.com's design blog focuses on web design and dotnetnuke skin design.

We've been designing and developing websites and custom/template dotnetnuke skins since 2003 and have experience in X/HTML, CSS, javascript, DNN skinning, XML, XSLT, accessibility, usability, email design and building, and Search Engine Optimisation.

Login
08 September 2008