Posted By

j_junyent on 12/01/07

Tagged

wordpress

Versions (?)

Last Edited at 12/01/07 03:00pm

Statistics

Viewed 647 times

Favorited by 1 user(s)

Related snippets

Lorelle's Sandbox Styles CSS

/ Published in: PHP

blacnk stylesheet for the Sandbox WordPress theme

Highlighted TextExpand

/* Lorelle's Sandbox Styles CSS
Version: .03
NOTES: 
Each X and ? represents a specific number or word as these are customizable elements. 
The following are customizable per blog, category, and date:  
* The.author-? is your blog name. Mine is .author-lorelle as that is the "name" of my blog.
* The category is .category-X, with X representing the category slug name. 
* The y, m, d, and h are year, month, day, and hour. You can style your posts to look differently for 2005, 2006, etc. or by month, and so on. I left the numbers for dates as an example. 
* Style on a per-post basis. For example, post ID number 345 would change .post-X to .post-345 and style accordingly.
* The HTML per page view includes all classes appropriate to that page and highlighted in that section of the CSS. */

/* Architecture */
html { }
body { }
#wrapper { }
#header { }
#container { }
#content { }
#primary { } /* sidebar one */
#secondary { } /* sidebar two */
#footer { }
.sidebar {} /* controls all the sidebar looks */
 
/* Header */
h1 { }
h1 a { }
h1 a:link { }
h1 a:visited { }
h1 a:hover { }
#blog-title { }
#blog-description { }

/* VARIOUS PAGE VIEWS customizable on a per post, category, page view, date, etc. basis
y = year, m = month, d = date, h = hour 
*/

.y2006 { }
.m08 { }
.d05 { }
.h04 { }
#post-X { } /* Customizable by X = post ID number */
#content #post-X {} 
 
/* Front Page Only */
/* Set by body class="wordpress y2006 m08 d06 h09 home" */
.home { }
 
/* Single Post Only 
Set by body class="wordpress y2006 m08 d06 h09 single s-y2006 s-m08 s-d05 s-h04" */
.single { }
.s-y2006 { }
.s-m08 { }
.s-d05 { }
.s-h04 { }
 
/* Page View 
Page ID is set as div id="post-X" class="hentry page publish author-lorelle category-uncategorized y2005 m08 d16 h08" */
.page { }
.category-uncategorized { } /* Currently, WordPress Pages are in the "uncategorized" category */
 
/* Author Page */
/* Set by body class="wordpress y2006 m08 d06 h09 archive author author-lorelle" */
.archive { }
.author { }
.author-metadata { }
.author-metadata a:link { }
.author-metadata a:visited { }
.author-metadata a:visited { }
 
/* Multi-post Views such as Search and Tags */
/* Set by body class="wordpress y2006 m08 d06 h09 search" */
.search { }
h2.page-title { }
.page-title { }
 
/* Category and Archive View */
/* Category view set by body class="wordpress y2006 m08 d06 h09 archive category category-blogging-tips"  
The DL list is the category subtitle. Be sure and treat any DL tags used within the post content differently from the subtitle of the category and archive views. */
.category { }
.archive { }
.category a:link { }
.category a:visited { }
.category a:hover { }
h2.page-title { }
h2.entry-title { }
.page-title { }
.page-title a:link { }
.page-title a:visited { }
.page-title a:hover { }
.category dl { }
.category dt { }
.category dd { }
dl #?-metadata { } /* This is customizable per category, such as #blogging-tips-metadata or #wordpress-news-metadata */
#?-metadata dt { }
#?-metadata dd { }
.category-? { } /* Customizable per category, such as .category-wordpress-tips */
.archive-metadata { }
h3.entry-title { }
h3.entry-title a:link { }
h3.entry-title a:visited { }
h3.entry-title a:hover { }

/* Post Title */
h2 { }
h2.entry-title { }
.entry-title { }

/* Post Content Area */
.hfeed { }
.hentry { } /* surrounds entire post area on everything, including Pages */
.post { } /* not featured on Pages. On everything else. */
.publish { } /* around post content area and page content area on every template file */
.wordpress { }  /* in body of every template file */
.author-lorelle { }
.post a:link { }
.post a:visited { }
.post a:hover { }
.published { }
 div.entry-content { }
.entry-content { }
.entry-content p { }
.entry-content a { }
.entry-content a:link { }
.entry-content a:visited { }
.entry-content a:hover { }
.readmore { }
.entry-content ul { }
.entry-content ul ul { }
.entry-content ul li { }
.entry-content ul ul li { }
.entry-content ul ul ul { }
.entry-content ul ul ul li { }
.entry-content ul ul ul ul  { }
.entry-content ul ul ul ul li { }
.entry-content li { }
.entry-content li li { }
.entry-content li li li { }
.entry-content h3 { }
.entry-content h4 { }
.entry-content h5 { }

