Please forgive me because I miss few files. I modified step 4 and add new step 5.
After I got the Speerio Skinergy from Ray, I could not find any instruction how to add the Speerio Skinnergy to existing DNN Skin. I played around and finally, I have an instruction how to add Speerio to DNN-Blue skin for anybody interest it.
2. Unzip and copy Speerio folders to <DNNRoot>
3. Modify the line 35 of <DNNRoot>/controls/Speerio/Skinergy/skinprefs.ascx
• from “Sub InjectStyleSheet(ByVal cookieId As String, ByVal suffix As String, small As Image, medium As Image, large As Image)”
• to “Sub InjectStyleSheet(ByVal cookieId As String, ByVal suffix As String, small As System.Web.UI.WebControls.Image, medium As System.Web.UI.WebControls.Image, large As System.Web.UI.WebControls.Image)”
4. Copy files palettes.xml and skincolor.css , folder sub-folder “prefs” from <DNNRoot>/Portals/_default/Skins/Speerio-Z/ to <DNNRoot>/Portals/_default/Skins/DNN-Blue/
5. Modify <DNNRoot>/Portals/_default/Skins/DNN-Blue/skin.css from
.pagemaster {
width: 100%;
height: 100%;
background-color: #fefefe;
}
To
.pagemaster {
width: 770px;
height: 100%;
background-color: #fefefe;
}
6. Edit <DNNRoot>/Portals/_default/Skins/DNN-Blue/prefs/layout-large.css to
.pagemaster{width:100%;}
7. Edit <DNNRoot>/Portals/_default/Skins/DNN-Blue/prefs/layout-medium.css to
.pagemaster{width:1024px;}
8. Copy existing files from <DNNRoot>/Portals/_default/Skins/DNN-Blue/ to new files (in the same folder)
• Copy “Horizontal Menu - Full Width.ascx” to “Horizontal Menu - Speerio.ascx”
• Copy “Horizontal Menu - Full Width.htm” to “Horizontal Menu - Speerio.htm”
• Copy “Horizontal Menu - Full Width.JPG” to “Horizontal Menu - Speerio.JPG”
9. Edit file <DNNRoot>/Portals/_default/Skins/DNN-Blue/Horizontal Menu - Speerio.ascx
Find a line <%@ Register TagPrefix="dnn" TagName="DOTNETNUKE" Src="~/Admin/Skins/DotNetNuke.ascx" %>
Add 2 new lines below that line
<%@ Register TagPrefix="speerio" TagName="SKINPREFS" Src="~/controls/Speerio/Skinergy/skinprefs.ascx" %>
<%@ Register TagPrefix="speerio" TagName="PALETTES" Src="~/controls/Speerio/Skinergy/palettes.ascx" %>
Find a line below
<TABLE class="pagemaster" border="0" cellspacing="0" cellpadding="0">
Modify the line, remove width="100%" if existed, add align="center" as shown below
<TABLE class="pagemaster" border="0" cellspacing="0" cellpadding="0" align="center">
Find a line below
<TD class="skingradient" vAlign="middle" align="right" nowrap><dnn:SEARCH runat="server" id="dnnSEARCH" showWeb="True" showSite="True" /><dnn:LANGUAGE runat="server" id="dnnLANGUAGE" showMenu="False" showLinks="True" /></TD>
Add the lines inside the <td>, remove the ID="PALETTES1" and ID="SKINPREFS1" because Visual Studio added by itself
<TD class="skingradient" vAlign="middle" align="right" nowrap>
<speerio:PALETTES runat="server" /> <speerio:SKINPREFS runat="server" mode="Both" />
<dnn:SEARCH runat="server" id="dnnSEARCH" showWeb="True" showSite="True" /><dnn:LANGUAGE runat="server" id="dnnLANGUAGE" showMenu="False" showLinks="True" /></TD>
10. Login as host, select DNN-Blue, select Horizontal Menu – Speerio, and preview the skin
You can modify the skin named Vertical Menu - Full Width of DNN-Blue as shown above. I hope it help.