Desarrolla una tienda online con WooCommerce y Storefront

Name: Desarrolla una tienda online con WooCommerce y Storefront
Rating: 4.0 (21 reviews)

Conviértete en desarrollador de WooCommerce y aprende a desarrollar tus propios temas para crear tiendas online

Created byJhon Jairo Rincón Cardona

Last updated 2/2025

Spanish

What you'll learn

Aprenderán a desarrollar sus propios temas utilizando storefront de woocommerce
Aprenderán a modificar el código de storefront para maquetar un nuevo tema
Conocerán y utilizaran los ganchos de acción y de filtro mas importantes para el desarrollo y la maquetación del tema
Aprenderán a programar bloques personalizados desde el panel de administración de wordpress
Aprenderán a utilizar y conocerán algunos de los ganchos de acción de WooCommerce para realizar modificaciones en los productos de la tienda online
Aprenderán a programar funciones para añadir usuarios con el rol de cliente en woocommerce
Aprenderán a modificar y añadir nuevas opciones al panel de administración de mi cuenta
Aprenderán a subir el proyecto a un servidor remoto y configurar los sistemas de pago de la tienda
Aprenderán a programar funciones utilizando PHP 8.0 y 8.1

Course content

11 sections • 159 lectures • 19h 23m total length

¿Qué es WooCommerce? (Parte I)3:55
¿Qué es WooCommerce? (Parte II)6:13
VÍDEO INTRO RECURSOS UDEMY1:54
Instalando laragon en nuestro equipo5:19
Instalando wampserver6:09
Instalando wordpress en nuestro servidor local laragon9:48
Creando virtual host en wampserver para el proyecto weko10:05
WooCommerce introducción

Instalando sass para la maquetación13:18
Editando el header para crear el menú (parte I)8:44
Editando el header para crear el menú (parte II)10:25
Editando el header para crear el menú (parte II extensión php 8, 8.1, 8.2 )1:36
Editando el header para crear el menú (parte III)8:06
Editando el header para crear el menú (parte IV)6:08
Editando el header para crear el menú (parte V)9:24
Editando el header para crear el menú (parte VI)5:46
Editando el header para crear el menú (parte VII)7:24
Editando el header para crear el menú (parte VIII)6:57
Creando las páginas del menú y ajustando el diseño responsive (parte I)6:06
Creando las páginas del menú y ajustando el diseño responsive (parte II)5:49
Creando las páginas del menú y ajustando el diseño responsive (parte III)8:32
Creando las páginas del menú y ajustando el diseño responsive (parte IV)5:00
Instalando php 8.0 y 8.1 en laragon y wampserver10:24
Creando el background anímate para el menú8:30
Editando las columnas del footer (parte I)9:00
Editando las columnas del footer (parte II)7:04
Creando las páginas para el footer (parte I)9:19
Creando las páginas para el footer (parte II)7:35
Creando las páginas para el footer (parte III)5:54
Creando las páginas para el footer (parte IV)8:16
Creando las páginas para el footer (parte V)4:11
Creando el diseño de cabecera de las páginas (parte I)9:51
Creando el diseño de cabecera de las páginas (parte II)7:21