/* Dealing with the Post Date 
The use of the ABBR tag to house the date may be in keeping with new standards, but it creates a styling nightmare. To style all ABBR usages one way, they will all look the same, as a date and as an abbreviation (acronym) unless you restrict all use of the acronyms to the ACRONYM tag in your posts. 
The ".published" class is used in all of the date references, so you will have to use a parent container to specify which date you want styled. Thus, the vast number of options.  */
.published abbr { } /* date published */
.entry-content abbr {} /* ABBR used inside of a post entry content area. Style this to make the abbreviations in your posts look differently than your date styles. */
body.home abbr.published { }
body.archive abbr.published { }
body.home abbr.published, body.archive abbr.published { }
body.single abbr.published { } /* Customize the date on single post pages only */
div.entry-meta abbr.published { } /* Customize the date in the post meta data section */
.search abbr.published { }
.archive abbr.published { }
.category abbr.published { }

/* Post Excerpts */
span .more-link { } /* The "read more" span style */
.more-link { }
.entry-content span { }

/* post meta data section */
.entry-meta { }
.entry-meta a:link { }
.entry-meta a:visited { }
.entry-meta a:hover { }
.entry-meta abbr { }
span.entry-author { }
span.author { }
span.vcard { }
.entry-author { }
.author { }
.vcard { }
.entry-meta span { }
a.url { }
a.fn { }
.url { }
.fn { }
span.entry-category { }
.entry-category { }
.entry-category a:link { }
.entry-category a:visited { }
.entry-category a:hover { }
span.entry-editlink { }
.entry-editlink { }
.entry-editlink a { }
span.entry-commentlink { }
.entry-commentlink { }
.entry-commentlink a:link { }
.entry-commentlink a:visited { }
.entry-commentlink a:hover { }
 
/* Comment Section found on Single and Page Views */
 
div.comments { }
.comments { }
.comments h3 { }
h3.comment-header { }
.comment-header { }
#numpingbacks { }
#pingbacks { }
.commentlist { }
#pingbacks .commentlist { }
.comments ol { }
.comments ol ol { }
.comments ol li { }
.comments ol ol li { }
.alt { }
.trackback { }
div.comment-author { }
.comment-author { }
.comment-author a { }
.comment p
.comment-metadata { }
.comment a { }
.comment-metadata a { }
.comment-mod { }
#respond { }
#respond h3 { }
div.formcontainer { }
.formcontainer { }
form { }
div.formcontainer form { }
#commentform { }
#commentform #submit { }
#commentform #submit:hover {}
div #loggedin { }
#loggedin { }
.form-label { }
.form-textarea { }
textarea#comment { } /* controls comment text box */
#comment { }
form #comment { }
textarea { }
.form-submit { }
#submit { }
form #submit { }
.comments a:link { }
.comments a:visited { }
.comments a:hover { }

#comment-X /* X = comment ID. The following are customizable per trackback info. Dates left in as examples. */
#comment-X .trackback { }
.c-y2006  { }
.c-m08 { }
.c-d05 { }
.c-h04 { }
 
/* Page Navigation */
div.navigation { }
.navigation { }
.navigation a:link { }
.navigation a:visited { }
.navigation a:hover { }
div.nav-previous { }
.nav-previous { }
.nav-previous a:link { }
.nav-previous a:visited { }
.nav-previous a:hover { }
div.nav-next { }
.nav-next { }
.nav-next a:link { }
.nav-next a:visited { }
.nav-next a:hover { }
 
/* Sidebar */
   /* nested list in sidebar */
#primary h3 { }
#primary h3.widgettitle {}
#primary ul { }
#primary li { }
#primary ul ul { }
#primary ul li { }
#primary ul ul li { }
#primary ul ul ul { }
#primary ul ul ul li { }
#primary a:link { } /* Styles all links in the sidebar */
#primary a:visited { }
#primary a:hover { }
#primary img {}
 
 /* Search Form */
#primary #search { }
#primary #search h3.widgettitle {}
#search { }
form { }
#searchform { }
#s { }
#searchsubmit { }
#text-1 { }
form { }
#searchform {} /* entire search form section */
#s { } /* search form box */
#searchsubmit { }
#text-1 { }
#search { } /* search form text */
#search a {} /* search link text */
#search a:hover {}
#searchsubmit { } /* search button */
#searchsubmit:hover { }

