Plantilla para Blogger: Ubuntu Blogger 1.0

Ubuntu Blogger es una plantilla para Blogger basada en la nueva interfaz web de este sistema.

Contiene las siguientes características:

• 2 Columnas.
• 2 Menúes.
• Diseño Simple.
• Colores claros y diseño basado en Ubuntu.
• Fuentes oficiales de Ubuntu.
• Sidebar a la izquierda.
• Slider (galería).
• Buscador integrado.
• Optimizada para SEO.
• Favicon Incluido.

Información:

• Nombre: Ubuntu Blogger.
• Autor: Cloudx18.
• Página Principal: Ayuda Bloggers.
• Tamaño: 1.509kb
• Licencia: Creative Commons Attribution.
• Extras: Fuentes Ubuntu para Photoshop/Gimp, etc.

Demo Descargar

Instrucciones de configuración:

Corrigiendo las fechas:

Por defecto las fechas se verán desordenadas, para corregirlo vé a ''Configuración | Formato'', en Formato de cabecera de fecha elige la penúltima opción (Ejemplo: 09 junio 2011). Guarda los cambios y listo.

Personalizar el menú superior:

<ul>
<li><a href='#'>Mapa de Sitio</a></li>
<li><a href='#'>Acerca</a></li>
<li><a href='#'>Contacto</a></li>
<li class='lastchild'><a href='#'>Editar</a></li>

</ul>

Para agregar un nuevo elemento, añade el siguiente código antes de </ul>:

<li><a href='Enlace'>Nombre</a></li> 

Personalizar menú inferior:

<ul>
<li><a href='/'>Inicio</a></li>
<li><a href='#'>Aplicaciones</a></li>
<li><a href='#'>Natty</a></li>
<li><a href='#'>Gnome</a></li>
<li><a href='#'>Unity</a></li>
<li class='lastchild'><a href='#'>Editar</a></li>
<img alt='Home' src='http://1.bp.blogspot.com/-bHKo3eJ3nvo/TfBsOyt_pQI/AAAAAAAABFA/VomGlDdkXxc/s1600/logo.png' style='float:right; margin-top:-4px; margin-right:4px;'/>
</ul>

Reemplaza la URL de la imagen (Logo ubuntu a la derecha del menú naranjo), por la deseada.

Para añadir un nuevo elemento al menú añade el siguiente código antes de <li class='lastchild'><a href='#'>Editar</a></li>:

<li><a href='Enlace'>Nombre</a></li> 

Personalizar Slider (Galería):

Busca el siguiente código:

<li class='sliderImage'>
<a href='URL1'>
<img src='http://1.bp.blogspot.com/-xntAy35-5Xg/TaAAXyFHQwI/AAAAAAAABDQ/WH4uPrPge-w/s1600/switch.png'/></a>
<span class='top'>In tincidunt viverra nisl. Donec dictum malesuada magna. Curabitur id nibh auctor tellus adipiscing pharetra.</span>
</li>

<li class='sliderImage'>
<a href='URL2'>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxHk1a-kRQgMMcQO7H2MnsWMA7K1DTApzB9-AKSWI-ah4IE2A_qwM6rgWUcDhyphenhyphenq9KHY36JuOxrTRP33bwXzjYkKQlBqUx86h0_pSPOqs-2wERr6J9vD405v1ivrCVeh9AHs3TqkQUgzos/s1600/MS+Paint+alternative+in+Ubuntu+11.04+Natty+Narwhal+-+1.png'/></a>
<span class='top'>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut odio. Nam sed est.</span>
</li>

<li class='sliderImage'>
<a href='URL3'>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjc3IvrXlTLrfcvtyBvCtZnF3iusUp7NlAV9Q6t-RHxkOkcWxOhP5wMNFs6JY4bNUpoq9AF79kPTeHBn2VXNyGdrde7HrGTwEAbt7N-vPQE_pQOH3zcHzBGoa-U0x_Qd41c02HQQDLFmP_o/'/></a>
<span class='top'>Fusce vel justo non orci semper feugiat. Cras eu leo at purus ultrices tristique.</span>
</li>


<li class='sliderImage'>
<a href='URL4'>
<img src='http://soft.mydiv.net/images/lin/screens/Ubuntu/Ubuntu_S420.jpg'/></a>
<span class='top'>Nam a risus et est iaculis adipiscing. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Integer ut justo.</span>
</li>

Para cambiar el texto y las imágenes del slider modifica los valores necesarios en cada elemento del slider..

Si deseas añadir una nueva imagen al slider, pega el siguiente código después del código anterior:

<li class='sliderImage'>
<a href='URL-DEL-ENLACE'>
<img src='URL DE LA IMAGEN'/></a>
<span class='top'>DESCRIPCIÓN DE LA IMAGEN.</span>
</li>