Register   Login   
Saturday, October 21, 2017  
..:: DirectChat » Skin Integration ::..
Skin Integration Minimize

This tutorial is in progress....

In order for the chat module to be useful, it should exist on every page of your site. The easiest and cleanest way to accomplish this is by integrating the chat module into your site's skin. You may of course choose to use it as a standard module to place it on specific pages. This tutorial focuses on how to integrate the chat skin object.

CAUTION: editing a skin is a potentially dangerous. If you are not familiar with DNN skins or if you are not comfortable editing HTML code by hand, you should consult with someone who is first. Always test in a development environment before deploying to production.

Please refer to the DotNetNuke Skinning.pdf document in the DNN documentation (also available through the DNN downloads page http://www.dotnetnuke.com/tabid/125/default.aspx)

This tutorial is in progress....

In order for the chat module to be useful, it should exist on every page of your site. The easiest and cleanest way to accomplish this is by integrating the chat module into your site's skin. You may of course choose to use it as a standard module to place it on specific pages. This tutorial focuses on how to integrate the chat skin object.

CAUTION: editing a skin is a potentially dangerous. If you are not familiar with DNN skins or if you are not comfortable editing HTML code by hand, you should consult with someone who is first. Always test in a development environment before deploying to production.

Please refer to the DotNetNuke Skinning.pdf document in the DNN documentation (also available through the DNN downloads page http://www.dotnetnuke.com/tabid/125/default.aspx)

 Print   
How-To Minimize
  1. Locate your skin folder. This is typically [ROOT]\Portals\_default\Skins\[SKIN_NAME]
  2. DNN has a skin parsing engine to convert html to ascx files. We will be editing the post-processed ascx files. There maybe a number of ascx files in your skin folder, so you may need to repeat this process for each.
  3. Open one of the skin.ascx files in a text editor.
  4. At the top of the file, there will be a number of "register" tags. Add this line:

    <%@ Register TagPrefix="wansco" TagName="CHAT" Src="/Portals/0/~/DesktopModules/WanscoChat/Chat.ascx" %>

  5. Next, add the following to the bottom of the skin file:

       

           

       


    <div id="FixedFooter" style="bottom:0;color:#111111;font-size:11px;height:15px;padding:0;position:fixed;right:0;width:100%;z-index:99;">
      <div style="display:block;margin-left:15px;margin-right:15px;">
        <div style="height:15px;"><wansco:CHAT ID="PageChat" runat="server" /></div>
      </div>
    </div>

     
  6. Save the skin file and test it in a development environment.
     

The HTML/CSS above has a few rendering flaws that we are working through. Feel free to modify the code to work with your skin/application.

  1. Locate your skin folder. This is typically [ROOT]\Portals\_default\Skins\[SKIN_NAME]
  2. DNN has a skin parsing engine to convert html to ascx files. We will be editing the post-processed ascx files. There maybe a number of ascx files in your skin folder, so you may need to repeat this process for each.
  3. Open one of the skin.ascx files in a text editor.
  4. At the top of the file, there will be a number of "register" tags. Add this line:

    <%@ Register TagPrefix="wansco" TagName="CHAT" Src="/Portals/0/~/DesktopModules/WanscoChat/Chat.ascx" %>

  5. Next, add the following to the bottom of the skin file:

       

           

       


    <div id="FixedFooter" style="bottom:0;color:#111111;font-size:11px;height:15px;padding:0;position:fixed;right:0;width:100%;z-index:99;">
      <div style="display:block;margin-left:15px;margin-right:15px;">
        <div style="height:15px;"><wansco:CHAT ID="PageChat" runat="server" /></div>
      </div>
    </div>

     
  6. Save the skin file and test it in a development environment.
     

The HTML/CSS above has a few rendering flaws that we are working through. Feel free to modify the code to work with your skin/application.

 Print   
  Privacy Statement | Terms Of Use
Copyright 2006 - wansco.com
Home  |  TimeClock  |  DirectChat  |  Support