Creando el bloque servicios para la página de inicio (parte I)6:08
Creando el bloque servicios para la página de inicio (parte II)4:12
Creando el bloque servicios para la página de inicio (parte III)6:07
Creando el menú de opciones del carrousel y del bloque servicios (parte I)9:14
Creando el menú de opciones del carrousel y del bloque servicios (parte II)4:27
Creando el menú de opciones del carrousel y del bloque servicios (parte III)6:08
Creando el menú de opciones del carrousel y del bloque servicios (parte IV)8:26
Creando el menú de opciones del carrousel y del bloque servicios (parte V)5:41
Creando la página de configuración para el carrousel (parte I)10:07
Creando la página de configuración para el carrousel (parte II)7:04
Creando la página de configuración para el carrousel (parte III)7:39
Creando la página de configuración para el carrousel (parte IV)7:10
Utilizando el marco multimedia para seleccionar las imágenes del carrousel I4:25
Utilizando el marco multimedia para seleccionar las imágenes del carrousel II8:16
Utilizando el marco multimedia para seleccionar las imágenes del carrousel III8:12
Utilizando el marco multimedia para seleccionar las imágenes del carrousel IV4:05
Almacenando las imágenes del carrousel con la API options10:09
Creando el ajax para almacenar los cambios del carrousel (parte I)6:50
Creando el ajax para almacenar los cambios del carrousel (parte II)6:00
Creando el ajax para almacenar los cambios del carrousel (parte III)7:22
Creando el ajax para almacenar los cambios del carrousel (parte IV)7:07
Mostrando las imágenes del carrousel en el frontend10:15
Creando la página de ajustes para el bloque de servicios (parte I)6:47
Creando la página de ajustes para el bloque de servicios (parte II)7:19
Creando la página de ajustes para el bloque de servicios (parte III)8:13
Creando la página de ajustes para el bloque de servicios (parte IV)4:40
Creando el método ajax para para actualizar los datos de los servicios I8:11
Creando el método ajax para para actualizar los datos de los servicios II10:57
Creando el método ajax para para actualizar los datos de los servicios III5:41
Mostrando los cambios en el bloque servicios del frontend (parte I)3:30
Mostrando los cambios en el bloque servicios del frontend (parte II)7:48

Añadiendo publicaciones para el blog7:35
Editando la página de blog de storefront (parte I)9:41
Editando la página de blog de storefront (parte II)5:11
Editando la página de blog de storefront (parte III)4:20
Editando la página de blog de storefront (parte IV)6:20
Modificando el DOM para añadir clases con javascript (parte I)8:45
Modificando el DOM para añadir clases con javascript (parte II)5:59
Añadiendo el valor de los atributos para las imágenes del blog (parte I)8:24
Añadiendo el valor de los atributos para las imágenes del blog (parte II)4:57

Maquetando el bloque de productos de WooCommerce I (parte I)10:02
Maquetando el bloque de productos de WooCommerce I (parte II)2:25
Maquetando el bloque de productos de WooCommerce II (parte I)7:10
Maquetando el bloque de productos de WooCommerce II (parte II)6:12
Maquetando el bloque de categorías de WooCommerce (parte I)9:27
Maquetando el bloque de categorías de WooCommerce (parte II)7:17
Optimizando el menú y reescribiendo el archivo header.php (parte I)6:47
Optimizando el menú y reescribiendo el archivo header.php (parte II)6:42
Optimizando el menú y reescribiendo el archivo header.php (parte III)1:58
Probable error que se puede producir al reescribir el header3:09
Maquetando los bloques de productos de WooCommerce (parte I)5:30
Maquetando los bloques de productos de WooCommerce (parte II)10:44
Maquetando los bloques de productos de WooCommerce (parte III)9:35
Maquetando el bloque de productos relacionados9:38

Hooks para la página del carrito de WooCommerce (parte I)7:19
Hooks para la página del carrito de WooCommerce (parte II)6:47
Hooks para la página del carrito de WooCommerce (parte III)7:01
Hooks para la página del carrito de WooCommerce (parte IV)7:08
Hooks para la página del carrito de WooCommerce (parte V)6:49
Maquetando la página del carrito de WooCommerce (parte I)5:54
Maquetando la página del carrito de WooCommerce (parte II)8:53
Maquetando la página del carrito de WooCommerce (parte III)8:40
Maquetando la página del carrito de WooCommerce (parte IV)17:20
Maquetando la página del carrito de WooCommerce (parte V)8:18
Maquetando la página del carrito de WooCommerce (parte VI)7:17
Creando una propiedad en SASS para los estilos de los productos (parte I)8:48
Creando una propiedad en SASS para los estilos de los productos (parte II)5:57
Maquetando el widget shopping cart de woocommerce (parte I)7:48
Maquetando el widget shopping cart de woocommerce (parte II)4:31
Maquetando la página del resultado de búsqueda (parte I)6:23
Maquetando la página del resultado de búsqueda (parte II)4:29

