Add any comments or questions regarding the DotNetNuke ASCX Skinning for Professional Skinners tutorial from issue 46

please give me tutorials dotnetnuke

Hello,

To access the tutorials you need to subscribe to the website, you can do this here:
http://www.dnncreative.com/Subscrib...fault.aspx 

and this will then give you access to all of the videos on the website, thanks,

 

Hi Lee, I just watched my first video tutorial (issue #46) and all I can say is WOW...what a great resource! Your style of teaching is perfect for me...not too fast and not too assuming. Great job! I can't wait to watch the previous videos.

One question about this tutorial: I have Visual Studio 2008 Standard Edition and would have thought that the pop-up elements would have appeared like they do with VWD Express, but they don't. Is there something that needs to be turned on in VS to see the elements available to me when editing the ASCX files?

Thanks again for this hard work you're doing.

David

hello,

Glad to hear you have found the tutorials useful, that's always good to hear!

I would also assume that visual studio 2008 Standard Edition would do this instantly, but I do not have a copy to test. Did you open the website at the root of your DotNetNuke installation files? - if you open it for example in your skins folder it will not work.

Thanks,

Just wanted to drop a line to mention how excited I was to see this month's lead topic was on skinning with the ASCX method! I was just thinking it was about time for me to get into it as well. So anyhow I devoured those vids and am hungry for more. Will there perhaps be a continuation on the subject?

- Loren in Honolulu

Hello,

Glad to hear the tutorials were useful, is there anything in particular that you would like covering?

Have you checked out the other skinning tutorials we have already created, there is a long list if you scroll down on this page:
http://www.dnncreative.com/Tutorial...fault.aspx


I would suggest having a look at these to get you started:

• How to create a pure CSS skin
• How to create CSS containers

• Reducing the DotNetNuke CSS file sizes
• Introduction to CSS and inheritance in DotNetNuke skins
• Semantic Code and Header Tags in DotNetNuke Skins

Troubleshooting DotNetNuke Skins

• Pure CSS SEO Layouts for DotNetNuke skins
• Multiple skin layouts using skinname.css
• How to create a DotNetNuke CSS skin from an XHTML template – part 1
• How to create a DotNetNuke CSS skin from an XHTML template – part 2
• How to style and skin the search box in DotNetNuke

When building the skin, you register the skinobject controls once for each time you use the skinobject in your ascx file e.g. in the tutorial you register the dnn menu twice for two instances of the menu. Is it possible to just register the menu once and then use it twice by changing giving the second instance a different id only e.g. dnnMenu1, dnnMenu2.

Yes, I have seen almost all of those videos actually. I originally signed up to DNN Creative to learn more about skinning in particular, and your videos have been an invaluable resource! I believe these were the first ones to specifically focus on ASXC skinning though, no?

I suppose anything that falls under the category of "advanced skinning techniques" would be of interest to me. Just off the top of my head I might like to learn more about:

The DNNMenuNavigationProvider
I get the feeling I don't know the full capabilities of the default DNNMenuNavigationProvider. I know you like the HouseMenu (I've used it on a couple projects too -- it is nice), but nonetheless would be interested in doing some fancy things with the default menu. Isn't it a bit better than the SolPartMenu was? And maybe it can do some things the HouseMenu can't do?

jQuery
Maybe something about using jQuery to make photo slideshows or tabbed content within the text/html module?

Well anyway I'm what you'd call a 'satisfied' customer. I really do appreciate all your hard work and look forward to each issue. Thanks.

Hello,

I've just checked that out and yes you can as long as you have a different id.

Thanks,

I'm looking at the NavMenu for issue 47 ;-)

I thank you BIG TIME for the PDF version, I think I would have lost the will to learn about aspx if it wasn't for that option.

It wasn't a good surprise to see that I had to download all the videos in one file (over 334 MB Flash format zipped) and encounter 84 MBs of files for Video 1. Downloading the WMF files is smaller but still over 115MB. That seems to be about 3 times the file size of earlier files. If it's at all possible, please go back to one video per tutorial and reduce the file size.

Its not possible to reduce the file size, but I would suggest you download wmvs because they are much smaller. I placed all of the videos into 1 zip file as other people have requested that they find it frustrating extracting all of the zips. Why don't you like downloading larger files I thought this would save you time?

 I guess I could go back to the single download per video, but I would welcome anyone else's thoughts first, thanks,

Hi,

i use the navmenu on top and on the left side. I found how to link the topmenu with the leftmenu as child.
But how can i force the menu on the left to show all menu items.

current situation

On top
                         MenuItem1  MenuItem2 MenuItem3  MenuItem4

menusubitem1a - subsub1 (Expand if you the cursor moves over menusubitem1a)
                          - subsub2
menusubitem1b
menusubitem1c
menusubitem1d


situation i want

On top
                         MenuItem1  MenuItem2 MenuItem3  MenuItem4

