Concepto Pixel

Recursos y Tutoriales para crear un Theme de Wordpress

Publicado en 21. Ago, 2009 por Luis Lopez Garay in Recursos, Themes Wordpress

Hacer un tema para Wordpress es una de las cosas que cualquier diseñador novato o emprendedor quisiera aprender, vale mucho la pena, es bien pagado, pero no es fácil lograr dominar este tipo de cosas. Pero para eso existe la comunidad, la hermosa gente que comparte su experiencia con los necesitados, por eso es que traigo una serie de recursos y tutoriales que te harán convertirte en tu propio (o para otros) diseñador de temas, es fácil una vez que entiendes y te acostumbras así que si quieres aprender algo útil continua leyendo este post.

Artisteer – Programa estilo Word para crear themes

Artisteer es básicamente un software de edición visual que tiene como función crear Themes para Joomla, Wordpress, Drupal entre otros. Es bastante intuitivo y facilísimo de usar porque cuenta con muchos colores, Templates y elementos insertables. Es un programa de evaluación por lo que estará limitado, pero si tienes dinero puedes comprarlo o conseguirlo a tu manera.

Descargar

Kit  para crear un theme

En WpthemerKit.Com nos traen de la mano un “Kit” para que podamos crear fácilmente un tema simplificando el complicado proceso que un theme significa. Contiene:

• Un PDF Con trozos de código en CSS
• 6 Archivos HTML y WP (PHP) en blanco listos
• Una lista de themes en formato .ODT

Los archivos en blanco tienen distinta estructura:

• A – 800 Px. de ancho y sin barras laterales.
• B – 800 Px. de ancho con barra derecha.
• C – 1000 Px. de ancho con 2 barras derechas.
• D – 1000 Px. de ancho con 1 barra derecha y una izq.
• E – 800 Px. de ancho con una barra izquierda.
• F – 1000 Px. de ancho con 2 barras izquierdas.

Descargar

Creando un Theme Premium desde cero

Este tutorial en ingles nos muestra el proceso desde cero de como se crea un Theme Premium (que no me ha gustado mucho) con detallados pasos (en ingles), les dejo la cita en ingles:

Making a premium Wordpress theme from scratch is an essential skill for designers to learn and will become increasingly important as Wordpress continues to become the web publishing tool of choice. In this two part tutorial will we cover how to make premium Wordpress themes happen. Part 1, covered below, shows how the photoshop mock up is created, and in Part 2 we’ll outline how to turn the psd into HTML/CSS and wordpress theme files.

Visitar Parte 1 – Visitar Parte 2

Colección de recursos para diseñar un theme

Posiblemente lo mejor que vas a encontrar aquí, desde blogandweb me traigo este increíble post que no me pude resistir a traerles los recursos que proponen ellos para nosotros:

Temas Desnudos (Plantillas Base)

Sirven mas que nada como guía para editar el estilo y algunas funciones, los themes ya están hechos, solo es cuestión de aplicar tus conocimientos de arte visual, CSS y algo de diseño grafico.

• Tomorrows Laundry – 4 Temas completamente en blanco en diferentes configuraciones.
• Theme Vorlage – 1 Tema en blanco y con comentarios en el código.
• Kubrick – El tema base por excelencia.
• Sandbox WordPress Theme – Un tema que contiene clases en cada elemento para solo enfocarnos en el css.
• Cutline – Un tema minimalista, sencillo y limpio para personalizar.
• Big Blue – Un tema a 3 columnas bastante genérico para personalizarlo.

Generadores de temas online

Si queremos hacerlo todo fácil, pues nos vendrá muy acorde. Estas herramientas sirven para el maquetado desde 0 con un lienzo editable, solo subimos nuestras imágenes y editamos cosas y tendremos nuestro propio theme en minutos.

• CSSEZ.
• Templatr.
• WP Generator Blog.

Tutoriales

No hay nada como conocer el tema leyendo/viendo tutoriales para no depender de temas base ni generadores, ni mucho menos de un diseñador de 200 dólares, dejo tutoriales en español:

