Products

Evoq Content Overview Content Creation Workflow Asset Management Mobile Responsive Personalization Content Analytics SEO Integrations Security Website PerformanceEvoq Engage Overview Community Management  Dashboard  Analytics  Member Profile Gamification Advocate Marketing Community Engagement  Ideas  Answers  Discussions  Groups  Wikis  Events Mobile ReadyDNN Support PackagesEvoq: CMS FeaturesEvoq OnDemandCompare DNN's CMS Products

Solutions

Content Management SystemMulti-Channel PublishingDigital MarketingOnline Community ManagementIntranet Software SolutionOur CustomersPrime

Resources

Test DrivesSchedule A DemoDocumentation CenterWebinarsWhite PapersProduct ManualsRequest PricingData SheetsCase StudiesEvoq Preferred Products Content Management Ecommerce Forms Identity Management and Authentication Site Management Social Themes

Partners

DNN Partners Partner Directory Become a DNN Partner Partner Program Overview  Hosting  Implementation  ISV  Training  Competencies

Community

Participate Ask a Question Forums Community Showcase DNN MVP  Program Overview  Lifetime MVPs  Honorary MVPs Subscribe to DNN Digest Advisory Groups  Awareness Advisory Group  Developer Advisory Group  Partner Advisory Group  Technology Advisory GroupLearn Documentation Wiki Community Blog Video Library Project History Development RoadmapDownload DNN Store Language Packs Manuals Nightly BuildsSecurity Policies Security Center

Blog

About

News Press Releases News Coverage Press KitCareersContact DNN

QA

Ideas Test

New Community Website

Ordinarily, you'd be at the right spot, but we've recently launched a brand new community website... For the community, by the community.

Yay... Take Me to the Community!

Welcome to the DNN Community Forums, your preferred source of online community support for all things related to DNN.
In order to participate you must be a registered DNNizen
HomeHomeUsing DNN Platf...Using DNN Platf...Skins, Themes, ...Skins, Themes, ...need a little help with a skin with 5 contentpanesneed a little help with a skin with 5 contentpanes
Previous
 
Next
New Post
11/20/2007 1:27 PM
 
Ton Hermes


Joined: 1/6/2005
Posts: 608

Hi,

I' want to have a skin with 5 content panes.
This way I can make a gallery.
In this gallery I can shuffle the modules from left to right and from top to bottom.

I took the original horizontal_full_width.HTML from a dnn default skin
Then I modified the content pane table as you can read below.
After that I modified the css file,
When I Upload this skin everything seems to work fine.
I can install txt/html modules in al 5 panes and in the left and right pane.
However !!!
The moment I want to edit a txt/html module everything disappears.
There is just a blank screen.
I made of course a mistake or did something wrong.
Somebody can help me with this ?

With regards, Ton Hermes

code snippet from "horizontal_full_width.html
<TABLE cellspacing="3" cellpadding="3" width="901" border="0">
  <TR>
    <TD class="toppane" colspan="6" id="TopPane" runat="server" valign="top" align="center" width="885"></TD>
  </TR>
  <TR valign="top">
    <TD class="leftpane" id="LeftPane" runat="server" valign="top" ></TD>
    <TD class="contentpane1" id="ContentPane1" runat="server" valign="top" ></TD>
    <TD class="contentpane2" id="ContentPane2" runat="server" valign="top" ></TD>
    <TD class="contentpane3" id="ContentPane3" runat="server" valign="top" ></TD>
    <TD class="contentpane4" id="ContentPane4" runat="server" valign="top" ></TD>
    <TD class="rightpane" id="RightPane" runat="server" valign="top" ></TD>
  </TR>
  <TR>
    <TD class="bottompane" colspan="6" id="BottomPane" runat="server" valign="top" align="center" width="885"></TD>
  </TR>
</TABLE>

