CSS Glossary for the Customizr WordPress theme


UNDER RECONSTRUCTION

Last Reviewed: 14-Nov-14 3.1.* 3.2.*

This glossary lists the most important selectors of the Customizr theme by zone. It is a very useful resource for anyone who needs to customize the style of the theme.

New to WordPress Theme Customization? Check these resources

 

Header-Navbar

Key

Selector

Description

Header Block

.tc-header

Header Block

Navbar Box

.navbar-wrapper, .navbar-inner .row-fluid

Navbar Box

[3.2]

Navbar Box

.navbar.notresp .navbar-inner

Navbar Box

[3.1]

Logo

.brand a

Site Title/Logo

.tc-header .brand

Site Title/Logo

Social Icons

.navbar-wrapper .social-block a

Social Icons

.social-block a

Social Icons

.navbar-inner .social-block

Social Icons

a.icon-feed

RSS

a.icon-twitter

Twitter

a.icon-facebook

Facebook

a.icon-google

Google+

a.icon-instagram

Instagram

a.icon-tumblr

Tumblr

a.icon-flickr

Flickr

a.icon-wordpress

WordPress

a.icon-youtube

YouTube

a.icon-pinterest

Pinterest

a.icon-github

Github

a.icon-dribbble

Dribbble

a.icon-linkedin

LinkedIn

.navbar-wrapper .navbar h2

Tagline

h2.site-description

Tagline

.navbar-wrapper .navbar h2

Tagline

Navbar

.navbar .nav > li > a

Menu item

.navbar .nav > li > a:hover

Menu item (Hover)

.navbar .nav > li > a:focus

Menu item (Focus)

.dropdown-menu > li > a

Menu item dropdown

.navbar .btn-navbar

3-bar Button

.sticky-enabled .tc-header

Sticky Header Block

.sticky-enabled .tc-shrink-on .site-logo img

Sticky Header Logo

.sticky-enabled .navbar .nav > li > a

Sticky Header Menu item

Slider

Key

Selector

Description

.carousel

Slider

[???]

#customizr-slider

Slider

[???]

.carousel-caption h1

Slider Heading

.carousel-caption p

Slider Sub-Heading

.carousel-caption .btn

Slider Button

.carousel-control

Slider Control Left/Right

[3.1]

.tc-carousel-control

Slider Control Left/Right

[3.2]

.tc-slider-controls.left

Slider Control Left

[3.2]

.tc-slider-controls.right

Slider Control Right

[3.2]

Feature Pages

Key

Selector

Description

.marketing h2

FP Titles

.fp-one h2

FP1 Title

.fp-text-one, .fp-text-two, .fp-text-three

FP Text

.btn.btn-primary.fp-button

FP Buttons

.fp-one .btn.btn-primary.fp-button

FP1 Button

.round-div

FP Circles

.fp-one .round-div

FP1 Circle

.widget-front .round-div

FP Circles

Posts-Pages

Key

Selector

Description

.breadcrumb-trail

Breadcrumb

.page .entry-title.format-icon

Page Icon/Title

h2.entry-title.format-icon

Page Title

.post .entry-title.format-icon

Post Icon/Title

h2.entry-title.format-icon:before

Post Icon

.entry-title.format-icon > a

Post Title

.post.sticky

Sticky Post

.entry-meta

Notice

.entry-meta .btn

Category

.entry-date

Date

.entry-meta .url

Author

.comments-link

Comments Count bubble

.post .round-div

FI Circles

hr.featurette-divider

Divider

Key

Selector

Description

.tc-sidebar

Sidebars

.tc-sidebar.left

Left Sidebar

.tc-sidebar.right

Right Sidebar

Footer

Key

Selector

Description

footer#footer .colophon

Footer

#footer .social-block

Footer Social Block

#footer .credits

Footer Credits

#footer .backtop

Footer Back to Top

.footer-widgets

Footer Widgets

Key

Selector

Description

.home

Front Page

.blog

Posts

.page

Pages

.page-id-n

Page id#

body

Main Body

#main-wrapper

Center Container

Credits : Dave Bardell (@rdellconsulting)

 

Further reading on Themes&Co

If you’re new to Customizr and CSS, there will probably be a learning curve, but you will quickly discover how CSS is a very valuable skill if you need to customize WordPress themes or do any kind of webdesign.

There are a plenty of interesting resources on this websites to get you started with learning more about how to improve your CSS coding skills.

 

Other useful web resources