Welcome back from Part 1 or from anywhere... Here we will see how to install your first skin for the DotNetNuke engine.
You will find a lot of tutorial on the internet about implementing your own skin for DotNetNuke. The problem is that only few of them have in mind that most os us are the "trial and error" kinda people. We like to write "qesdfawe" and see how it is immediately reflected on the result. We rarely write a full blown html code form head to tail and then see what we have done. Therefore this tutorial is oriented towards this way. Ok... Enough of the self brag-o-recognition. Time for some work:
In the new dotnetnuke website login as "Host". In Admin/Site Settings, expand the Appearance tag and locate the entry Portal Skin. This is where you select the skin of your site. This Drop-Down menu reflects the folders in your dotnetnuke folder \Portals\_default\Skins\.(we will come back to this soon).
In order to implement the skin you need to open the site through Visual Studio. You can also implement a skin with no Visual Studio but since you are in this blog and propably program in C#, VB.NET I dought it that you don't have Visual Studio installed. Open Visual studion and select "Open WebSite". Navigate to the DotNetNuke installation folder (in my case DNNDemo) and select it. When the site is opened, build the project. You will notice that you get the following error: Could not load type 'DotNetNuke.HtmlEditor.FckHtmlEditorProvider.fckimagegallery' and some related errors. This is resolved by navigating in Solution Explorer to bin/Providers/ and moving the file DotNetNuke.FckHtmlEditorProvider.dll to the bin/ folder. Rebuild and you are good to go !
In Solution Explorer navigate to \Portals\_default\Skins\ and create a TestSkin folder. Add in the folder an index.ascx file. No matter what you will do with it a simple template that I consider it to be standard is index.ascx (2,96 kb).
Add a skin.css file like this one (skin.css (7,43 kb)) and your skin is ready. (Although not very professional one)!
The great news is that once you put those two simple files in your site under Admin/Site Settings/Appearance/Portal Skin you can select your new skin. Moreover the changes you make to those files are immediately reflected to your site once you hit refresh providing you with the best way for little "trial and error".
This is a very brief introduction on how to start with skinning. From this point the information you can find on the web on how to arrange the look and feel of your site via skinning is more than enough.
