Diseño y desarrollo de temas clásicos de WordPress
Aprende todo lo necesario para desarrollar temas de WordPress profesionales partiendo desde cero
- 25.7 horas de contenido
- 206 lecciones
- Nivel Intermedio
- #Backend #CSS #Desarrollo WordPress #Frontend #HTML #JavaScript #PHP #Programación #Temas
Introducción al curso
Lecciones
Consejos sobre cómo seguir este cursoPreparación del entorno de desarrollo
Introducción a los temas de WordPress
La jerarquía de WordPress
Construyendo tu primer tema de WordPress
Lecciones
¡Empezamos nueva sección! Objetivo Maquetación de la plantilla de inicio Maquetación de la plantilla de artículo Maquetación de la plantilla de página Los "Template Tags" Preparación del tema La cabecera "header.php" y el archivo de funciones "functions.php" El pie de página "footer.php" La barra lateral "sidebar.php" y el uso de widgets El contenido de la página inicial y el Loop de WordPress Adaptando la plantilla de artículo Adaptando la plantilla de páginaConstruyendo un tema completo de WordPress
Lecciones
¡Empezamos nueva sección! Objetivo Estructura básica HTML e inclusión de hojas de estilo y scripts Cabecera estática – Barra de navegación social Cabecera estática – Sección "Hero" Cabecera estática – Barra de navegación superior Plantilla de inicio estática – Listado de artículos Plantilla de inicio estática – Estilos del listado de artículos Plantilla de inicio estática – Formatos de entrada "aside" Plantilla de inicio estática – Formatos de entrada "quote" Plantilla de inicio estática – Formatos de entrada "image" Plantilla de inicio estática – Formatos de entrada "link" Plantilla de inicio estática – Formatos de entrada "video" Plantilla de inicio estática – Paginación Barra lateral estática Pie de página estático Plantilla de artículo estática – Contenido y navegación Plantilla de artículo estática – Comentarios Plantilla de artículo estática – Formulario de comentarios Plantilla de página estática Plantilla de archivo estática Plantilla de autor estática Plantilla de resultados de búsqueda estática Plantilla estática de búsqueda cuando no hay resultados Plantilla de página no encontrada 404 estática Diseño responsive – "media queries" Transformación de nuestro diseño en responsive Configuración inicial & el "Theme Domain" (slug) del tema Cabecera dinámica & inclusión de hojas de estilo Cabecera dinámica – El menú superior de un sólo nivel Pie de página dinámico & inclusión de scripts Pie de página dinámico – El menú inferior multinivel Barra lateral dinámica Plantilla de inicio dinámica – El Loop de WordPress Plantilla de inicio dinámica – La función "get_template_part" Post Formats Post Formats – "aside" Post Formats – "quote" Post Formats – "image" Post Formats – "link" Post Formats – "video" Plantilla de inicio dinámica – Paginación Plantilla de artículo dinámica Plantilla de artículo dinámica – Navegación de entradas Plantilla de artículo dinámica – Comentarios Plantilla de artículo dinámica – Función de callback Plantilla de página dinámica Plantilla de archivo dinámica & "Conditional Tags" Plantilla de autor dinámica Plantilla de resultados de búsqueda dinámica Plantilla de página no encontrada 404 dinámica Inclusión responsive de vídeos de Youtube y VimeoLa personalización de temas
Lecciones
¡Empezamos nueva sección! La personalización de temas Proceso para crear una personalización Personalizar el color principal Personalizar el color principal (hover) Personalizar el color secundario Personalizar el color de interfaz Personalizar el pie de página Personalizar redes sociales Personalizar la sección hero – background Personalizar la sección hero – background position Personalizar la sección hero – color del texto Personalizar la sección hero – sombreado del textoInternacionalización de temas
Creación de un Tema de WP para un cliente real
Lecciones
¡Empezamos nueva sección!Fase 1: Maquetación de las plantillas
Lecciones
Home – Estructura básica Home – Barra de navegación Home – Portada Home – Contenido Home – Formulario de suscripción Home – Pie de página Home – Últimos ajustes Libros – Reaprovechando código Libros – Portada Libros – Listado de no ficción Libros – Listado de ficción Libros – Últimos ajustes Asesoría – Reaprovechando código Asesoría – Servicios Blog – Reaprovechando código Blog – Formulario de suscripción y menú de categorías Blog – Listado de artículos Blog – Navegación de artículos Blog – Barra lateral y widgets Blog – Widget About Blog – Widget Formulario de suscripción Blog – Widget buscar Blog – Widget con listas Blog – Widget de texto o imagen Blog – Taxonomía y resultados de búsqueda Single – Reaprovechando código Single – Contenido del artículo Single – Vídeos responsive Single – Pie de entrada Single – Compartir en redes sociales Single – Últimos retoques Page – Reaprovechando código Page – Formularios Page – Últimos retoquesFase 2: Creación de las plantillas
Lecciones
Los temas starter Preparando una nueva instalación de WordPress Instalando Underscores "_s" Traduciendo Underscores con Loco Translate Inclusión de los assets Cómo usar LESS en WordPress (configuración de Prepros) Adaptando los estilos de Underscores Cabecera dinámica y menú superior Pie de página dinámico y llamada a los scripts Pie de página dinámico – menú footer superior Pie de página dinámico – menú footer inferiorPlantilla Home: De estática a dinámica
Lecciones
Creando plantillas de página para uso global Cargar una fuente sólo si una plantilla está en uso Plantilla de landing page dinámica El súper plugin Advanced Custom Fields Cabecera dinámica de la landing page con ACF: grupos de campos Cabecera dinámica de la landing page: mostrando valores de la BBDD con ACFPlantilla Libros: De estática a dinámica
Plantilla Asesoría: De estática a dinámica
Plantilla de blog (principal): De estática a dinámica
Creación de widgets
Plantilla de artículo: De estática a dinámica
Otras plantillas
Últimos retoques a nuestro tema y publicación del sitio web
Lecciones
Menú de navegación social con ACF Breve introducción a la plataforma de email marketing Mailrelay Formulario de suscripción de las páginas y landing pages: Parte 1 Formulario de suscripción de las páginas y landing pages- Parte 2 Formulario de suscripción de las páginas y landing pages- Parte 3 Formulario de suscripción de la página de blog y los artículos Formulario de suscripción del widget Formulario de Optin en archive.php y search.phpPublicación del sitio web y entrega al cliente
Descripción del curso
En este curso voy a enseñarte a convertir sitios web estáticos construidos con HTML, CSS y JS, en sitios web dinámicos y 100% administrables por el usuario final. Y esto lo lograrás gracias a la creación de temas de WordPress.
Qué vas a aprender
Empezaremos desde lo más básico, entendiendo qué es un tema, trataremos aspectos muy importantes como la jerarquía de plantillas de WordPress y realizaremos tres proyectos, basados en tres temas de WordPress:
Apollo 1: muy sencillo, para empezar a entender cómo funcionan los temas de WordPress.
Apollo 2: será un tema completo que contará con todas las plantillas necesarias para dirigirse a un público general.
Tema cliente: será un tema que crearemos para un cliente 100% real, donde nos tendremos que adaptar a sus distintas necesidades.
Pero no sólo eso, también aprenderás cosas como:
-Desarrollar un sitio web en local y posteriormente publicarlo en un hosting
-Conocer a fondo la Jerarquía de Plantillas de WordPress
-El manejo de Template Tags
-A utilizar el Loop de WordPress
-Crear todo tipo de plantillas
-Crear distintos formatos de entrada (Post formats)
-Definir zonas de widgets y a desarrollar tus propios widgets
-Permitir la personalización de temas al usuario final (API Customizer)
-Construir temas que sean traducibles y cómo traducirlos
-Utilizar el tema starter Underscores para ahorrarte muchas horas de desarrollo
-Crear nuevos tipos de contenidos (Custom Post Types)
-Añadir campos personalizados (Advanced Custom Fields)
-Incluso utilizaremos el framework Bootstrap 3
Resumiendo, se trata de un curso completísimo que cuenta con 25 horas de contenido en vídeo para que cuando lo hayas finalizado tengas los conocimientos y -práctica necesarios para diseñar y desarrollar sitios web WordPress para clientes.
¡Te animo a echar un vistazo al listado de lecciones más abajo y nos vemos dentro!
Requisitos del curso:
-Un nivel intermedio de HTML y CSS (requisito obligatorio para seguir el curso sin dificultad)
-Un nivel básico de PHP (realiza el mini curso PHP para WordPress)
-Conocimiento de WordPress a nivel de usuario (entender a la perfección conceptos como entradas, páginas, archivos, etiquetas, categorías…)
-Un nivel muy básico sobre jQuery
-Un editor de código gratuito como Sublime Text
-Una conexión a Internet
-Energía y ganas de comerte el mundo
Sobre David Perálvarez
Fundador y formador en SiliCodeValley.
Cuando no estoy creando lecciones compagino mi tiempo con el desarrollo de academias online a profesionales y participando en el podcast Instructores Online.