DotNetNuke Skinning – Collapsible Containers
January 8th, 2013 | 
Author: One feature you’ll see in DotNetNuke containers is the ability to collapse the container using an icon, typically in the upper right hand corner of the container. Implementing collapsible containers in DotNetNuke is relatively simple.
The control that causes a panel to expand or collapse is the Visibility control. To make this available to your skin, add the following code at the top of the ASCX file:
<%@ Register TagPrefix="dnn" TagName="VISIBILITY" Src="~/Admin/Containers/Visibility.ascx" %>
Then add the following markup where you want the icon to display:
<dnn:VISIBILITY runat="server" id="dnnVISIBILITY" />
You would typically add this to the right hand side of the container’s title area.
It’s really just that simple. This gives you the default +/- icon and automatically handles the expand/collapse feature of the container.
You can also modify the following attributes:
| Attribute | Descriptions |
| AnimationFrames | The number of frames to use when animating the opening and closing of the container. The default number is 5. A larger number will slow down the animation. |
| BorderWidth | Typically zero (0), this value controls the width of the border around the expand or collapse image. |
| MinIcon | You can replace the icon representing the minimized state by specifying it in this attribute. |
| MaxIcon | You can replace the icon representing the maximized state by specifying it in this attribute. |
Other post in DotNetNuke - Skinning
- DotNetNuke Skinning - Getting Set Up - June 10th, 2008
- DotNetNuke Skins - Handling CSS Files - June 12th, 2008
- DotNetNuke Skins - Hello, World - June 17th, 2008
- DotNetNuke Skins - Skin Objects - June 19th, 2008
- DotNetNuke Skinning - Containers - June 24th, 2008
- DotNetNuke Skinning - Dealing with Images - July 3rd, 2008
- DotNetNuke Skinning - SolPartMenu - July 8th, 2008
- Blue Stack Form Enhancer Review - September 30th, 2009
- DotNetNuke - Avoiding Container Collision - June 11th, 2012
- Infinite DotNetNuke Skin Sets For One Low Price - August 14th, 2012
- DotNetNuke Skins - ASCX vs HTML mode - November 6th, 2012
- DotNetNuke Skinning - Collapsible Containers - January 8th, 2013
- DotNetNuke Skinning - Standard CSS Classes - February 5th, 2013
- DotNetNuke - Skinning - March 12th, 2013
Republished by Blog Post Promoter
Related Post
DotNetNuke Modules – Creating Base Modules
Now that we have DotNetNuke installed into Visual Studio we can go ahead and create our first modules. Actually, creating the modules is pretty simple. But it is even easier to do it wrong, which...
DotNetNuke – Skinning
Today I'm going to start a separate series on Skinning DotNetNuke. Don't worry, I'm still planning to continue the series on creating modules. Later on, I may start a series on something else. But ...
DotNetNuke Skins – Skin Objects
There are a number of DotNetNuke controls, which they call objects, that are available to the skin designer. This adds functionality to the page such as a link to login/logout, date/time, username,...
DotNetNuke Skinning – SolPartMenu
When you first encounter the SolPartMenu skin object, you may become a bit overwhelmed by all of the options. But, it doesn't take long to realize that you can ignore most of the attributes on the...
DotNetNuke Skinning – Containers
Today we move our focus to DotNetNuke containers. Not because we are done with skins, but because we can't go any further in our discussion of skinning until we cover containers. As with skins...
Posted in 
Tags: 