Modifying Existing Styles

Previous page  First page  Next page

Many elements of the blog system blogs have a style associated with them. The style determines the look of the element; if you change the style, you change the look.

 

The easiest way to change styles is to copy the existing styles and then modify them. The Edit CSS page allows you to define the CSS styles which determine the colors and fonts used in various elements of your blog.

 

To open the Edit CSS page:

1.Log-in to the Publisher Control Panel for your blog.
2.Click the Look & Feel tab to bring it to the front. The Look & Feel section has three subsections: Colors, Layout, and Templates.
3.To go to the Templates page, click Templates in the navigation bar. The Templates page  opens, displaying all of the templates for your blog. The templates tell the blog system how to assemble your blog. Many of the templates do what their names indicate. For example, the article template affects the way an article looks.
4.In the style template row in the Component Templates table, click the Edit link. The Select Style page opens. Here you can choose one of the built-in styles or customize an existing one.
5.Scroll to the bottom of the page, then click the Customize button. The Edit CSS page opens.

 

The Edit CSS page is divided into three parts. The top shows you what the current theme is and allows you to select a new one. You can use the blog system's built-in themes as a springboard for your own theme designs. The middle portion contains the definitions for the current theme. You cannot change this information but you can read and copy it. At the bottom of the page is the Custom CSS field. This is where you enter the information to customize your blog's theme.

 

You'll find all the styles for your blog in the Current CSS text box. If you scroll through this text box, you will find the definitions for the various styles that control the look of the elements of an article.

 

To change a style:

1.Copy the style definition for <style name> from the Current CSS text box and paste it into the Custom CSS text box.
2.Make the required changes within the Custom CSS box.
3.To save and view your changes, click the Save CSS button near the bottom of the page.

 

Repeat these steps for all of the styles you wish to change.