Programando y maquetando la página my account (I)7:59
Programando y maquetando la página my account (II) parte I4:52
Programando y maquetando la página my account (II) parte II4:40
Programando y maquetando la página my account (III) parte I5:10
Programando y maquetando la página my account (III) parte II5:27
Programando y maquetando la página my account (III) parte III4:40
Insertar usuarios desde el código con el rol de cliente (parte I)6:05
Insertar usuarios desde el código con el rol de cliente (parte II)5:12
Insertar usuarios desde el código con el rol de cliente (parte III)8:46
Insertar usuarios desde el código con el rol de cliente (parte IV)6:34
Añadiendo nuevas páginas al menú My Account (parte I)9:16
Añadiendo nuevas páginas al menú My Account (parte II)8:55
Programado el menú para mostrar iconos de mi cuenta y checkout (parte I)9:02
Programado el menú para mostrar iconos de mi cuenta y checkout (parte II)7:31
Recomendaciones de storefront5:40

Requirements

Tener conocimientos básicos de html y css
Tener conocimientos básicos del manejo de wordpress
Tener conocimientos básicos de algún lenguaje de programación

Description

WooCommerce es la plataforma para E-Commerce más utilizada en todo el mundo, el 43% de todos los sitios web del mundo están hechos con wordpress y el 21% de todas las tiendas online están hechas con WooCommerce, en este curso aprenderás desde como instalar WooCommerce hasta programar y maquetar una tienda virtual 100% funcional. También aprenderás a programar nuevas funciones o extender las funciones existentes para WooCommerce y storefront.

En este curso también aprenderás:

Crear productos, asignar categorías, imágenes, precios, descuentos, inventario, medidas y mucho más.
Crear nuevos bloques para maquetar el frontend de tu tienda online.
Maquetar y personalizar la plantilla de StoreFront.
Maquetar y personalizar el plugin de WooCommerce
Programar funciones para WooCommerce
Extender funciones existentes añadiendo código a los ganchos de acción de WooCommerce.
Conocerás los ganchos de acción y de filtro mas utilizados en storefront.
Aprenderás a crear proyectos en laragon utilizando virtualhost
Aprenderás a utilizar SASS para estructurar mejor el css.
Aprenderás a realizar consultas ajax para crear bloques editables.
Aprenderás lo que son los endpoins y crearás nuevas paginas para el panel de administración de los clientes.

Si conoces wordpress y quieres aprender a crear tiendas online de forma profesional este curso es para ti, en el conocerás a fondo el código para crear funciones personalizadas y maquetar tus propios temas utilizando como base la estructura de storefront de WooCommerce.

WooCommerce y storefront son el software base para construir tiendas online, al finalizar el curso habrás aprendido a programar y personalizar WooCommerce.

Who this course is for:

Este curso va dirigido a todos aquellos que utilizan wordpress para la creación de sitios web
También va dirigido a diseñadores o especialistas en marketing que quieren adquirir algún conocimiento mas profundo a cerca de wordpress
Este curso tambien va dirigido a todas aquellas personas que han creado sitios web con WooCommerce y quieren adentrarse en la programación de tiendas online

Desarrolla una tienda online con WooCommerce y Storefront

What you'll learn

Explore related topics

Course content

Introducción7 lectures • 43min

Instalando storefront y woocommerce7 lectures • 49min

Maquetando el header y el footer25 lectures • 3hr 11min

Maquetación y programación de la pagina de Inicio31 lectures • 3hr 38min

Introducción a la página de productos e importación masiva CSV7 lectures • 1hr 2min

Maquetación del blog y programación de funciones para las imágenes9 lectures • 1hr 1min

Maquetación de los bloques de productos de woocommerce14 lectures • 1hr 37min

Maquetación de la página del carrito, el widget cart y la barra de búsqueda17 lectures • 2hr 9min

Optimizando la cabecera y maquetando la página de categorías4 lectures • 33min

Maquetando las páginas de mi cuenta y la página de pago15 lectures • 1hr 40min

Requirements

Description

Who this course is for: