viernes, 2 de abril de 2010

Títulos y elementos de sidebar en una plantilla con dos barras laterales

 Para establecer los valores de las propiedades de estilo de títulos y elementos de sidebar en una plantilla de Blogger a la que hemos añadido una nueva columna lateral, lo primero que hay que hacer es buscar la línea de código donde está el encabezado /* Sidebar Content */.

 Ahora hay que localizar .sidebar .widget y renombrarlo como .right-sidebar .widget; también hay que añadir el encabezado .left-sidebar .widget. El código que ha de regir las propiedades de los elementos de sidebar quedaría así:
.left-sidebar .widget { 
  margin: 0 0 0.25em;
  padding: 0 0 0.75em;
  border-top: 0;
  border-right: 1px solid #bdbdbd;
  border-bottom: 1px solid #a4a4a4;
  border-left: 1px solid #bdbdbd;
  background: #c3d9ff;
}

.right-sidebar .widget { 
  margin: 0 0 0.25em;
  padding: 0 0 0.75em;
  border-top: 0;
  border-right: 1px solid #d8d8d8;
  border-bottom: 1px solid #a4a4a4;
  border-left: 1px solid #d8d8d8;
  background: #e6e6e6;
}
 Para las propiedades de los títulos de sidebar, hay que añadir dos nuevos encabezados: .right-sidebar h2 y .left-sidebar h2, como se puede ver en este ejemplo:
.left-sidebar h2 {
  padding: 5px;
  border-top: 1px solid #ffffff;
  border-bottom: 1px solid #bdbdbd;
  background-color: #d8d8d8;
  background-image: none; 
}

.right-sidebar h2 {
  padding: 5px;
  border-top: 1px solid #ffffff;
  border-right: 0;
  border-bottom: 1px solid #bdbdbd;
  border-left: 0;
  background-color: #d8d8d8;
  background-image: none;
}

No hay comentarios: