My favorites | Sign in
Project Home Downloads Wiki Issues Source
Search
for
K2Styles  
Updated Oct 6, 2010 by heilemann

STYLES HAVE BEEN DEPRECATED IN THE LATEST VERSIONS OF K2

#summary An overview of Styles and how to use custom CSS files.

This page details the use of custom CSS files in K2's Styles system. If you want to customize K2 beyond the scope of CSS, you should use K2ChildThemes.

Custom CSS

You can use the following labels to identify your custom style, by placing them in a comment block inside the CSS file.

Author Name:
Author Site:
Style Name:
Style URI:
Version:
Comments:

K2 1.1 Changes

From 1.1 and forward the labels have changed to be in sync with the labels WordPress uses in style.css, which instead gives us:

Author:
Author URI:
Style Name:
Style URI:
Version:
Description:

Custom Footer

If you have defined the Style Name, Author Name and Style URI, K2 will display your style credits in the footer with the following format:

Styled with <a href="%stylelink%" title="%style% by %author%">%style%</a>

If you would like to overwrite this, you should include the following:

Style Footer:

Use %author% for Author Name, %site% for Author Site, %style% for Style Name, %stylelink% for Style URI, %version% for Version and %comments% for Comments.

Headers

The default dimensions for header image is 950 px by 200 px. If your custom style has different dimensions for the header, you should include the following information as well:

Header Text Color:
Header Width:
Header Height:

Be sure to use the width of your header when displaying 3 columns. You don't need to include the 'px' when entering values for the Width and Height.

Layout Widths

When using two or more columns, K2 dynamically changes the number of columns depending on the width of the browser window. The default #page widths are as follows:

1 Column 2 Columns 3 Columns
580 px 800 px 970 px

For example, when K2 is set to display 3 columns and the user's browser width is 820 px, K2 will switch to 2 columns.

If your style uses different widths for #page, you'll need to include:

Layout Widths: 580px, 800px, 970px

where 580px is the width of #page when using 1 column, 800px is the width of #page when using 2 columns, etc. The unit px can be omitted. For example:

Layout Widths: 400, 800, 1200
Powered by Google Project Hosting