Default Joomla 1.5 CSS Classes and IDs

Discuss the development and implementation of Joomla! 1.0.x templates here.

Moderator: General Support Moderators

Forum rules
Forum Rules
Absolute Beginner's Guide to Joomla! <-- please read before posting, this means YOU.
Locked
User avatar
Waseem Sadiq
Joomla! Ace
Joomla! Ace
Posts: 1441
Joined: Mon Sep 12, 2005 7:41 pm
Location: Glasgow - Scotland
Contact:

Default Joomla 1.5 CSS Classes and IDs

Post by Waseem Sadiq » Mon Aug 13, 2007 5:10 pm

Hi folks,

We have a list somewhere of the default FRONTEND classes and ids in Joomla 1.0.x (I know because I compiled the list :) ) but we didn't have an up to date version for Joomla 1.5 - so I made one to share with the community.

The following is an exhaustive list (I hope, if anyone notices any omissions please let me know and I'll update the list) of all FRONTEND CSS classes and ids which are hard-coded into the Joomla 1.5 core.

Code: Select all

/*Frontend*/
/* FILE:     components\com_contact\views\category\tmpl\default.php */
div.componentheading
div.contentpane
div.contentdescription
td.sectiontablefooter
td.sectiontableheader

/* FILE:     components\com_contact\views\category\tmpl\default_items.php */
a.category
td.sectiontableentry1
td.sectiontableentry2

/* FILE:     components\com_contact\views\contact\tmpl\default.php */
form#selectForm
div.componentheading
table.contentpane
td.contentheading

/* FILE:     components\com_contact\views\contact\tmpl\default_form.php */
form#emailForm
input#contact_name
label#contact_emailmsg
input#contact_email
input#contact_subject
label#contact_textmsg
textarea#contact_text
input#contact_email_copy
form.form-validate
div.contact_email
input.inputbox
input.required
input.validate-email
textarea.inputbox
textarea.required
button.button
button.validate

/* FILE:     components\com_content\helpers\icon.php */
span.hasTip

/* FILE:     components\com_content\models\article.php */
hr#system-readmore

/* FILE:     components\com_content\views\archive\tmpl\default.php */
form#jForm
div.componentheading
input.inputbox
button.button

/* FILE:     components\com_content\views\archive\tmpl\default_items.php */
ul#archive-list
div#navigation
li.row
h4.title
h5.metadata
span.created-date
span.author
div.intro

/* FILE:     components\com_content\views\article\tmpl\default.php */
div.contentpaneopen_edit
table.contentpaneopen
td.contentheading
a.contentpagetitle
td.buttonheading
span.small
td.createdate
td.modifydate
a.readon
span.article_separator

/* FILE:     components\com_content\views\article\tmpl\form.php */
input#title
input#created_by_alias
input#publish_up
input#publish_down
textarea#metadesc
textarea#metakey
table.adminform
td.key
input.inputbox
img.calendar
textarea.inputbox

/* FILE:     components\com_content\views\article\tmpl\pagebreak.php */
input#title
input#alt
td.key

/* FILE:     components\com_content\views\category\tmpl\blog.php */
div.componentheading
table.blog
td.article_column
div.blog_more

/* FILE:     components\com_content\views\category\tmpl\blog_item.php */
div.contentpaneopen_edit
table.contentpaneopen
td.contentheading
a.contentpagetitle
td.buttonheading
span.small
td.createdate
td.modifydate
a.readon
span.article_separator

/* FILE:     components\com_content\views\category\tmpl\blog_links.php */
a.blogsection

/* FILE:     components\com_content\views\category\tmpl\default.php */
div.componentheading
table.contentpane
td.contentdescription

/* FILE:     components\com_content\views\category\tmpl\default_items.php */
input.inputbox
td.sectiontableheader
td.sectiontableentry1
td.sectiontableentry2
td.sectiontablefooter

/* FILE:     components\com_content\views\frontpage\tmpl\default.php */
div.componentheading
table.blog
td.article_column
div.blog_more

/* FILE:     components\com_content\views\frontpage\tmpl\default_item.php */
div.contentpaneopen_edit
table.contentpaneopen
td.contentheading
a.contentpagetitle
td.buttonheading
span.small
td.createdate
td.modifydate
a.readon
span .article_separator

/* FILE:     components\com_content\views\frontpage\tmpl\default_links.php */
a.blogsection

/* FILE:     components\com_content\views\section\tmpl\blog.php */
div.componentheading
table.blog
td.article_column
div.blog_more

/* FILE:     components\com_content\views\section\tmpl\blog_item.php */
div.contentpaneopen_edit
table.contentpaneopen
td.contentheading
a.contentpagetitle
td.buttonheading
span.small
td.createdate
td.modifydate
a.readon
span.article_separator

/* FILE:     components\com_content\views\section\tmpl\blog_links.php */
a.blogsection

/* FILE:     components\com_content\views\section\tmpl\default.php */
div.componentheading
table.contentpane
td.contentdescription
a.category
span.small

/* FILE:     components\com_mailto\views\mailto\tmpl\default.php */
div.componentheading
input.inputbox
button.button

/* FILE:     components\com_mailto\views\sent\tmpl\default.php */
div.componentheading

/* FILE:     components\com_newsfeeds\views\categories\tmpl\default.php */
div.componentheading
table.contentpane
td.contentdescription
a.category
span.small

/* FILE:     components\com_newsfeeds\views\category\tmpl\default.php */
div.componentheading
table.contentpane
td.contentdescription

/* FILE:     components\com_newsfeeds\views\category\tmpl\default_items.php */
td.sectiontableheader
td.sectiontableentry1
td.sectiontableentry2
a.category
td.sectiontablefooter

/* FILE:     components\com_newsfeeds\views\newsfeed\tmpl\default.php */
table.contentpane
td.componentheading
td.contentheading

/* FILE:     components\com_poll\views\poll\tmpl\default.php */
form#poll
div.componentheading
div.contentpane

/* FILE:     components\com_poll\views\poll\tmpl\default_graph.php */
table.pollstableborder
th.sectiontableheader
td.sectiontableentry1
td.sectiontableentry2
td.smalldark

/* FILE:     components\com_search\search.php */
span.highlight

/* FILE:     components\com_search\views\search\tmpl\default.php */
div.componentheading

/* FILE:     components\com_search\views\search\tmpl\default_error.php */
table.searchintro

/* FILE:     components\com_search\views\search\tmpl\default_form.php */
input#search_searchword
input#area_{VALUE} /* Value is set programatically */
table.contentpaneopen
input.inputbox
input.button

/* FILE:     components\com_search\views\search\tmpl\default_results.php */
table.searchintro
table.contentpaneopen
span.small

/* FILE:     components\com_user\views\login\tmpl\default_login.php */
form#login
table.contentpane
div.componentheading
input.inputbox
input.button

/* FILE:     components\com_user\views\login\tmpl\default_logout.php */
form#login
div.componentheading
table.contentpane
input.button

/* FILE:     components\com_user\views\register\tmpl\default.php */
form#josForm
label#namemsg
input#name
label#usernamemsg
input#username
label#emailmsg
input#email
label#pwmsg
input#password
label#pw2msg
input#password2
form.form-validate
div.componentheading
table.contentpane
input.inputbox
input.required
button.button
button.validate

/* FILE:     components\com_user\views\register\tmpl\default_message.php */
div.componentheading
div.message

/* FILE:     components\com_user\views\remind\tmpl\default.php */
input#email
div.componentheading
form.josForm 
form.form-validate
table.contentpane
label.hasTip
input.required 
input.validate-email
button.validate

/* FILE:     components\com_user\views\reset\tmpl\complete.php */
input#password1
input#password2
div.componentheading
form.josForm 
form.form-validate
table.contentpane
label.hasTip
input.required 
input.validate-password
button.validate

/* FILE:     components\com_user\views\reset\tmpl\confirm.php */
input#token
div.componentheading
form.josForm 
form.form-validate
table.contentpane
label.hasTip
input.required
button.validate

/* FILE:     components\com_user\views\reset\tmpl\default.php */
input#email
div.componentheading
form.josForm 
form.form-validate
table.contentpane
label.hasTip
input.required
input.validate-email
button.validate

/* FILE:     components\com_user\views\user\tmpl\default.php */
div.componentheading

/* FILE:     components\com_user\views\user\tmpl\form.php */
input#name
input#email
input#username
input#password
input#password2
div.componentheading
input.inputbox
button.button

/* FILE:     components\com_weblinks\views\categories\tmpl\default.php */
div.componentheading
table.contentpane
td.contentdescription
a.category
span.small

/* FILE:     components\com_weblinks\views\category\tmpl\default.php */
div.componentheading
table.contentpane
td.contentdescription

/* FILE:     components\com_weblinks\views\category\tmpl\default_items.php */
td.sectiontableheader
td.sectiontableentry1
td.sectiontableentry2
td.sectiontablefooter

/* FILE:     components\com_weblinks\views\weblink\tmpl\form.php */
form#adminForm
input#jformtitle
input#jformurl
textarea#jformdescription
div.componentheading
input.inputbox
textarea.inputbox

/* FILE:     components\com_wrapper\views\wrapper\tmpl\default.php */
div.contentpane
div.componentheading

/* FILE:     libraries\joomla\database\database\mysql.php */
table#explain-sql

/* FILE:     libraries\joomla\database\database\mysqli.php */
table#explain-sql

/* FILE:     libraries\joomla\document\error\error.php */
table.Table
td.TD

/* FILE:     libraries\joomla\html\html.php */
span.editlinktip 
span.hasTip
img.calendar

/* FILE:     libraries\joomla\html\html\behavior.php */
div#keepAliveLayer

/* FILE:     libraries\joomla\html\html\grid.php */
input#cb{ROW_NUMBER} /* Value is set programatically */

/* FILE:     libraries\joomla\html\html\grid.php */
span.editlinktip 
span.hasTip

/* FILE:     libraries\joomla\html\pane.php */
dl.tabs
div.pane-sliders
div.panel
h3.jpane-toggler 
h3.title
div.jpane-slider 
div.content

/* FILE:     libraries\joomla\html\parameter.php */
table.paramlist
table.admintable
td.paramlist_description
td.paramlist_key
span.editlinktip
td.paramlist_value

/* FILE:     libraries\joomla\html\toolbar.php */
div.toolbar

/* FILE:     libraries\joomla\template\tmpl\adminfilters.html */
#search
input.text_area
input.button
select.inputbox

/* FILE:     libraries\joomla\template\tmpl\adminlists.html */
input#cb{ITEM_ID} /* Value is set programatically */
input.text_area

/* FILE:     libraries\joomla\template\tmpl\breadcrumbs.html */
span.breadcrumbs 
span.pathway

/* FILE:     libraries\joomla\template\tmpl\calendar.html */
button#trigger_{ID} /* Value is set programatically */
button.button

/* FILE:     libraries\joomla\template\tmpl\dtree.html */
div.expander

/* FILE:     libraries\joomla\template\tmpl\forms.html */
input#{NAME} /* Value is set programatically */
input#{VALUE} /* Value is set programatically */

/* FILE:     libraries\joomla\template\tmpl\help.html */
div#overDiv
a.tooltip

/* FILE:     libraries\joomla\template\tmpl\page.html */
form{FORMNAME} /* Value is set programatically */

/* FILE:     libraries\joomla\template\tmpl\tabs.html */
link#luna-tab-style-sheet
div#{PANEID} /* Value is set programatically */
div.tab-page
h2.tab

/* FILE:     modules\mod_banners\tmpl\default.php */
div.bannergroup
div.bannerheader
div.banneritem
div.clr
div.bannerfooter

/* FILE:     modules\mod_breadcrumbs\helper.php */
a.pathway

/* FILE:     modules\mod_breadcrumbs\tmpl\default.php */
span.breadcrumbs 
span.pathway

/* FILE:     modules\mod_feed\tmpl\default.php */
table.moduletable
ul.newsfeed

/* FILE:     modules\mod_latestnews\tmpl\default.php */
ul.latestnews
li.latestnews
a.latestnews

/* FILE:     modules\mod_login\tmpl\default.php */
input#mod_login_username
input#mod_login_password
input#mod_login_remember
input.inputbox
input.button

/* FILE:     modules\mod_mainmenu\helper.php */
li#{ITEM ID} /* Value is set programatically */
span.separator

/* FILE:     modules\mod_mainmenu\legacy.php */
ul#mainlevel
ul#sublevel

/* FILE:     modules\mod_mostread\tmpl\default.php */
ul.mostread
li.mostread
a.mostread

/* FILE:     modules\mod_newsflash\tmpl\_item.php */
table.contentpaneopen
td.contentheading
a.contentpagetitle

/* FILE:     modules\mod_newsflash\tmpl\horiz.php */
table.moduletable

/* FILE:     modules\mod_newsflash\tmpl\vert.php */
span.article_separator

/* FILE:     modules\mod_poll\tmpl\default.php */
input#voteid{VOTE ID NUMBER} /* Value is set programatically */
table.poll
table.pollstableborder
input.button

/* FILE:     modules\mod_related_items\tmpl\default.php */
ul.relateditems

/* FILE:     modules\mod_search\helper.php */
input#mod_search_searchword
input.inputbox
input.button

/* FILE:     modules\mod_search\tmpl\default.php */
div.search

/* FILE:     modules\mod_sections\tmpl\default.php */
ul.sections
You do not have the required permissions to view the files attached to this post.
Last edited by Waseem Sadiq on Mon Aug 13, 2007 5:15 pm, edited 1 time in total.
http://www.bulletprooftemplates.com/ - Joomla Templates and Consultancy

User avatar
alexhokamp
Joomla! Guru
Joomla! Guru
Posts: 723
Joined: Sun Nov 20, 2005 7:04 pm
Location: Germany
Contact:

Re: Default Joomla 1.5 CSS Classes and IDs

Post by alexhokamp » Tue Aug 14, 2007 11:28 am

Thank you Waseem, this looks really nice and will help some folks ...  :pop

User avatar
salty
Joomla! Ace
Joomla! Ace
Posts: 1533
Joined: Thu Sep 21, 2006 3:35 pm
Location: Amsterdam

Re: Default Joomla 1.5 CSS Classes and IDs

Post by salty » Tue Aug 14, 2007 11:35 am

Hi Waseem,
Thanks, great!
Klikstudio New media workshops
http://www.klikstudio.net

cantthinkofanickname
Joomla! Ace
Joomla! Ace
Posts: 1334
Joined: Sat Oct 21, 2006 8:53 am

Re: Default Joomla 1.5 CSS Classes and IDs

Post by cantthinkofanickname » Tue Aug 14, 2007 1:33 pm

I assume by "hard coded" you just mean as produced by the *****.html.php files. Did you produce this from the CSS files? I ask because I have noticed that in playing with 1.0.12 I've noticed that some styles are in the coding but are not mentioned in the CSS file(s). I have made use of one or two of these.

This presumably includes the default template template_css.css.
Thanks for your time.

User avatar
Waseem Sadiq
Joomla! Ace
Joomla! Ace
Posts: 1441
Joined: Mon Sep 12, 2005 7:41 pm
Location: Glasgow - Scotland
Contact:

Re: Default Joomla 1.5 CSS Classes and IDs

Post by Waseem Sadiq » Tue Aug 14, 2007 1:49 pm

By Hard coded I mean styles that are declared within the codebase of Joomla 1.5 (this is not for Joomla 1.0.x - for Joomla 1.0.x please see the FAQ section - http://help.joomla.org/component/option ... temid,268/).

I hope this clears things up a little

Waseem
http://www.bulletprooftemplates.com/ - Joomla Templates and Consultancy

riisto
Joomla! Apprentice
Joomla! Apprentice
Posts: 31
Joined: Wed Jul 19, 2006 1:32 pm

Re: Default Joomla 1.5 CSS Classes and IDs

Post by riisto » Fri Sep 07, 2007 10:36 am

I run RC2.

I have successfully changed the width of the search input field in my front page. I used:

Code: Select all

input#mod_search_searchword {
width: 150px;
}
I can’t change the look of username and password input field in login module. I have tried many ids from the list above.
This doesn’t change the width:

Code: Select all

input#mod_login_username {
	width: 50px;
}
Last edited by riisto on Fri Sep 07, 2007 11:28 am, edited 1 time in total.

