• Ir a navegación principal
  • Ir al contenido principal
SiliCodeValley

SiliCodeValley

Cursos online de diseño y desarrollo WordPress

  • Cursos
  • Tutoriales
  • Directos
  • Cuenta
    • Tu membresía
  • Acceder
  • Empieza gratis

Desarrollo de temas hijo para Genesis Framework

Sobre este curso

En este curso aprenderás a desarrollar un tema hijo para Genesis Framework de inicio a fin. Para ello aplicaremos todos los conocimientos aprendidos hasta ahora sobre el framework, en los dos anteriores cursos.

El tema que crearemos será para un sitio web que pretende promocionar un espacio de coworking.

Qué vas a aprender

  • Cómo crear tu propio starter theme a partir de el tema hijo gratuito Genesis Sample. De esta forma podrás usarlo como punto de partida en tus futuros proyectos con Genesis Framework.
  • Te mostraré el proceso a seguir que utilizo durante el desarrollo de un tema hijo. Esta vez en lugar de maquetar primero todas las plantillas y luego dinamizarlas, lo haremos directamente sobre nuestro starter theme, página por página y sección por sección, utilizando los hooks de Genesis, áreas de widgets, custom fields (con ACF) y nuevos tipos personalizados (CPT).
  • Cómo utilizar la librería de jQuery Isotope que nos permite filtrar elementos desde el frontend.

En definitiva te mostraré una nueva forma de desarrollar temas de WordPress, para que puedas decidir si te gusta más utilizar el enfoque clásico que ya aprendiste o trabajar con un framework como Genesis.

Requisitos del curso

  • Se recomienda haber cursado previamente: Diseño y desarrollo de temas de WordPress, Creación de Temas Hijo (Child Themes), Introducción a los Hooks de WordPress: Acciones y Filtros, Introducción a Genesis Framework y Personalizando temas con Genesis Framework
  • Un editor de código gratuito como Sublime Text
  • Una instalación de WordPress local
  • Una conexión a Internet

Módulos

Introducción

Lección

  • Prerrequisitos y herramientas que vas a necesitar

Creación de un Starter Theme

Lecciones

  • Creación de un Starter Theme
  • De CSS a LESS – Variables y mixins
  • De CSS a LESS – División de archivos
  • De CSS a LESS – Anidación de selectores
  • Eliminación de funcionalidades extras y últimos retoques

Empezamos la creación del Tema Hijo

Lecciones

  • Descripción del proyecto y enfoque que seguiremos
  • Plugins esenciales, fuentes y colores
  • Barra de navegación
  • Pie de página y widgets
  • Forzar full-width layout y eliminar áreas de widget

Plantilla Inicial "Home"

Lecciones

  • Cabecera – Enfoque Widget HTML
  • Cabecera – Enfoque Advanced Custom Fields
  • Imágenes destacadas
  • Descripción destacada
  • Widget de llamada a la acción

Página "Espacios"

Lecciones

  • Creación del CPT «sala»
  • Cabecera
  • Listado de salas
  • Definición de estilos del listado y «media queries»

Página "Tarifas"

Lecciones

  • Reaprovechando código anterior
  • Maquetación de la Tabla de Precios
  • Dinamización de la Tabla de Precios
  • Maquetación de Servicios Comunes
  • Dinamización de Servicios Comunes

Página "Coworkers"

Lecciones

  • Creación del CPT «miembro» y la taxonomía «profesión»
  • Preparación de la plantilla e instalación de Isotope
  • Maquetación de las secciones
  • Dinamización de las secciones
  • Filtrando con Isotope

Página "Únete"

Lecciones

  • Creación y configuración del formulario
  • Definición de estilos del formulario

Retoques finales a nuestro tema

Lecciones

  • Limpiando el panel de administración
  • Podando el código sobrante

Personalizando temas con Genesis Framework
HTML y CSS para WordPress

  • Blog
  • Acerca
  • Contacto
  • Privacidad
  • Términos
  • Aviso Legal
  • Cookies

Utilizamos cookies propias y analíticas para darte la mejor experiencia en nuestra web.

Puedes informarte más sobre qué cookies estamos utilizando o desactivarlas en los AJUSTES.

Resumen de privacidad
SiliCodeValley

Esta web utiliza cookies propias y analíticas para que podamos ofrecerte la mejor experiencia de usuario posible. La información de las cookies se almacena en tu navegador y realiza funciones tales como reconocerte cuando vuelves a nuestra web o ayudar a nuestro equipo a comprender qué secciones de la web encuentras más interesantes y útiles.

Cookies estrictamente necesarias

Las cookies estrictamente necesarias tiene que activarse siempre para que podamos guardar tus preferencias de ajustes de cookies.

Cookies analíticas

Esta web utiliza Google Analytics para recopilar información anónima tal como el número de visitantes del sitio, o las páginas más populares.

Dejar esta cookie activa nos permite mejorar nuestra web.

¡Por favor, activa primero las cookies estrictamente necesarias para que podamos guardar tus preferencias!

Mostrar detalles
Nombre Proveedor Propósito Duración
_ga Google Analytics Cookie de terceros persistente con fines analíticos. Se usa para distinguir a los usuarios. 2 años
_gat Google Analytics Cookie de terceros persistente con fines analíticos. Se usa para limitar el porcentaje de solicitudes. 1 minuto
_gid Google Analytics Cookie de terceros persistente con fines analíticos. Se usa para distinguir a los usuarios. 24 horas
Política de cookies

Más información sobre nuestra política de cookies