Products

Solutions

Resources

Partners

Community

Blog

About

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, ...Creating CSS pages in Dreamweaver, for DNN - Help!Creating CSS pages in Dreamweaver, for DNN - Help!
Previous
 
Next
New Post
7/7/2008 8:18 AM
 

Hi all,

Hope someone can show me to the right direction. Basically, I need to do web pages in DNN, but the learning curve is quite tough, coz the way I understand DNN is that it's complicated! There are just too many folders nested and finding the right one to manipulate what is frustrating :(

Well anyways, is it possible to just do the pages in dreamweaver / css, then upload the pages in the dot net nuke framework? How do I go about this? Any help will be appreciated thanks!

 
New Post
7/7/2008 3:04 PM
 

well - you can indeed use a simple skin with just a menu and a big content pane for all your content. then add text/html module to the big content pane. upload the images you are going to use. then click on source. copy and paste it into your dremweaver, style it and then upload it back to the text/html module.

That way you can have very fine control on the content that goes in. much more than what you could do with the basic text/html module styling.

Anyway I assume this is what you are trying to do as otherwise there would not be a need to use a CMS system like DNN you might as well do the whole site in Dreamweaver and upload it to the traditional type hosting company.

Salar

 

 
New Post
7/7/2008 4:22 PM
 

I actually use Dreamweaver in my development of skins, however it's not for the actual creation of the pages. Keep in mind that with a CMS like DNN all the pages' content is stored in a database and retrieved and displayed through DNN.  You shouldn't have to be going into any subfolders once DNN is installed beside the skin folder which is usually located in DOMAIN.COM/wwwroot/Portals/_default/SKIN_NAME   (if uploaded via Host Menu) or DOMAIN.COM/wwwroot/Portals/0/SKIN_NAME.

When I'm developing, usually I start out with a very basic skin design and upload it with a bare-minimum CSS file, then I just edit the CSS file directly on the server while refreshing the page to see the results real-time. However, you want to be VERY careful doing this with the .ASCX files.

In all honesty, the learning curve of DNN is relatively simple. It is however very different from the classic approach of static webpage design as it seems you are referring to where you edit a copy locally and upload it to the server. The good news is that once you take the time to learn DNN, it makes your life far more simple. If given all the content, I can quite easily put out a 10-20page DNN site in half the time it took me to create a static version. Add to that the sheer number of VERY useful modules (Photo Galleries, Dynamic Feedback forms, Property Agent by Ventrian, the list goes on and on) and you have a substantial platform for rolling out some very high-function websites for very little time invested.

~SB


Wells Doty Jr
Online Content Development
 
New Post
7/7/2008 10:20 PM
 

Thank you Salar and SB for the replies.

Perhaps the reason why I find DNN complicated is that it looks more like a developer's tool, and I am more of a designer and my coding skills are quite basic. You are right, I am more used to editing the pages locally on my pc then upload it into the server for testing.

To explain more of my predicament, this is the folder structure that I am currently working on: domain\wwwroot\projectname\Portals\_default\Skins\skinname. Within this folder, I have also created a few other folders like css, images, and scripts. In the root of skinname folder are the ascx files, so overall much like the structure I use when developing locally. This is where I am experiencing difficulty, like why do I only edit  [index ver 1.ascx] with tagprefix and tagname/src codes loading in a bunch of other stuff depending on the IDs / includes that need to be loaded in. Is it not possible to just upload several ascx files like (eg) index, about, news, etc?

The project requirement is to skin all the modules in CSS with no tables. Is there a way to do it? Not sure how to go about copying and pasting the viewed source code because as far as i can understand modules for DNN are already compiled into a DLL file that DNN loads up and uncompiles itself. Hope I am making sense here...

Cocoy

 
New Post
7/8/2008 11:38 AM
 