"code sippet from css file
.leftpane {
 width: 10%px;
 background-color: transparent;
 padding-left: 6px;
 padding-right: 4px;
 padding-top: 6px;
}
.contentpane1 {
 width: 20%;
 background-color: transparent;
 padding-left: 6px;
 padding-right: 4px;
 padding-top: 6px;
}
.contentpane2 {
 width: 20%;
 background-color: transparent;
 padding-left: 6px;
 padding-right: 4px;
 padding-top: 6px;
}
.contentpane3 {
 width: 20%;
 background-color: transparent;
 padding-left: 6px;
 padding-right: 4px;
 padding-top: 6px;
}
.contentpane4 {
 width: 20%;
 background-color: transparent;
 padding-left: 6px;
 padding-right: 4px;
 padding-top: 6px;
}

.rightpane {
 width: 10%;
 background-color: transparent;
 padding-left: 6px;
 padding-right: 4px;
 padding-top: 6px;
}

Art is hard work, inspiration is the cream on top of it. See my watercolors at www.watermansite.com and my enamel art at www.watermanshop.com
 
New Post
11/20/2007 2:25 PM
 
Marc Huijbregts


www.biservices.eu
Joined: 7/19/2005
Posts: 388

Ton,

If i'm not mistaken you should at least have a pane called "ContentPane"

This is because DNN expects it that way (just read it last night in the book DNN Skinning and design). Although i'm not sure this solves you problem you might give it a try.

 

Regards,
Marc

www.biservices.eu for free nl-NL resourcepacks.
 
New Post
11/20/2007 2:34 PM
 
Will Strohl


Will Strohl's Avatar

Will Strohl's Avatar

Will Strohl's Avatar

Will Strohl's Avatar

Will Strohl's Avatar

Will Strohl's Avatar

https://upendoventures.com
Joined: 3/1/2005
Posts: 2884

That was also my first suggestion.  Change one of the "contentpanes" to actually be "ContentPane'. 

The DNN core code requires this pane name in a number of areas.  When you click the "Edit" link for the module, the DNN core assumes that there will always be a "ContentPane" in place.  Therefore, the core code attempts to inject the Edit control for the module into the only Pane that it knows (assumes) exists. The skinning system does not know what panes are actually there until the rendering of the skin control.

In addition, I would venture to guess that you cannot view any Admin pages (if this was changed for the entire site).  If this is the case, you will need to manually edit the DB values for the chosen skin to be NULL.

Will Strohl

Upendo Ventures Upendo Ventures
DNN experts since 2003
Official provider of the Hotcakes Commerce Cloud and SLA support
 
New Post
12/15/2007 2:59 PM
 
Ton Hermes


Joined: 1/6/2005
Posts: 608

Hi,

This works good, except 1 minor thing !!!
There is on the right a gap.
The skin is not stretching on the whole screen.
I can shuffle the modules from one contentpane to another.
This way I can make my own simple gallery.
Now only to get rid of the gap on the right side.
Maybe you have a suggestion for me ?
Below you can see the html file and the css file.

With regards and thanks, Ton Hermes.

HTML

<HTML>
<HEAD>
<LINK ID="skin" REL="stylesheet" TYPE="text/css" HREF="skin.css" />
</HEAD>
<BODY>
<TABLE class="pagemaster" border="0" cellspacing="0" cellpadding="0">
<TR>
<TD valign="top">
<TABLE class="skinmaster" width="100%" border="0" align="center" cellspacing="0" cellpadding="0">
<TR>
<TD id="ControlPanel" runat="server" class="contentpane" valign="top" align="center"></TD>
</TR>
<TR>
<TD valign="top">
<TABLE class="skinheader" cellSpacing="0" cellPadding="3" width="100%" border="0">
  <TR>
    <TD vAlign="middle" align="left">[LOGO]</TD>
    <TD vAlign="middle" align="right">[BANNER]</TD>
  </TR>
</TABLE>
<TABLE class="skingradient" cellSpacing="0" cellPadding="3" width="100%" border="0">
  <TR>
    <TD width="100%" vAlign="middle" align="left" nowrap>[NAV]</TD>
    <TD class="skingradient" vAlign="middle" align="right" nowrap>[SEARCH]&nbsp; [DSLOCALESELECTOR:2]</TD>
  </TR>