/* Sidebar Widgets - section of your sidebar arrangable by the WordPress Widgets */
#primary.widget { }
.widget  { }
#primary h3.widgettitle { }
#primary h3 { } /* Titles for each section of the sidebar, including widget sidebar accessories */
.widgettitle { }
.widget_text {}
.widget_sandbox_search { }
div.textwidget { } /* text from widget sidebar accessories */
.textwidget { }
.widget ul {}
.widget li {}
.widget ul ul {}
.widget ul ul ul { }
.widget ul ul li { }
.widget ul ul ul li { }
.widget a:link {}
.widget a:visited { }
.widget a:hover { }
 
/* Page List */
#pages { }
#paqes.widget_pages { } /* list of Pages from widget sidebar accessories */
.widget_pages { }
a:link { }
a:visited { }
a:hover { }
li.page_item { }
li.page_item a { }
#pages a:link { }
#pages a:visited { }
#pages a:hover { }
 
/* Categories List */
 
#categories { }
#categories.widget { }
.widget_categories { }
#categories a:link { }
#categories a:visited { }
#categories a:hover { }
 
/* Recent Posts Widget List */
#recent-posts { }
#recent-posts.widget { }
.widget_recent_entries { }
#recent-posts a:link { }
#recent-posts a:visited { }
#recent-posts a:hover { }
 
/* Blogroll list and links - fill in the X with each link category ID number */
#linkcat-X { }
#linkcat-X a { }
#linkcat-X h3 { }
#linkcat-X ul { }
#linkcat-X ul ul { }
#linkcat-X ul li { }
#linkcat-X li { }
#linkcat-X ul ul li { }
#linkcat-X a:link { }
#linkcat-X a:visited { }
#linkcat-X a:hover { }
 
/* Sidebar Meta - Admin Section */
#meta { }
#meta.widget { }
#meta.widget_meta { }
.widget_meta { }
#meta h3 { }
#meta.widgettitle { }
#meta ul { }
#meta ul ul { }
#meta ul li { }
#meta ul ul li { }
#meta a:link { }
#meta a:visited { }
#meta a:hover { }
 
/* Sidebar Feeds Section, each section of RSS feeds are numbered such as #rss-4 or #rss-1, so change the number to change the look of that feed's styles, and add other feed numbers to style each independent feed style */
#rss-X { }
#rss-X.widget { }
.widget_rss { }
#rss-X h3 { }
#rss-X.widgettitle { }
#rss-X a.rsswidget { }
.rsswidget { }
#rss-X.rsswidget {} /* feed post title */
#rss-X ul { }
#rss-X ul ul { }
#rss-X ul li { }
#rss-X ul ul li { }
#rss-X a:link { }
#rss-X a:visited { }
#rss-X a:hover { }

/* Feed Links */
.feed-links { }
.feed-links h3 { }
.feed-links ul { }
.feed-links ul ul { }
.feed-links ul li { }
.feed-links ul ul li { }
.feed-links a:link { }
.feed-links a:visited { }
.feed-links a:hover { }
 
/* Secondary sidebar, which is in use whether or not you want it. You must style it. For single sidebars, both sidebars are there, the #secondary sidebar sits below the #primary sidebar. */
#secondary .sidebar { }

/* Footer */
#footer p { }
#footer a:link { }
#footer a:visited { }
#footer a:hover { }
 
/* Links - Set them only if you want the same look for EVERY link on your blog. Otherwise, set them on a specific section basis. */
a:link { }
a:visited { }
a:hover { }
 
/* COMMON HTML elements most likely found and used within the post content area - and allowed by Wordpress.com */
p { }
hr { }
b, strong { }
em, i { }
img { }
p img { }
a img {border:0}
/* Styling Lists - if you style the "root" list styles, it will style everything the same. Lists are used in the sidebar, post content, and comments, so it is best to style each indivdually. */
#content ul { }
#content li { }
#content ul ul { }
#content ul ul li { }
#content ul ul ul li { }
#content ol { }
#content dl { } /* There is a DL in the subtitle - text of categories, author, and archives. If you style the DL alone, it will be styled for everything. To style the DL for the post content, use this or another parent container that covers the post content area. */
#content dt { font-weight:bold;}
#content dd { }
blockquote { }
cite { }
code { }
i { }
em { }
b, strong { }
hr { }
pre { }
p abbr { } /* This might not work. See abbr references above. */
acronym { }
table { }
tr { }
td { }
caption { }
thead { }
#content h3 { }
#content h4 { }
#content h5 { }

URL: http://lorelle.wordpress.com/2006/08/06/wordpresscom-custom-css-all-the-styles-for-the-sandbox-theme/

Report this snippet Tweet

Comments

Subscribe to comments

Comment:

You need to login to post a comment.