• Infected FX. Partes: 1, 2, 3, 4
• Anieto2k. Partes: 1, 2, 3, 4, 5
• MMM. Partes: 1, 2, 3
• 12Megas. Partes: 1, 2, 3

En ingles:

• Desarrollando un tema Wordpress.
• Crear un tema wordpress en 8 pasos.
• Como diseñar un tema para wordpress.
• Como convertir cualquier diseño en un tema de wordpress.
• Guía de diseño de temas wordpress.

Inspiración

Y no cae nada mal ver grandes diseños para reforzar el concepto que tenemos en mente.

• Smashing Magazine.
• Style Crunch.
• Best Web Gallery.
• CSS Beauty.
• Web Design Inspiration.
• CSS Zen Garden.
• Web Creme.
• Fave Up.

Otros recursos

• Chuleta con los códigos básicos de wordpress
• Chuleta con las propiedades básicas de css.
• Iconos.
• Fuentes.
• Logos.

Libro de Envato sobre diseñar y maquetar un theme

Seguro han  visto por ahí un banner publicitario de un libro (en inglés) que han desarrollado Collins Ta’ eed y Harley Alexander. Se llama Rockable Press (“How to be a wordpress designer”). Ahora les digo que yo lo he comprado y ha sido una buena inversión porque este libro no solo contiene el PDF (muy completo y detallado) si no además incluye el tema en HTML (son 3 temas) y listo para subirlo a Wordpress, además del PSD (Archivo editable de Photoshop) y el tutorial en HTML para el diseño del tema y la conversión a CSS/HTML.

El libro puede ya ser encontrado en comunidades Warez, p2p y demás, pero si quieres comprarlo será una gran retribución para los autores, tu decides que camino elegir.

Comprar y mas información

Divine – Plugin de Photoshop para pasar de PSD a Wordpress

Era seguramente algo que estabas buscando, se trata de un plugin gratis para photoshop que se integra con la versión que tengas dentro de un menú. Tienes que crear un theme (respetando la semántica básica de los temas) de tamaño moderado y luego abrir el plugin, la ventana te pondrá una captura de tu diseño y cada que selecciones un elemento te dará la opción de asignarle una función o característica, para después proceder a la exportación de tu tema.

Descargar – Como funciona – Tutoriales

La mejor video serie disponible sobre pasar PSD a Wordpress

Este es posiblemente y lo afirmo, la mejor serie de videos que esta disponible en internet para la maquetación de un PSD. Jeffrey Way, del gran sitio Nettuts ha publicado hace mucho una serie de 14 videos en alta definición, narrados (en ingles) y bien explicados sobre como transformar un bonito theme en PSD a HTML y Wordpress con algunas funciones extra. El tutorial entra dentro del club Plus de Nettuts, por lo que para verlo (ese y muchos mas de la red tutsplus.com) tienes que pagar 9 dólares al mes, yo he pagado 1 mes y me he descargado las 3 partes con 14 videos, 1 PSD y Varios archivos mas con una suma total de casi 800 MB.

No te preocupes que si me mandan un correo a luis@conceptopixel.com les mandare mis datos de cuenta para que entren a la zona plus y lo puedan descargar (y muchas cosas mas de tutsplus.com) pero tienen que prometerme que no cambiaran el password, sean respetuosos con mi generosidad.

VER TUTORIAL

- – - – - – - – - – - – - – - – - – - – - – - – - – - – - – - – - – - – - – - – - – - – - – - – - – - – - – - – - – - -

Hasta aquí termina este extenso post, si tienen dudas, agradecimientos o sugerencias háganlo con un comentario, no les cuesta mas que 10 segundos o 60 a lo máximo.

Entradas Relacionadas:

1. 5 Tutoriales o recursos para crear tus emoticons
2. Designpile, un nuevo tema gratuito para Wordpress
3. 62 o Más Themes de Wordpress Gratis con Aspecto y Funciones de un Theme Premium
4. 8 Themes Profesionales de Wordpress para VideoBlogs
5. 27 Themes para Wordpress que no debes perderte