Fairweb

Développement WordPress, WordPress Mu, BuddyPress

screenshot

Left sidebar in a TwentyTen child theme

| 1 Comment

If you wish to use the Twentyten WordPress theme with a left sidebar, I would recommend you create a Twentyten child theme. This will save you much trouble when upgrading WordPress and / or the TwentyTen theme.

Create a TwentyTen child theme :

  • create a directory in wp-content/themes and name it after your own child theme  (ex: twentytenchild)
  • create a stylesheet called style.css in this new directory
  • Put the following comment in your new stylesheet. This will indicate that this is a child theme and that its parent is the Twentyten theme
    /*  Theme Name:     TwentyTen Child
    Theme URI:      http: //example.com/
    Description: TwentyTen  child theme
    Author:         Myriam Faulkner
    Author URI:     http://www.fairweb.fr
    Template:       twentyten
    Version:        0.1.0  */
  • Add the following code to have your child theme inherit the TwentyTen css styles properties
    @import url("../twentyten/style.css");
  • Activate your new theme in the WordPress backend

For the moment, your theme has exactly the same look as the TwentyTen theme

Have the sidebar on the left :

Now you have to override certain CSS properties. Here is a code out of the box (which I found in the WordPress.com forum) to be copies in your style.css file in wp-content/themes/twentytenchild

/* LAYOUT: Two columns-reversed
   DESCRIPTION: Two-column fixed layout with one sidebar LEFT of content */

#container {
float:right;
width:100%;
margin:0 0 0 -240px;
padding:1em 0;
}

#content {
margin:0 20px 0 280px;
}

#primary,#secondary {
float:left;
overflow:hidden;
width:220px;
}

Here you go, you now have your left sidebar.

Share

Author: Fairweb

Développement php/mysql, conception de sites internet

One Comment

  1. It doesn’t work at all. I wonder why??!

Leave a Reply

Required fields are marked *.

*