menusubitem1a
    - subsub1
    - subsub2
menusubitem1b
    - subsub1
    - subsub2
    - subsub3
    - subsub4
menusubitem1c
    - subsub1
menusubitem1d

hello try this:

<!--[if gte mso 9]> Normal 0 unctuationKerning/> false false false oNotPromoteQF/> EN-GB X-NONE X-NONE ontGrowAutofit/> ontVertAlignCellWithSp/> ontBreakConstrainedForcedTables/> ontVertAlignInTxbx/> <!-- /* Font Definitions */ @font-face {font-family:"Cambria Math"; panose-1:2 4 5 3 5 4 6 3 2 4; mso-font-charset:0; mso-generic-font-family:roman; mso-font-pitch:variable; mso-font-signature:-1610611985 1107304683 0 0 415 0;} @font-face {font-family:Verdana; panose-1:2 11 6 4 3 5 4 4 2 4; mso-font-charset:0; mso-generic-font-family:swiss; mso-font-pitch:variable; mso-font-signature:-1593833729 1073750107 16 0 415 0;} /* Style Definitions */ p.MsoNormal, li.MsoNormal, div.MsoNormal {mso-style-unhide:no; mso-style-qformat:yes; mso-style-parent:""; margin:0cm; margin-bottom:.0001pt; mso-pagination:widow-orphan; font-size:10.0pt; mso-bidi-font-size:12.0pt; font-family:"Verdana","sans-serif"; mso-fareast-font-family:"Times New Roman"; mso-bidi-font-family:"Times New Roman";} .MsoChpDefault {mso-style-type:export-only; mso-default-props:yes; font-size:10.0pt; mso-ansi-font-size:10.0pt; mso-bidi-font-size:10.0pt; mso-ascii-font-family:Verdana; mso-hansi-font-family:Verdana; mso-ansi-language:EN-US; mso-fareast-language:EN-US;} @page Section1 {size:612.0pt 792.0pt; margin:72.0pt 72.0pt 72.0pt 72.0pt; mso-header-margin:36.0pt; mso-footer-margin:36.0pt; mso-paper-source:0;} div.Section1 {page:Section1;} --> <!--[if gte mso 10]> ForceDownLevel="True"

That doesn't work with DNNMenuNavigatorProvider.
See: DNN Navigation controls - page 19

Did you try the setting out? It works in my menu, there are a couple of attributes in that doc which appear to be not correctly documented.

i already tried it. But it doesn't do anything.

This is my head menu:

                <dnn:nav runat="server" id="NAV_Top" providername="DNNMenuNavigationProvider" indicatechildren="false">
                    ControlOrientation="Horizontal" CSSControl="mainMenu" CSSNodeSelectedRoot="MenuRootItemSelected"

                    ExpandDepth="0" StartTabId="-1" PopulateNodesFromClient="false" ForceDownLevel="false"

                    ForceCrawlerDisplay="false" />
           

and this is the child menu:
 
                <dnn:nav runat="server" id="NAV_Left" providername="DNNMenuNavigationProvider" indicatechildren="false">
                    ControlOrientation="Vertical" CSSNodeSelectedSub="MenuSubItemSelected" CSSControl="childMenu"

                    Level="Child" ForceCrawlerDisplay="true" PopulateNodesFromClient="true">
                   
                        
                   
               
           

if i click on a childmenu my menu disappear (span is not visible i think)
see: www.placidus.be

Any idea why the child menu disappear when i click on one item (from the submenu)?

You may want to check out this tutorial which is in the next issue 47:

DotNetNuke NAV Menu

In particular Videos 10 and 11 which deal with 2 menus on a page.

1Pane_main.ascx  I have viewed video 4 twice now. I have not done the tutorial yet so that may answer my question.

How does 1pane_main.ascx know that it is hooked up to 1pane_main.css? Is it the naming convention

Thanks
Dennis

Hello,

Yes that is correct, if you add in a CSS file that is the same name as the skin.ascx or skin.htm file, DotNetNuke will then call in that CSS file only for that skin.

We covered how to do this in an earlier tutorial here:
Multiple skin layouts using skinname.css

Thanks,

wow, please don't go back to 1 video per zip.  It is so much easier to download once.  I suppose if one had a very slow connection it might be a problem but down loading each file independently is exceptionally time consuming and labor intensive.

BTW - I loved this issue.

Thanks for the feedback Rick,

Hi Lee, Im trying to work out how to change the color of the background down the left & right sides of the 1024 width skin? Am using 05.01.00 (773)Community Edition. Is this covered in one of your tutorials? Keep up the great work!

Do you want to change the background color outside of the content panes, or in them?  Which skin?

Basically, you'll want to locate the object, and then change it's color in the CSS.  Have you taken a look at Troubleshooting DotNetNuke Skins?  The Web Developer's Toolbar is a handy tool you can use to identify parts of the page.

Hi & Thanks for your post. Outside the contents panes. Im using dnn 5 & the 1024 standard skin that I have modified.

Hi, Turns out is #Body { background: #cad2d4 repeat-x top left; height: 100%; margin: 0; padding: 0; } in the skin.css file. in my case i removed the url link to the image & chnaged the color & BINGO !! I wouldnt have been able to go close to working this out had it not been for Lee's skinning & nav menu tutorials. Thanks so much DNN Creative

Hi,

I am also having trouble using the pop-up feature only with Visual Web Developer 2008 Express Edition. This feature works on the HTML tags but not on the skin objects.

Folders such as Admin and Portal are at the first level in the VWD explorer, so I must have opened up the web at the DNN root. I am using standard IIS 5.1.

Where does VWD find the references to the skin object attributes?

By the way, I love your videos! Thanks.

Could you ask the question differently?  I'm not sure what the pop-up feature you are asking about is.

<!--[if gte mso 9]> fficeDocumentSettings> oNotRelyOnCSS/> ixelsPerInch>72ixelsPerInch> 1920x1200 fficeDocumentSettings> <!--[if gte mso 9]> Normal 0 unctuationKerning/> false false false oNotPromoteQF/> EN-US X-NONE X-NONE ontGrowAutofit/> ontVertAlignCellWithSp/> ontBreakConstrainedForcedTables/> ontVertAlignInTxbx/> oNotOptimizeForBrowser/> <!-- /* Font Definitions */ @font-face {font-family:"Cambria Math"; panose-1:2 4 5 3 5 4 6 3 2 4; mso-font-charset:1; mso-generic-font-family:roman; mso-font-format:other; mso-font-pitch:variable; mso-font-signature:0 0 0 0 0 0;} @font-face {font-family:Calibri; panose-1:2 15 5 2 2 2 4 3 2 4; mso-font-charset:0; mso-generic-font-family:swiss; mso-font-pitch:variable; mso-font-signature:-1610611985 1073750139 0 0 159 0;} /* Style Definitions */ p.MsoNormal, li.MsoNormal, div.MsoNormal {mso-style-unhide:no; mso-style-qformat:yes; mso-style-parent:""; margin:0in; margin-bottom:.0001pt; mso-pagination:widow-orphan; font-size:11.0pt; font-family:"Calibri","sans-serif"; mso-ascii-font-family:Calibri; mso-ascii-theme-font:minor-latin; mso-fareast-font-family:Calibri; mso-fareast-theme-font:minor-latin; mso-hansi-font-family:Calibri; mso-hansi-theme-font:minor-latin; mso-bidi-font-family:"Times New Roman"; mso-bidi-theme-font:minor-bidi;} span.EmailStyle15 {mso-style-type:personal; mso-style-noshow:yes; mso-style-unhide:no; mso-ansi-font-size:11.0pt; mso-bidi-font-size:11.0pt; font-family:"Calibri","sans-serif"; mso-ascii-font-family:Calibri; mso-ascii-theme-font:minor-latin; mso-fareast-font-family:Calibri; mso-fareast-theme-font:minor-latin; mso-hansi-font-family:Calibri; mso-hansi-theme-font:minor-latin; mso-bidi-font-family:"Times New Roman"; mso-bidi-theme-font:minor-bidi; color:windowtext;} .MsoChpDefault {mso-style-type:export-only; mso-default-props:yes; mso-ascii-font-family:Calibri; mso-ascii-theme-font:minor-latin; mso-fareast-font-family:Calibri; mso-fareast-theme-font:minor-latin; mso-hansi-font-family:Calibri; mso-hansi-theme-font:minor-latin; mso-bidi-font-family:"Times New Roman"; mso-bidi-theme-font:minor-bidi;} @page Section1 {size:8.5in 11.0in; margin:1.0in 1.0in 1.0in 1.0in; mso-header-margin:.5in; mso-footer-margin:.5in; mso-paper-source:0;} div.Section1 {page:Section1;} --> <!--[if gte mso 10]> Joseph,

I guess I wasn't that clear.  I'll start over:

I generally use Dreamweaver to create my skins but based on Lee's video, I decided to try Visual Web Developer Express 2008. I did this because of its Intellisense feature that supports skin objects. I followed his instructions and opened a web site at my local DNN root.

 

The problem is that even though I have Intellisense for the html tags, I have no Intellisense for the skin objects.

 

I can’t remember where VWD references the Intellisense data to support the skin objects. Do I have to install the source version of DotNetNuke for this feature to work or are the references at the top of the skin page all that is needed? I used the install version of DotNetNuke. Thanks.

 

Regards,

Fred

Hello,

I used an install version of DotNetNuke for the tutorial, not the source version, so it should work.

As long as you open the website at the root of your installation and then open the .ascx skin files intellisense should work.

Thanks,