Rediseño (otra vez)

Hola a todos, no he tenido mucho tiempo para escribir , irónicamente ahora que no estoy trabajando parece que ya no tengo tiempo para nada, pero estoy en el proceso de crear una empresa que se llama irrelevantSoft y eso me tiene bastante ocupado.

Bueno ahora si vamos a comenzar esto, la vez pasada les había dicho que iba a inventar el nuevo diseño a medida que lo fuera realizando, pero hoy por casualidad termine en el sitio de Woo Themes y encontré AntiSocial creado por Tim van Damme; y recorde al go que vi en CSS Tricks donde dice que una buena manera de mejorar en este cuento del diseño web es buscar un sitio web que nos guste y tratar de copiar el diseño lo mas parecido posible, y eso es lo que voy a hacer.

Para comenzar voy a crear una carpeta con el nombre del nuevo tema dentro de la carpeta /wp-content/themes, con los siguientes archivos index.php y style.css asi:
Carpetas

Vamos a comenzar con index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es-es" lang="es-es" >
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<meta name="robots" content="index, follow" />
<meta name="keywords" content="palabras, clave" />
<meta content="<?php bloginfo('description'); ?>" name="description"/>
<meta content="titulo" name="DC.Title"/>
<title><?php bloginfo('name'); ?> <?php if ( is_single() ) { ?>
» Blog Archive <?php } ?> <?php wp_title(); ?></title>
<link rel="alternate" type="application/rss+xml"
title="<?php bloginfo('name'); ?> RSS Feed" href="<?php bloginfo('rss2_url'); ?>" />
<link rel="pingback"
href="<?php bloginfo('pingback_url'); ?>" />
<link rel="stylesheet"
href="<?php bloginfo('stylesheet_directory'); ?>/style.css" type="text/css" />
<link rel="shortcut icon"
href="<?php bloginfo('stylesheet_directory'); ?>/imagenes/favicon.gif" />
<meta http-equiv="Content-Language" content="es" />
</head>
<body>
</body>
</html>

Con esto deberíamos tener una pagina en blanco, ahora continuaremos con style.css

/*
Theme Name: SitioAparte
Theme URI: http://sitioaparte.info
Description:
Version: 2.0
Author: SitioAparte.info
*/

* {
border: none;
margin: 0;
padding: 0;
}

Con esto deberíamos ver una pagina en blanco con el titulo de nuestro sitio, la descripción, los links de RSS y el favicon si lo tenemos; con un CSS reset muy general y en el panel de administracion de los temas se debe visualizar nuestro tema con la descripción que le dimos y el nombre.

En el siguiente post veremos cuales son las etiquetas usadas en wordpress y comenzaremos a darle estilo a nuestro tema.

2 10 Oct css, diseño, tutoriales twit face

2 Comentarios

  • jefr26

    Claro que no lo hare exactamente igual, no tendria gracia ademas de que no se que tan legal sea hacerlo, ademas ese no es el punto este cuasi tutorial.

  • jefr26

    por inconvenientes de tiempo no he podio realizar este tutorial, no se porque nunca lo he podido hacer, pero bueno, ya estoy trabajando en el nuevo diseño y dentro de poco lo verán en funcionamiento espero que les guste.

Algo que decir...

los campos marcados con * son obligatorios
 

Follow SitioAparte on Twitter

publicidad

siguenos !!

flickr

S4033928S4033927S4033926S4033925S4033924SitioAparteplazoleta de la aduanaplazoleta de la aduanaplazoleta de la aduana