Como crear un tema para WordPress 3.x desde cero!

marzo 16, 2011

Con la actualización de WordPress a su versión 3.x, muchos themes quedaron con fallas en su funcionalidad o simplemente quedaron obsoletos, pues ésta nueva versión incluye muchas nuevas características que se detallan en este “how to”… Siguiendo algunos tutos que he visto voy a dar algunos pasos con los cuales podríamos dejar funcionando un template básico-minimalista en nuestros blogs con WordPress 3.

Recopilando el material necesario

Lo primero que necesitamos es crear los archivos básicos para nuestro template, definirlos en una carpeta en nuestro equipo para luego subirlos a nuestro servidor como un nuevo template. Yo particularmente soy de la idea de modificar todo “on-the-run”, por lo que simplemente tomaría el template “Sandbox”, alguna extensión para FireBug y con su ayuda comenzaría a trabajar, pero la idea aquí es aprender desde cero a crear un template, así que lo haremos como Dios manda, así que armense de su mejor y preferido editor de código, preparen un café, unas galletitas y comencemos con esto.

Materiales

  • Editor de códigos
  • Una carpeta en tu desktop con el nombre del theme a crear
  • Algunos archivos básicos
  • Mucha paciencia y ganas 🙂

Paso 1 – Crear todas las carpetas y archivos básicos

Lo primero que necesitamos hacer es crear una carpeta con el nombre de nuestro template (uno de los materiales que solicité al principio). En este caso, mi carpeta se llama “mi template cerocreativo”, y dentro de ella debemos crear una serie de archivos que serán los que le darán vida a nuestro template; estos son los siguientes:

style.css
header.php
index.php
single.php
footer.php
archive.php
page.php
sidebar.php
functions.php

además de una carpeta destinada a guardar las imágenes de nuestro template

/images

nos debería quedar todo más o menos como la siguiente imagen:

Paso 2 – El archivo style.css

Ahora, una vez que tenemos creados estos archivos vacíos, lo que tenemos que hacer es definir la información básica de nuestro template, tal como el autor, la url, la descripción y la versión del template. Este archivo es uno de los dos archivos realmente básicos y que no pueden faltar en ningún template; el otro es el index.php.

Agregamos entonces a nuestro archivo style.css las siguientes líneas:

/*
Theme Name: Tema Cerocreativo
Theme URI: http://www.cerocreativo.cl
Description: Un tema creado desde cero siguiendo el tutorial de Cerocreativo.cl
Author: Cerocreativo.cl
Author URI: http://www.cerocreativo.cl
Version: 1.0
*/

Estas son las líneas básicas para nombrar y poder identificar nuestro template en la galería de temas, las cuales debemos agregar como un comentario (entre los tags /* */) para que no interfiera la estructura de las declaraciones css que agregaremos más tarde.

Ahora, luego de estas líneas podríamos agregar declaraciones para estilizar el body, enlaces, cabecera, footer, etc, pero por ahora lo dejaremos tal cual.

Paso 3 – Index.php

Para entender el funcionamiento del core de WordPress, y cómo éste genera la estructura del template podríamos darle una revisada a éste enlace al Codex, donde nos explican detalladamente cómo se construye y qué archivos son llamados en determinadas ocasiones.

Sin embargo aquí explicaré con un ejemplo de index.php

<?php get_header(); ?>
<div id="contenido">
	<?php if(have_posts()) : ?>
	<?php while(have_posts()) : the_post(); ?>

	<div class="post" id="post-<?php the_ID(); ?>">
		<h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>

		<div class="post-contenido">
			<?php the_content(); ?>
			<p class="post-metadata">
				<?php _e('Archivado en:'); ?> <?php the_category(', ') ?> <?php _e('Escrito por:'); ?> <?php  the_author(); ?><br />
				<?php comments_popup_link('Sin Comentarios', '1 Comentario', '% Comentario'); ?> <?php edit_post_link('Editar', ' &#124; ', ''); ?>
			</p>
		</div>

	</div>
	<?php endwhile; ?>

	<div class="paginador">
		<?php posts_nav_link(); ?>
	</div>

	<?php endif; ?>