Well, I think I see your problem. First, skins cannot be edited in the directory as you have described.  Remember that this is a content management system which separates your content and design from one another. I would strongly reccomend downloading the skinning documentation for DNN as well as pick up a copy of DotNetNuke for Dummies (ISBN# 978-0-471-79843-9)   (no insult meant, it's just a handy book to have, and explains everything far better than I can).

Think of setting up a DotNetNuke site as a process:

  1. Design and package the skin.
  2. Upload the skin
  3. Apply the skin (site wide or on a per-page basis)
  4. Add modules (usually the Text/HTML module for standard content)
  5. Add content into the modules
  6. Proofread, browser check, and perform any last-minute checks

Now, in designing the skin, I usually start in Dreamweaver myself. I create a project folder on my development drive named according to the domain (i.e. \example.com ). Within that folder, I create two sub folders, one for the skin, one for the container.  (i.e.   \example-skin    and   \example-container )

Within the skin folder I setup the following files:

  • skin.html
  • skin.css
  • skin.xml
  • skin.doctype.xml

Within the container folder I setup:

  • container.html
  • container.css
  • container.xml

Each of these I populate with code snippets I have gleaned from these forums as well as from reverse-engineering the skins that come default with DNN. Then I begin transferring my design from Photoshop into the skin.html file, making sure to fit in a [LOGIN] and [MENU] token as well (not to mention the code for the content panes which I'll list below). I don't neccesarily spend too much time on the CSS at this point, other than to assign classes and such. Once I feel confident in the skin, I zip up all the files in the skin directory and the upload the ZIP file to the DNN site via Host -> Skins. Once the skin is applied, I begin editing the CSS file directly on the server ( \wwwroot\Portals\_default\Skin_name  usually for me) and keeping a browser open to watch the changes as they are applied.

A similar procedure is used for the containers, and once everything is settled with the overall design I move on to the content phase where I start copying in all the client's data and making sure it formats correctly. I try to make sure everything uses the .Normal class or the major HTML tags: P, H1-5, etc. that way I can easily change the appearance via the CSS.

Now, I'm sure this is a LOT to wrap your head around, it was for me when I first approached it all myself. You may be thinking "Why all this effort for something I can just knock out in Dreamweaver the old way, what's the use?"  Well, consider this: if you have several hundred sites that you manage and you're constantly adding new clients to your roster, there comes a time when the change requests can become overwhelming. Back when I was still using a static system like you are used to, I could barely get a project rolled out on time while still processing all the minor change-orders for my other clients. Now, imagine that you can give that customer limited access so that when they feel like it, they can access and edit the content of their website with under 1hr of training (if they can use a webmail system, they can use DNN). Well, that one aspect alone has made my life far simpler by a factor of 10. Add to the fact that when the customers don't want to handle their own updates, I can still handle them here except the process is much MUCH more simple and fast for me.

Now, add to the equation that when I was working in the old "upload the local copy" system, if I wanted a Photo Gallery, Blog Module, or dynamic feedback form, I had to scour many places and often find only a smattering of decent programs to do this, however getting my SysAdmin to evaluate and install these solutions was a royal pain in the arse. With DNN, the modules are easy to find and there are quality solutions for practically every need and are reasonably priced. If there's a need you come across that isn't filled, there is an ARMY of DNN Developers who love challenges and are very good at what they do.

 

Now, regarding the no-tables bit you mentioned.  Yes, it can be done, however it is my experience that it adds another layer of complexity to the production of the skins and modules, also some modules aren't designed to output in Pure CSS which will result in a broken look on a pure-css skin.

My reccomendations to you:

  1. Download the DotNetNuke Skinning Guide (Link)
  2. DotNetNuke for Dummies (ISBN 978-0-471-79843-9)  - not an insult, I have a copy sitting next to me. It's very handy for helping you wrap your head around the baic concepts.
  3. Pick up a subscription to DNNCreative, they have a GREAT series of downloadable video tutorial including a set on desining and implementing Pure CSS skins / modules.
  4. Once you're more comfortable with the idea of CMSs and DNN as a whole, check out "Beginning DotNetNuke Skinning and Design" by Andrew Hay and Shaun Walker (ISBN 978-0-470-10963-2)
  5. Read through and participate on the forums, these are one of, if not the largest resource DNN has going for it.

Good Luck!

~SB


Wells Doty Jr
Online Content Development
 
Previous
 
Next
HomeHomeUsing DNN Platf...Using DNN Platf...Skins, Themes, ...Skins, Themes, ...Creating CSS pages in Dreamweaver, for DNN - Help!Creating CSS pages in Dreamweaver, for DNN - Help!


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