</TABLE>
<TABLE cellSpacing="0" cellPadding="3" width="100%" border="0">
  <TR>
    <TD width="200" vAlign="top" align="left" nowrap>[CURRENTDATE]</TD>
    <TD width="100%" vAlign="top" align="center"><B>..::</B>&nbsp;[BREADCRUMB]<B>::..</B></TD>
    <TD width="200" vAlign="top" align="right" nowrap>[USER]&nbsp;&nbsp;[LOGIN]</TD>
  </TR>
</TABLE>
</TD>
</TR>
<TR>
<TD valign="top" height="100%">
<TABLE cellspacing="3" cellpadding="3" width="901" border="0">
  <TR>
    <TD class="toppane" colspan="6" id="TopPane" runat="server" valign="top" align="center" width="885"></TD>
  </TR>
  <TR valign="top">
    <TD class="leftpane" id="LeftPane" runat="server" valign="top" ></TD>
    <TD class="contentpane" id="ContentPane" runat="server" valign="top" align="center"></TD>
    <TD class="contentpane2" id="ContentPane2" runat="server" valign="top" align="center"></TD>
    <TD class="contentpane3" id="ContentPane3" runat="server" valign="top" align="center"></TD>
    <TD class="contentpane4" id="ContentPane4" runat="server" valign="top" align="center"></TD>
    <TD class="rightpane" id="RightPane" runat="server" valign="top" ></TD>
  </TR>
  <TR>
    <TD class="bottompane" colspan="6" id="BottomPane" runat="server" valign="top" align="center" width="885"></TD>
  </TR>
</TABLE>
</TD>
</TR>
<TR>
<TD valign="top">
<TABLE class="skingradient" cellSpacing="0" cellPadding="0" width="100%" border="0">
  <TR>
    <TD valign="middle" align="center">[COPYRIGHT]&nbsp;&nbsp;[TERMS]&nbsp;&nbsp;[PRIVACY]</TD>
  </TR>
</TABLE>
</TD>
</TR>
<TR>
<TD valign="top" align="center">[DOTNETNUKE]</TD>
</TR>
</TABLE>
</TD>
</TR>
</TABLE>
</BODY>
</HTML>

CSS

/*
================================
Skin styles for DotNetNuke
================================
*/  

.pagemaster {
 width: 100%;
 height: 100%; 
 background-color: #fefefe;
}
.skinmaster {
 height: 100%;
 background-color: #eeeeee;
 border-right: #8f9092 1px solid;
 border-top: #8f9092 1px solid;
 border-left: #8f9092 1px solid;
 border-bottom: #8f9092 1px solid;
 -moz-border-radius-bottomleft: 15px;
 -moz-border-radius-bottomright: 15px;
 -moz-border-radius-topleft: 3px;
 -moz-border-radius-topright: 3px;
}
.skinheader {
}
.skingradient {
 background-image: url('gradient_DKGray.jpg');
 height: 25px
}
.controlpanel {
 width: 100%;
 background-color: #fefefe;
}
.toppane {
 width: 100%;
 background-color: transparent;
 padding-left: 6px;
 padding-right: 4px;
 padding-top: 6px;
}
.leftpane {
 width: 10%px;
 background-color: transparent;
 padding-left: 6px;
 padding-right: 4px;
 padding-top: 6px;
}
.contentpane {
 width: 25%;
 background-color: transparent;
 padding-left: 6px;
 padding-right: 4px;
 padding-top: 6px;
}
.contentpane2 {
 width: 25%;
 background-color: transparent;
 padding-left: 6px;
 padding-right: 4px;
 padding-top: 6px;
}
.contentpane3 {
 width: 25%;
 background-color: transparent;
 padding-left: 6px;
 padding-right: 4px;
 padding-top: 6px;
}
.contentpane4 {
 width: 25%;
 background-color: transparent;
 padding-left: 6px;
 padding-right: 4px;
 padding-top: 6px;
}