</div>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

Aquí hemos hecho uso de algunas funciones propias de WordPress en las líneas 1, 21 y 22, como son get_header(), get_sidebar() y get_footer(), las cuales tienen por objetivo “llamar” a los archivos header.php, sidebar.php y footer.php respectivamente, los cuales hemos creado en el paso 1. También hicimos un pequeño código (el loop de WP) el cual cargará todos los artículos que hemos escrito.

Paso 4 – Header.php

Siguiendo con la construcción, lo primero (o segundo luego de style.css) es comenzar a estructurar el archivo header.php, con el cual definiremos los meta tags, título y descripción del blog, y porque no mostrar un menú personalizado, el que se mostrará en todas nuestras páginas.

<!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" <?php language_attributes(); ?>>
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<title><?php if (is_home()) { ?><?php bloginfo('name'); ?> - <?php bloginfo('description'); ?><?php } else { ?><?php wp_title($sep = ''); ?> - <?php bloginfo('name'); ?><?php } ?></title>
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
<link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed" href="<?php bloginfo('rss2_url'); ?>" />
    <?php wp_head(); ?>
</head>

<body>
<div id="contenedor">
<div id="header">
<h1><a href="<?php echo get_option('home'); ?>" title="<?php bloginfo('name'); ?> - <?php bloginfo('description'); ?>"><?php bloginfo('name'); ?> - <?php bloginfo('description'); ?></a></h1>
<div id="menu-principal"><?php wp_nav_menu( array( 'theme_location' => 'menuprincipal' ) ); ?></div>
</div>

Aquí hemos declarado los meta para el título y descripción de nuestro blog, hemos enlazado a la hoja de estilos, definimos los feeds RSS, imprimimos en pantalla el titulo del blog y de paso insertamos un menú personalizado, el cual será definido más adelante cuando veamos el archivo functions.php.

Paso 5 – Sidebar.php

Ahora crearemos una sidebar personalizada, donde podamos agregar nuestros propios widgets y cargarlos a través del backend.


<div id="sidebar">
<?php if ( function_exists('dynamic_sidebar') && dynamic_sidebar() ) : else : ?>

<?php endif; ?>
</div>

Con éste código ya podemos mostrar una sidebar personalizada, el resto del trabajo lo hará el archivo functions.php

Paso 6 – Single.php

Este archivo se utiliza cuando ingresamos a revisar un artículo en particular, ya sea que hayamos ingresado al artículo desde el archivo de categorías, etiquetas, búsqueda o listado general, el archivo single.php será cargado por defecto si no especificamos lo contrario.

La estructura de este archivo es muy similar al index.php, con la diferencia que ahora el código del loop va a mostrar la información de un solo artículo. Va mas o menos así:

<div id="contenido">
	<?php if(have_posts()) : ?>
	<?php while(have_posts()) : the_post(); ?>

	<div class="post" id="post-<?php the_ID(); ?>">
		<h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>

		<div class="post-contenido">
			<?php the_content(); ?>
			<p class="post-metadata">
				<?php _e('Archivado en:'); ?> <?php the_category(', ') ?> <?php _e('Escrito por:'); ?> <?php  the_author(); ?><br />
				<?php comments_popup_link('Sin Comentarios', '1 Comentario', '% Comentario'); ?> <?php edit_post_link('Editar', ' &#124; ', ''); ?>
			</p>
		</div>
		<div class="post-comentarios">
			<?php comments_template(); ?>
		</div>

	</div>
	<?php endwhile; ?>

	<div class="paginador">
		<?php previous_post_link('< %link') ?> <?php next_post_link(' %link >') ?>
	</div>

	<?php endif; ?>
</div>

La única diferencia con el archivo index.php es que aquí hemos incluído los comentarios en la línea 16.

Paso 7 – Comments.php