riisto
Joomla! Apprentice
Joomla! Apprentice
Posts: 31
Joined: Wed Jul 19, 2006 1:32 pm

Re: Default Joomla 1.5 CSS Classes and IDs

Post by riisto » Mon Sep 10, 2007 10:55 am

I would be very thankful if someone can confirm which id/class that is controlling the looks of user and password input field in the login mod of front page.

User avatar
Waseem Sadiq
Joomla! Ace
Joomla! Ace
Posts: 1441
Joined: Mon Sep 12, 2005 7:41 pm
Location: Glasgow - Scotland
Contact:

Re: Default Joomla 1.5 CSS Classes and IDs

Post by Waseem Sadiq » Tue Sep 11, 2007 2:21 pm

You Can target the login form's input buttons in one of three ways:

1)

Code: Select all

form#form-login p#form-login-username input {
you-style-rules:in-here;
}

form#form-login p#form-login-password input {
you-style-rules:in-here;
}
2)

Code: Select all

p#form-login-username input {
you-style-rules:in-here;
}

p#form-login-password input {
you-style-rules:in-here;
}
3)

Code: Select all

p#form-login-username input.inputbox, p#form-login-password input.inputbox {
you-style-rules:in-here;
}

Hope this helps :)

Waseem
http://www.bulletprooftemplates.com/ - Joomla Templates and Consultancy

User avatar
juanpablo321
Joomla! Apprentice
Joomla! Apprentice
Posts: 20
Joined: Fri Nov 10, 2006 2:52 am
Location: Colombia

Re: Default Joomla 1.5 CSS Classes and IDs

Post by juanpablo321 » Tue Feb 03, 2009 4:39 pm

Thank you for your useful post.
God Bless whom created the forum!


Locked

Return to “Templates & CSS - 1.0.x”