DotNetNuke

After having spent ages reworking the layout code and customising the blog module to fit into the new design of the rhoek.com layout, along comes another improved version of the module.

Released on the 8th of January this upgrade boasts many fixes and layout changes that are sure to please all of us using this module as opposed to the mainstream solutions such as movable type and wordpress, bringing the dotnetnuke solution closer to their likes in terms of functionality and layout.

Get up-to-date with the changes to the module, in the DNN blog release notes.

Download the blog module from dotnetnuke.

I'll be upgrading to the new version of the blog module within the coming weeks, because reckon I'll need to make some changes to the layout to keep it in-line with my new design, so I'll probably need a full day to work on it. I'll post after the change for two reasons:

1. to see how it performs, and; 
2. to let you know how it went during the upgrade.

I recently added a rollover effect to my site logo (if you rollover the rhoek.blog logo at the top you should see what I mean), and here's how it's done.

Overview.
The effect is created by using a transparent image for the physical logo uploaded to DNN and then using CSS to add a background of the logo image. This background contains both states of the rollover, the normal view and the rollover effect, which is then re-positioned using the a:hover pseudo-class, to create a rollover.

Step 1. Create the logo background graphic.

Using photoshop, or whichever graphics package you use for creating artwork, design and layout 2 versions of your logo,1 for each of the 2 states. The key to remember here is that only half of the image will show at any one time, so make sure that the image is twice the height of the logo you use on your site, also make sure that each state is centered within its half so they line up when the effect is complete.

Image Sizes:
For the example shown my physical logo size is 225px x 78px and the backgr ...

Recently I had an enquiry into one of my container packs not centering content properly.

The Glossy Titles Version 4 containers are almost completely css based with only one table being used for the content pane. It turns out that the table was not 100% wide, and therefore when the content was aligned to the center using the settings in the module options, which adds a css class style of text-align:center, there was no effect because the containing element (the table cell) was collapsed. So having fixed the issue of the table not being 100% wide, I tested the containers on other browsers, to discover that the alignment doesn't work for firefox, opera, navigator, or safari.

The reason for this is that these browsers don't use the text-align css styles to align box elements like divs, tables and forms. To achieve centering for these items, which will work for many o ...

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 ...

The search functionality of DNN has recently gone a good upgrade, which has seen it include the ability to search both the local site and the entire web.

Being a skin designer this has posed slight constraints on my previous designs as it requires additional space for two new form controls. This additional space has pushed some of my previous designs to breaking point and I've therefore been on the hunt for a method of turning this functionality off, rather than simply hiding it with css.

Below is the required code, to be placed in you skin XML file, for turning the display of these options off, as default the search will still cover the local site so there's no need to worry about having them not show as long as you don't need the ability for web search.