Tips Apply to the Full Version of WordPress.
Since 1999, all web pages are to be styled with style sheets called Cascading Style Sheets or CSS. Basically, the HTML page holds the structure of the page with descriptive titles to each section called “selectors”. In an attached file, called style.css in WordPress, all of the presentation instructions or style properties are set for each selector or HTML tag.
Let’s say that you want to modify your header’s text. It’s centered and you want to change it to right justified. To find your CSS styles in WordPress, you need to do the following:
- View your page in your web browser.
- From the menu choose VIEW > PAGE SOURCE. It will pop up a page with the generated HTML version of your page.
- Look through the code. It may seem overwhelming, but concentrate on finding your
headersection. Using the browser’s search functions, search forheader. - When you find it, it should be inside of a “container” looking something like this:
<div id="header"><h1 ><?php bloginfo('name'); ?></h1 ></div > - This information tells you that the title of your site is in two selectors:
h1andheader. - In a Text Editor program, open the style.css style sheet file in your Themes subfolder (usually in
wordpress/wp-content/themes/themename/. This is your CSS file that holds the presentation styles for your page’s structure. - Scroll or search through it and look for
header. Inside of that will be the first set of formatting references that form the header’s styles. - If you do not see a reference to
text-align:center, search for the next selector involved:h1 - In the
h1section, look again fortext-align:center. - If
text-alignis listed, change it totext-align:rightto make the text be right justified.
If you cannot find references for the header or h1 styles in your style sheet, or if you change it there and it still looks centered, some WordPress Themes put this information in the head of the header.php template file. Look there for the styles.
This technique applies to any of the styles you want to change within your WordPress site. If you are new to CSS, we have some articles that may help you learn more, and you can find more information about WordPress and CSS on the WordPress Codex.
- CSS: The Things You Need To Know
- Understanding CSS Selectors and Attributes
- CSS Design Experiments
- CSS Tips and Tricks - Jazzing Up the Content
- CSS Book Recommendations
technorati tags: wordpress, blog, wordpress tips, wordpress themes, wordpress, blog, wordpress tips, stylesheet, wordpress styles, css, wordpress help
site search tags: wordpress, blog, wordpress tips, wordpress themes, wordpress, blog, wordpress tips, stylesheet, wordpress styles, css, wordpress help
© Republished with Permission










3 Trackbacks/Pingbacks
[...] Finding Your CSS Styles in WordPress [...]
[...] Finding Your CSS Styles in WordPress This entry was written by Lorelle VanFossen and posted on June 24, 2007 at 4:11 am and filed under Web Design. Bookmark the permalink. Follow any comments here with the RSS feed for this post. Post a comment or leave a trackback: Trackback URL. « Do You Get to The Point or Ramble to the Point In Your Blog? [...]
[...] Finding Your CSS Styles in WordPress « Lorelle on WordPress (tags: wordpress design css) [...]
Post a Comment