.rightpane {
 width: 10%;
 background-color: transparent;
 padding-left: 6px;
 padding-right: 4px;
 padding-top: 6px;
}
.bottompane {
 width: 100%;
 background-color: transparent;
 padding-left: 6px;
 padding-right: 4px;
 padding-top: 6px;
}
.main_dnnmenu_container {
 background-color: transparent;
}
.main_dnnmenu_bar {
 cursor: pointer;
 cursor: hand;
 height:16px;
 background-color: Transparent;
}
.main_dnnmenu_item td { /*TD if menu option for using tables is on*/
 cursor: pointer;
 cursor: hand;
 color: #000000;
 font-size: 9pt;
 font-weight: bold;
 font-style: normal;
 background-color: Transparent;
 font-family: Tahoma, Arial, Helvetica;
        white-space: nowrap;  /*Word wrapping menu item now optional*/ 
        padding: 1px 3px 3px 1px; 
}

.main_dnnmenu_rootitem  { /*TD if menu option for using tables is on*/
 cursor: pointer;
 cursor: hand;
 color: #000000;
 font-size: 9pt;
 font-weight: bold;
 font-style: normal;
 background-color: Transparent;
 font-family: Tahoma, Arial, Helvetica;
    white-space: nowrap;  /*Word wrapping menu item now optional*/    
    padding: 0px 12px 0px 5px;   /*explicitly set padding for root menu items*/
}

.main_dnnmenu_itemhover { 
 background-color: #aaaaaa;
}

.main_dnnmenu_itemhover td { 
 background-color: #aaaaaa;
}


.main_dnnmenu_icon {
 cursor: pointer;
 cursor: hand;
 text-align: center;
 width: 15px;
 height: 100%;
}
.main_dnnmenu_submenu {
 background-color: #cccccc; 
 z-index: 1000;
 cursor: pointer;
 cursor: hand;
 filter:progid:DXImageTransform.Microsoft.Shadow(color='#696969', Direction=135, Strength=3);
 padding: 1px 1px 1px 1px;   /*explicitly set padding for sub-menus */
}
.main_dnnmenu_break {
 height: 1px;
 font-size: 1px;
}

.main_dnnmenu_arrow {
 border-right: #cccccc 1px solid;
 border-bottom: #cccccc 1px solid;
 border-top: #cccccc 0px solid;
 font-family: webdings;
 font-size: 10pt;
 cursor: pointer;
 cursor: hand;
}
.main_dnnmenu_rootmenuarrow {
 font-family: webdings;
 font-size: 10pt;
 cursor: pointer;
 cursor: hand;
}
.StandardButton {
   background: #aaaaaa none;
   color: #ffffff;
   font-family: Verdana, sans-serif;
   font-size: 11px;
   font-weight: normal;
}
.Head {
   font-family: Tahoma, Arial, Helvetica;
   font-size:  18px;
   font-weight:  normal;
   color: #333333;
}

/* change color of default link */
a:link, a:visited, a:active {
    color: #800000;
    font-family: tahoma;
    font-weight: normal;
    font-size: 11px;
    text-decoration: underline;
}

Art is hard work, inspiration is the cream on top of it. See my watercolors at www.watermansite.com and my enamel art at www.watermanshop.com
 
New Post
12/17/2007 7:02 AM
 
michael_626

Joined: 4/14/2007
Posts: 39

Why would u want to do that when their is already a gallery module
 
 Page 1 of 2
12Next 
Previous
 
Next
HomeHomeUsing DNN Platf...Using DNN Platf...Skins, Themes, ...Skins, Themes, ...need a little help with a skin with 5 contentpanesneed a little help with a skin with 5 contentpanes


These Forums are dedicated to discussion of DNN Platform and Evoq Solutions.

For the benefit of the community and to protect the integrity of the ecosystem, please observe the following posting guidelines:

  1. No Advertising. This includes promotion of commercial and non-commercial products or services which are not directly related to DNN.
  2. No vendor trolling / poaching. If someone posts about a vendor issue, allow the vendor or other customers to respond. Any post that looks like trolling / poaching will be removed.
  3. Discussion or promotion of DNN Platform product releases under a different brand name are strictly prohibited.
  4. No Flaming or Trolling.
  5. No Profanity, Racism, or Prejudice.
  6. Site Moderators have the final word on approving / removing a thread or post or comment.
  7. English language posting only, please.
What is Liquid Content?
Find Out
What is Liquid Content?
Find Out
What is Liquid Content?
Find Out