You need to Register for free and Login to post a message in the forum.

Forum

Subject: Assign a css id to a module.
Prev Next
You are not authorized to post a reply.

Author Messages
corourke
DNN Creative Magazine Subscriber
Nuke Newbie
Nuke Newbie
Posts:4

20 May 2008 3:58 PM  
For all I know there could already be a module that does this but it would be fantastic if under advanced settings there was the ability to tell a text/html or any other module to use a specific class or id without digging into skin files.

For example if I wanted a text/html module to float right I'd just update the skin.css and then under advanced properties type in the name of the id or class.

The attached image shows what I mean a bit better.





jncraig
DNN Creative Staff
Nuke Master II
Nuke Master II
Posts:2157

20 May 2008 8:54 PM  
Use the Header and Footer of the advanced module settings to wrap a div tag around the module, and specify the css class to be used.

Joe Craig
DNN Creative Support
Subscribe to the website
corourke
DNN Creative Magazine Subscriber
Nuke Newbie
Nuke Newbie
Posts:4

21 May 2008 11:09 AM  
That's what I've been doing so far however that adds extra divs which isn't the most semantic way to do things. By adding the ability to specify a specific css class or id for a module you can clean up and speed up the site as well speed up development time.
jncraig
DNN Creative Staff
Nuke Master II
Nuke Master II
Posts:2157

22 May 2008 7:58 AM  
I agree. Why don't you make that suggestion at dotnetnuke.com.

Joe Craig
DNN Creative Support
Subscribe to the website
corourke
DNN Creative Magazine Subscriber
Nuke Newbie
Nuke Newbie
Posts:4

22 May 2008 10:53 AM  
Thanks for the suggestion jncraig. I've made the suggestion: http://support.dotnetnuke.com/issue/ViewIssue.aspx?id=7658&PROJID=23

jncraig
DNN Creative Staff
Nuke Master II
Nuke Master II
Posts:2157

22 May 2008 11:14 PM  
Great. The whole community gains when people make suggestions.

Joe Craig
DNN Creative Support
Subscribe to the website
leesykes
DNN Creative Staff
Nuke Master III
Nuke Master III
Posts:3112

23 May 2008 7:50 AM  
Each module does already have a unique ID assigned to it.

For instance, go to: http://www.dnncreative.com/tabid/75/Default.aspx

Using the web developers toolbar go to the Information menu / Display ID & Class Details

From here you can see the main Text / HTML module has a unique ID of #dnn_ctr380

There are various variations of this ID, you will be able to view:

#dnn_ctr380_contentpane .dnnC_content_transparent DNNAlignleft
#dnn_ctr380_ModuleContent
#dnn_ctr380_HtmlModule_lblContent .Normal

We can target the main content area of the Text / HTML module with:

#dnn_ctr380_contentpane
{
border: 10px solid orange;
}


Lee Sykes
Site Administrator
Subscribe to the website : DotNetNuke Video Tutorials : The Skinning Toolkit : DotNetNuke Podcasts
leesykes
DNN Creative Staff
Nuke Master III
Nuke Master III
Posts:3112

23 May 2008 7:51 AM  
For further info on the web Developers Toolbar view:Troubleshooting DotNetNuke Skins

Lee Sykes
Site Administrator
Subscribe to the website : DotNetNuke Video Tutorials : The Skinning Toolkit : DotNetNuke Podcasts
corourke
DNN Creative Magazine Subscriber
Nuke Newbie
Nuke Newbie
Posts:4

23 May 2008 1:00 PM  
I'm a huge fan of the web developers toolbar. The problem is those unique identifiers are too unique since the unique id's are assigned dynamically as you add modules to a page giving you much more extra work in the backend customizing your aspx files rather than letting you use a minimal amount of divs and styles.

If I wanted to style the top left text/html module on all of my pages without rewriting the module or adding extra divs I'd need something like:

#dnn_ctr408_ContentPane { background: #e3e3e3; float:left; width: 165px; }
#dnn_ctr409_ContentPane { background: #e3e3e3; float:left; width: 165px; }
#dnn_ctr410_ContentPane { background: #e3e3e3; float:left; width: 165px; }
#dnn_ctr411_ContentPane { background: #e3e3e3; float:left; width: 165px; }
#dnn_ctr412_ContentPane { background: #e3e3e3; float:left; width: 165px; }

and on and on depending on the number of pages I have in my site.

However if I can assign an id or class of my own choosing then I'd only need to add "#TopLefttextbox" and it would work on all of my pages.

The way the current method is there's no real intrinsic difference I can see between the old preCSS method of every element having font tags and background colors as part of the source rather than the current css method of abstracting layout completely from the source code.
leesykes
DNN Creative Staff
Nuke Master III
Nuke Master III
Posts:3112

03 Jun 2008 4:41 AM  
Yes for multiple instances the unique ID method will not be suitable, but for one off styling it is very useful.

the method I currently use is to specify elements in special containers. - this way if you need a "float right" div adding to a text HTML module, you can do it by simply using that container on the module,  so you no longer have the problem of multiple entries of code.

But, it still won't be as simple as the idea you have mentioned,  it will be interesting to see if it is implemented, thanks,

Lee Sykes
Site Administrator
Subscribe to the website : DotNetNuke Video Tutorials : The Skinning Toolkit : DotNetNuke Podcasts
You are not authorized to post a reply.
Forums > DotNetNuke® > Modules - What's needed? > Assign a css id to a module.



ActiveForums 3.7

Latest Forum Posts

News&Articles Module by gabrieleseven
Hello, I've created a Portal for news and info about the world of music. I need a module that allow ...
RE: Install DNN.4 on Win 2003 and SQL2000 by jncraig
1. Add a portalalias for your new site's URL before you do anything. 2. Make a backup of your dat...
RE: Custom Module Development by jncraig
I would recommend adefwebserver.com for good information on writing modules. Without looking over...
RE: Dynamic page navigation by jncraig
I take it that you have developed 10 separate pages? Are these pages with a custom module or with c...
RE: Pop up window by jncraig
I believe that ZLDNN (zldnn.com) has a module that will pop up a page or a module. I've not tried i...
Dynamic page navigation by coder247
Hi all,          We are developing a web app using DNN and we've a requirement like this. There are ...
Custom Module Development by neenu
I created my own module using DAL,by adding 4 class files in app_code directory, say alistinfo.vb,al...
Pop up window by yerann
Whenever a page loads in DNN i would like a pop up window to display.  This pop window ask the user ...
RE: Customise registration page by nichord
Thanks Rob... I would have never found this one on my own.And many thanks to you Lee... My print com...
Install DNN.4 on Win 2003 and SQL2000 by amine97
Hi all,I will be working on creating a website on my development server Windows 2003 and SQL Server ...
RE: Dynamically Add modules by jncraig
You can include a module on multiple pages within a portal by selecting "add existing module" on the...
music player, music charts by mrvorazan
hey,i havev to create a music portal, so i need a module to upload music files by users, they have t...
Dynamically Add modules by UmaRam
Hi, Please advice how to add an existing module in a page to another page in the same portal and ...
Dynamically add module by UmaRam
Hi, Please advice how to add an existing module in a page to another page in the same portal and ...
RE: VWD 2008 & SQL Express 2008? by rc_kemal
It is very difficult to convert the database from sql2008 express to sql2005 express. To answer my o...
RE: User Registration Questions by jncraig
I would recommend that you NOT begin your DotNetNuke life by starting to modify any of the code. Ye...
RE: Dotted Lines Around Navigation by HUGHD37IUOE
Here it is: http://www.iuoe.org
RE: Installing on XP Home by nexduke
Hi Yes, I'm using SQL Server Express 2005, what would you suggest I do if it is a configuaration ...
RE: Exporting and transferring Modules. by ollep
Thanks Lee! Yes I will check out the Forum – and the hosts before I sign up.   I expect to see an...
User Registration Questions by stevennestler
Hi.I'm new to DNN, and just watched my first set of videos on this site, for customizing registratio...
AppTheory
RSS Feeds