El archivo comments.php es uno de los más simples de crear, pues wordpress 3.x ha reinventado el sistema de comentarios, haciendolo mucho más fácil de entender, personalizar y estandarizar para plugins externos.


<?php comment_form(); ?>

Sólo esa línea de código es necesaria en nuestro comments.php, ahora si queremos ir más a fondo y personalizar el formulario, podemos revisar el Codex para obtener más ayuda.

Paso 7 – Page.php

Como se podrán imaginar, este archivo page.php se encarga de mostrar el contenido que hayamos definido para cada nueva página en la seccion “Páginas” de nuestro blog. Así es una especie de clon del archivo single.php, pero con la diferencia que éste se encarga de las páginas personalizadas.

<div id="contenido">
	<?php if(have_posts()) : ?>
	<?php while(have_posts()) : the_post(); ?>

	<div class="post pagina" id="pagina-<?php the_ID(); ?>">
		<h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>

		<div class="post-contenido">
			<?php the_content(); ?>
			<p class="post-metadata">
				<?php _e('Archivado en:'); ?> <?php the_category(', ') ?> <?php _e('Escrito por:'); ?> <?php  the_author(); ?><br />
				<?php comments_popup_link('Sin Comentarios', '1 Comentario', '% Comentario'); ?> <?php edit_post_link('Editar', ' &#124; ', ''); ?>
			</p>
		</div>

	</div>
	<?php endwhile; ?>

	<div class="paginador">
		<?php posts_nav_link(); ?>
	</div>

	<?php endif; ?>
</div>

Hemos agregado aquí la clase “pagina” al div contenedor de la información para así luego poder diferenciarlo cuando se trate de trabajar con el CSS estilizando o personalizando nuestro template.

Paso 8 – Archive.php

Lo que hace diferente a este archive.php, es que es utilizado en múltiples instancias, como cuando se selecciona para visualizar una categoría, una etiqueta, los artículos de un autor, los artículos de una fecha determinada y los artículos de una taxonomía personalizada.

Se diferencia, como decía, por una seríe de sentencias condicionales que revisan por el tipo de archivo que se esta visualizando, lo demás es un loop igual al del index.php o page.php

<div id="contenido">
	<?php if(have_posts()) : ?>
	<?php while(have_posts()) : the_post(); ?>

	<?php $post = $posts[0]; ?>
      <?php /* Si es un archivo para categorías */ if (is_category()) { ?>
        <h2>Archivo para la categoría <?php single_cat_title(); ?>:</h2>
      <?php /* Si es un archivo para etiquetas */ } elseif( is_tag() ) { ?>
        <h2>Artículos etiquetados como: <?php single_tag_title(); ?></h2>
      <?php /* Si es un archivo diario */ } elseif (is_day()) { ?>
        <h2>Archivo para <?php the_time('F jS, Y'); ?>:</h2>
      <?php /* Si es un archivo mensual */ } elseif (is_month()) { ?>
        <h2>Archivo para <?php the_time('F, Y'); ?>:</h2>
      <?php /* Si es un archivo anual */ } elseif (is_year()) { ?>
        <h2>Archivo para <?php the_time('Y'); ?>:</h2>
      <?php /* Si es el archivo de autor */ } elseif (is_author()) { ?>
        <h2>Archivo del autor</h2>
      <?php /* Si el archivo ha sido paginado */ } elseif (isset($_GET['paged']) && !empty($_GET['paged'])) { ?>
        <h2>Archivo del blog</h2>
    <?php } ?>

	<div class="post pagina" id="post-<?php the_ID(); ?>">
		<h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>

		<div class="post-contenido">
			<?php the_content(); ?>
			<p class="post-metadata">
				<?php _e('Archivado en:'); ?> <?php the_category(', ') ?> <?php _e('Escrito por:'); ?> <?php  the_author(); ?><br />
				<?php comments_popup_link('Sin Comentarios', '1 Comentario', '% Comentario'); ?> <?php edit_post_link('Editar', ' &#124; ', ''); ?>
			</p>
		</div>

	</div>
	<?php endwhile; ?>

	<div class="paginador">
		<?php posts_nav_link(); ?>
	</div>

	<?php endif; ?>
</div>

Paso 9 – Footer.php

El footer.php es uno de los archivos que comunmente, al igual que sidebar.php, son usados en todas las páginas de nuestro sitio, y no es otra cosa que un par de líneas de código para mostrar algunos creditos al creador del template, enlaces de posicionamiento, o algún widget si es que queremos uno de esos footers de la web 2.0.

Para efectos del template que estamos creando, aquí he de empezar el footer.php con un div de cierre, el cual cierra el div con id=”contenido” declarado en el header.php. Ustedes pueden acomodar su template como mejor les guste.

	</div>
	<div id="piedepagina">
		<a href="http://www.cerocreativo.cl" title="Tutorial Creado en Cerocreativo.cl">Tema creado desde cero en Cerocreativo.cl</a>
	</div>
</body>
</html>

Paso 10 – Functions.php

Ya finalizando con nuestra construcción, llegamos al tan fantástico archivo functions.php, el cual es un archivo tan poderoso que, cual spiderman, debemos tratar con mucho cuidado, pues todo poder conlleva una gran responsabilidad, y es verdad, porque cometiendo un solo error en nuestro functions.php podemos dar de baja nuestro sitio por unos buenos minutor, teniendo que salvarlo accediendo al ftp, descargar el archivo, repararlo, luego volver a subir y reemplazar por el corrupto… y así una tarea muy tediosa. Así que cuidado.

Para efectos de este tutorial vamos a utilizar nuestro functions.php para dar vida al menú personalizado del header y a la sidebar personalizada declarada en sidebar.php.

<?php
//Agregamos soporte para menus personalizados
add_action('init','registrar_menu');

//Registramos un nuevo menu personalizado
function registrar_menu() {
register_nav_menu('menuprincipal', __('Menu Principal'));
}

// Registro Sidebar
register_sidebar(array(
'name' => 'Sidebar Personalizada',
'id' => 'sidebar-personalizada',
'description' => 'Estos Widgets se mostrarán en la sidebar personalizada.'
));

?>

Con estas líneas de código hemos añadido soporte a nuestro template para que podamos mostrar por lo menos un menú personalizado y una sidebar personalizada, a los cuales tendremos acceso desde el backend de wordpress y podremos modificar a gusto cuando queramos.

Conclusión

A lo largo de este tutorial hemos visto cómo crear una plantilla para wordpress desde cero, la cual es absolutamente básica, pero sirve para comenzar a entender el funcionamiento de los templates, saber que podemos agregar cuantas sidebars como queramos, agregar distintos niveles de menus, y así muchas, pero muchas funciones nuevas, como agregar soporte para miniaturas destacadas en artículos, agregar soporte para multisitio (una característica nueva en wp 3.x), agregar soporte para fondo personalizado, agregar distintas medidas de imagenes miniatura, tipos de post personalizados o custom post types, taxonomias personalizadas, distintos layouts dependiendo de la página la cual estamos revisando, y así un sin fin de etcéteras que podríamos estar listando por mucho tiempo.

La verdad es que este es un template con fines educativos, el cual puede ser utilizado como base para cualquier fin y puede ser complementado en un 100% con muchas funciones nuevas.

Info sobre actualización:

He actualizado el tutorial al día de la fecha 09.2.2012, para ofrecer el proceso completo de creación de un template por lo menos funcional; luego pretendo agregar todo lo que son los estilos CSS para que el template tome forma, y luego de aquello ofrecer los archivos utilizados en este tutorial en descarga directa. Todo en los próximos días.

Saludos.

Enlaces recomendados:

  • http://codex.wordpress.org/Template_Hierarchy
  • http://codex.wordpress.org/Function_Reference/comment_form
  • http://ottopress.com/2010/wordpress-3-0-theme-tip-the-comment-form/
  • dreek

    or Cerocreativo.cl hace 9 meses atrás, sin Comentarios D:

    no creo que se termine /:

    • jejeje, dreek, tu comentario me ha hecho repensar el asunto, y creo me pondré manos a la obra para terminar de una vez este tutorial de como crear un tema para wordpress 3.x. Ojalá que de aquí al 2012 tenga novedades.

  • David

    Que editores de codigo me recomiendas? si puede ser gratis.

    Saludos.

    • estimado David,
      El editor de código que, particularmente, creo es el mejor de todos es el notepad++, pues tiene la posibilidad de autocompletar el codigo, comparar archivos línea por línea, trabajar directamente con los archivos alojados en tu servidor mediante el soporte FTP, y muchas otras posibilidades, pues el software se puede extender a traves de diferentes plugins para añadirle nuevas funciones.

      Saludos.

  • Creo que nunka terminars xD y yo que lo necesitaba u.u xD

    • haha 😀 denny, ya verás como en unos días estará completamente documentado el tutorial 🙂

      • A quien engañas? xD Ha pasado mucho tiempo y no hay nada nuevo 🙁

        • haha, si es verdad, he descuidado este tutorial y el sitio completo… esa es la triste realidad, pero tenemos todas las intenciones de reactivarnos con todo dentro de las proximas semanas; eso es seguro ;D

          Saludos

  • lu

    Estaría genial que lo terminaras porque lo necesito y veo que explicas las cosas muy bien, paso a paso.

    Espero actualización!

    Un saludo.

    • Estimado, ahora mismo me he hecho un tiempo para terminar el tutorial, así que gracias por esperar.

    • u.u aun no lo acabas, el principio es muy bueno y me está ayudando bastante pero falta la terminacion u.u.
      Saludos! ñ_ñ

      • así es ariel, el tiempo no me ha acompañado, por lo que he dejado botado el sitio totalmente…

        esperemos que este nuevo año pueda traer nuevos contenidos…
        saludos!

  • No te ofendas, pero creo que tu articulo es solo para atraer trafico.

    Sin duda me había animado a leer todo, cuando como balde de agua fria, veo que lo dejaste antes de siquiera empezarlo.

    Espero que con tu trabajo no seas así. Saludos!
    (No perdere la esperanza y vere si regreso unos meses después)

    • Estimado Alan,
      La verdad es que el artículo está funcionando como tu dices, pero sólo porque no he tenido tiempo de actualizar. Ahora mismo estoy trabajando en la actualizacion del artículo, así que esten atentos.

      Saludos.

    • lu

      Muchisimas gracias!
      voy a empezar a hacer pruebas a ver qué tal sale la cosa.

      Gracias de nuevo 🙂

  • ahh otra pagina de pura MAMADA nada nuevo

    • Estimado,
      Como bien dice el título, es un tutorial que busca enseñar los pasos para montar un template de wordpress 3x desde cero, no dice que se creará un framework completamente original y dinámico, con efectos jquery ni css3 y html5. Proximamente incluiré modificaciones y ajustes al tutorial, pero de momento se trata de mostrar los pasos para poder conseguir hacer funcionar una plantilla realmente básica y sin ningún tipo de estilo mediante css.

  • un anonimo

    NO HAGAS CASO ES UN EXCELENTE TUTORIAL PARA LOS QUE EMPEZAMOS A CREAR TEMAS ESPERO QUE LO SIGAS LO ANTES POSSIBLE!
    UN SALUDO

    • gracias por tu comentario 🙂
      ahora mismo se está planeando una renovación al site, por lo mismo no se ha actualizado el tutorial…

      solo queda esperar las novedades ;D
      Saludos!

  • Gracias por el aporte.. esta muy buena para poder iniciar a crear un tema en WordPress

  • Gonzalo

    Saludos estimado muy interesante artículo seria genial lo continués para seguir aprendiendo. me sumo a los que piden lo sigas desarrollando. saludos

    • Estimado Gonzalo,
      Claro que esa es la idea, pues pretendo seguir agregando cada vez más detalles sobre la creación de templates cada vez más avanzados. Ahora mismo el artículo grafica la creación de un template realmente básico, pero cuando tenga un poco más de tiempo agregaré más información.

      Saludos y gracias! 😀

  • llevo buscando como hacer bien un index.php, pues los tutoriales de otros lados me daban error. Yeah!!
    Gracias por compartir el conocimiento de esta plataforma tan maravillosa que es WordPress.

    • que bueno que te sirva, pues esa es la idea de este tuto.
      Gracias!

  • Gracias por la información, llevaba buscando un tutorial donde aprender un theme para wordpress desde cero!!

  • Los codigos del functions.php me sale error “Parse error: syntax error, unexpected ‘/’ in /home/a4217397/public_html/wp-content/themes/Prototype/functions.php on line 1”
    Que sera?

    • Geolex, he revisado el código, y resultó que el sintaxis highligther cambió el formato del código, por lo que puede haber provocado errores si tu copiaste y pegaste directamente lo que aquí estaba. Ahora ya lo modifiqué para que puedas copiar y pegar el código sin problemas.

      Ya me cuentas si te sirvió o no.
      Saludos.

      • Anon

        El sintaxis highligther vuelve a funcionar mal entonces, por lo menos con Firefox, porque al seleccionar el código, se seleccionan también los números de línea.

        Me fue instructivo el tutorial, gracias 🙂

        • mmm… quizás el syntaxis highligther no es el mejor y hay que cambiarlo, ya veremos por cual lo cambiamos; pero gracias por comentar!

  • ¿¿ Soy el único que recibe error en las líneas 7 de functions.php y la línea 23 de single.php ??
    Me aparece error de sintaxis con editor Dreamweaver y no carga el theme:
    Parse error: syntax error, unexpected ‘;’ in C:\wamp\www\wordpress\wp-content\themes\ZCtemplate\functions.php on line 7

    ¿Alguna solución? Gracias por el tuto 😉

    • Rubogo83,

      Gracias por comentar el error; efectivamente en la linea 7 del functions php hay un error, pues falta cerrar el register_nav_menu()
      Debería quedar algo así:

      <?php
      //Agregamos soporte para menus personalizados
      add_action('init','registrar_menu');
       
      //Registramos un nuevo menu personalizado
      function registrar_menu() {
      register_nav_menu('menuprincipal', __('Menu Principal')); // aquí es donde estaba el error.
      }
       
      // Registro Sidebar
      register_sidebar(array(
      'name' => 'Sidebar Personalizada',
      'id' => 'sidebar-personalizada',
      'description' => 'Estos Widgets se mostrarán en la sidebar personalizada.'
      ));
       
      ?>
      

      ahora ya está corregido en el codigo del tuto.
      saludos.

    • y el single.php debes tener el error porque el syntaxis highlighter denuevo está haciendo de las suyas.
      Correjiré eso y de seguro dejaré un enlace al final del tuto para que se descarguen los archivos sin errores.

      Saludos!!

  • Antonio García

    Una duda aprovechando este buen tutorial, es imperativo usar el archivo sidebar. php o puedo tener el tema solo con el contenido, si ntener qeu agregar el sidebar?

    • Estimado Antonio,
      El archivo sidebar.php es alternativo y en ningún caso es obligación de usar, como pueden ser también el footer o header; el asunto es que wordpress entrega esas funciones (get_sidebar(), y demases) para hacernos la vida más fácil. Perfectamente podrías tener un contenido con ancho flexible, de manera que cuando no se encuentre la sidebar se ajuste a todo el ancho de la pantalla.

      Saludos.

  • Antonio (no el de arriba)

    Gracias por el tutorial ¿Lo vas a ampliar? Tengo que crear un tema desde cero y con lo que hay hasta ahora sirve para empezar un, pero da la impresión de que nos deja a medias.
    Gracias de nuevo!

    • Antonio, si; el tutorial va a ser ampliado para dar luces o los lineamientos para poder crear un theme completo, incluso en el backend.
      Lo que tenemos preparado es: agregar el archivo style.css para poder estilizar el html simple que tenemos; luego iniciar en lo que son los custom post types, custom taxonomies, y cómo se pueden aplicar para crear un portafolio; y luego en una instancia final ver algunos plugins y alternativas para crear una página de administración. Todo esto está planeado y se está trabajando, pero por razones de tiempo creo que en las próximas 1 a 2 semanas debería empezar a actualizarse.

      Saludos! y gracias por comentar! ;D

  • Antonio (no el de arriba)

    De acuerdo, gracias!!

  • Antonio (no el de arriba)

    Me acabo de dar cuenta de que los widgets que tengo activados no se muestran, ¿es correcto el código de sidebar.php o es en otra parte donde falta código?

  • Hola, gracias por el tutorial, vere si lo puedo aplicar aunque lo vea muy resumido realmente era lo que buscaba para no marearme al maquetar mi primera plantilla, animos para seguir el tuto y le di “me gusta” asique si le pones weno en el face tambien te lo agradecere mucho =P!

    • gracias por el like Aleph; voy a intentar seguir con lo que he prometido, así todos podemos aprender un poco más 😉

      saludos

  • Hola nosotros tambien estamos desarrollando un tutorial sobre la creacion de themes para WordPress, espero que me consulten sobre sus dudas tambien.

    Nuestra tutorial se encuentra aqui: http://wp.tutosp.com/crear-theme-para-wordpress-desde-cero/

    Espero no incomodar a cerocreativo.cl!!! Saludos y suerte en sus proyectos.

    Nuestro sitio solo es para compartir nuestro conocimiento con la comunidad, no lo hacemos con fines lucrativos!

    • Edwin, ningún problema, la idea aquí es compartir el conocimiento y la libertad del mismo, así que adelante y bienvenidos a publicar lo que deseen en cerocreativo.cl también.
      Saludos!

  • Hola mira, estuve tratando de mostrar un historial de noticias (entradas) en una determinada página, pero se me presentaron unos problemas, que me recomiendas para mostrar las entradas de una categoria, en este caso “noticias” y al final de el historial añadirle unos botones o textos de: siguiente, atrás, ir la primera o ir al final (de las noticias); todo esto dentro de un sidebar, es decir cuando pinche en una noticia, ésta se abra en una pagina especial previamente creada.

    Te dejo una imagen para aclarar mejor la situación:
    http://www.flickr.com/photos/67552242@N04/7948012400/

    De antemano te agradezco cualquier tipo de respuesta.

  • chack

    muy buena informacion solo los sidebar no me funciono, si la reconocio el backend pero no aparece en el frontend seguire probando gracias.

    • Javier

      Muy buen artículo. Me ayudó bastante.

      Para los que no pueden mostrar el sidebar deben agregar el id del sidebar en la llamada de la función dynamic_sidebar().

      El archivo sidebar.php quedaría como sigue:

  • Faustino Aguilar

    Muy bueno, ¡Gracias!

  • Hola Gracias por el tutorial la verdad estoy muy ansioso de aprender, me pregunto si ya se puede ver el código del css pendiente. Mil Gracias

  • Gracias por el tutorial, me pregunto si ya esta al aire el codigo del css pendiente mil gtacias

  • Solidarizando con la causa! Lo que los amigos no saben ni entienden a la primera es que estos contenidos son un aporte motivado por la buena onda, y el espíritu de compartir, pero que depende del tiempo personal libre que nos deja nuestro trabajo. Así que paciencia chicos. Hay información de calidad como esta en toda la Web para complementar lo que nos enseña nuestro amigo acá. Por otro lado, como se trata de un aporte, no esperemos que nos entreguen todo listo par allegar y utilizar, pues para eso hay páginas que ofrecen descargas de templates completos. Esto es para aprender, con un poco de esfuerzo, conciencia y práctica. Saludos a todos!