Maquetando un theme de WordPress
Fecha: 11-Feb-2010 | Autor: Marcelo.
Guardado en: HTML y CSS, Themes
Hoy es nuevamente un Jueves de WordPress y nos toca aprender a maquetar un tema para WordPress. La semana pasada habíamos realizado el diseño del tema y hoy lo maquetaremos.
Preparé para ello un videotutorial, que quizá quedó un poquito largo pero espero que puedan disfrutarlo igual. Además, al final de este post encontrarán para descargar el archivo fuente en PSD (Photoshop, Gimp, etc.), y los archivos del tema maquetado (HTML, CSS e imágenes).
Noah
11. Feb, 2010
Muy bueno el video, los tutoriales en video cuando estan bien hechos por mas largos que sean son un orgasmo.
Pedro Pablo
11. Feb, 2010
Muy bien explicado y sin duda da solución a uno de los grandes quebraderos de cabeza para los que usamos Wordpress pero sabemos muy poco de programar. Gracias!!
Marcelo
11. Feb, 2010
Noah, Pedro Pablo: muchas gracias por sus comentarios :) me alegra mucho que estos videotutoriales que estoy realizando realmente sean de utilidad ;)
Federico
11. Feb, 2010
Bueno! Termine de verlo todo, la verdad muy bueno! Se me ocurre que una vez terminada esta serie, podrías si tenes ganas y tiempo, ir ampliando los videotutoriales con por ejemplo, como hacer para que este mismo theme tenga dos sidebars, que soporten widgets, etc etc… Quizás me estoy adelantando, ahora a esperar una semanita mas :D
Mike
11. Feb, 2010
Estupendo !!!
Estoy en mis inicios de programación HTML – PHP y en verdad aunque fué largo el tutorial, me quedó bastante bien explicado todo.
Excelente la manera de explicarlo paso a paso.
luchosar
11. Feb, 2010
Excelente tu trabajo. Pero no me queda duda que hay que conocer bastante de CSS.
Fernando
11. Feb, 2010
La verdad estoy sorprendido , no sabia que se podia hacer eso en CSS, digamos de agrupar los class ,id y link.
Sin palabras, buen material , esperando al otro Jueves ;)
No estaria mal que explicaras tambien el tema de los comentarios o hacer la maquetacion en xhtml , css y despues integrarla a wordpress.
Gracias nuevo!
Salidos !
Fernando
11. Feb, 2010
Hola de nuevo :P, despues estaria bueno que cada uno muestre su theme creado, yo estoy diseñando el mio en photoshop, que te parece Marcelo ?
T_mix
12. Feb, 2010
muy bueno el video, ahora tendre que aplicarlo…. gracias y espero la proxima entrega!
bye
att:Taz
Lukas
12. Feb, 2010
Hello… Como todos los Jueves de Wordpress… Acá estoy…
1. Se te olvidó ponerle el link al “Indice” de la página principal de “Jueves de Wordpress”.
2. Maquetar es una cruz!!! ¡La vida! Personalmente tuve que hacer todo el diseñó de nuevo – el truco lo descubrí cuando me bajé tu archivo de Photoshop, hacerlo todo por capa – Y entonces estoy atascado en la parte de ponerle el borde superior, cuando lo pego los dos juntos no se corresponen… Y entonces no sé como mover las columnas hacia los lados para que entonces puedan “caer” como van… heheheh… Pero me gusta porque mi HTML+CSS está casi igual al de mi diseño :D
3. ¿Dónde puede encontrar uno un manual o algo parecido con respecto a CSS, sobre las notaciones, sus usos, etc? Personalmente lo estoy haciendo a base de prueba y error, y así no es tan divertido… :P
Marcelo
12. Feb, 2010
Federico, gracias por el comentario y estoy de acuerdo, es buena idea la de ir luego extendiendo los #JuevesDeWordpress el uso de nuestro theme ;)
Mike, luchosar, de verdad muchas gracias por sus comentarios, dan ganas de seguir invirtiendo esfuerzo en esto, sabiendo que a varios le es útil!
Fernando, sin duda el próximo jueves se explicará como integrarlo y hacer funcionar los comentarios, etc… y me gustó la idea de que luego todos (los que quieran) lo compartan…
T_mix, gracias por el comentario!
Lukas, gracias por el recordatorio del link ;)
En los próximos días voy a intentar compartir (tengo que encontrarlo) y manual que me ayudó mucho a comenzar con xhtml y css que si mal no recuerdo estaba liberado bajo CreativeCommons, asi que podemos compartirlo sin problemas ;)
Sobre tu problema con las columnas, no debes mover las columnas en el HTML sino mover la imágen superior para que coincida donde YA ESTAN tus columnas ;)
Leonardo (@leoachear)
14. Feb, 2010
Domingo…mate…sillón…notebook….”Jueves de WordPress” (aunque sea domingo)…¿qué mas puedo pedir?
Muy bueno lo que hacés, se me pasó volando el videotutorial.
¿Cuánto falta para el jueves? Uh 4 días…
¡Un abrazo!
PD: Posicionan bien tus blogs en Google. Te encontré buscando “aprender php” y salió primero phpnight.
Gosunkugi
30. Mar, 2010
WAAAA *casi morí* 45 minutos de tutorial! me impresiona la velocidad con que lo hace… aspiro llegar a hacerlo asi de rápido :)
Una cosita… siempre recomiendan usar la medida de las fuente en em… que piensas de eso?
Cristian Forero
16. Abr, 2010
Le agradezo mucho el material que has publicado en jueves de wordpress, mi actual trabajo de diseñador tiene mucho que ver con esto y pues durante gran parte de mi experiencia he sido un diseñador editorial, pero quize empezar a forjar camino por el diseño web, pero por mi poca experiencia había enfrentado gran cantidad de tropiezos en cuanto a maquetación refiere, su tutorial me ayudo un resto, gracias.
Saludos desde Colombia!