Cómo crear una Tienda Online ✅ con WordPress & WooCommerce 🔥 DESDE CERO
Вставка
- Опубліковано 31 лип 2024
- Aprende cómo crear una Tienda Online real desde cero con WordPress & WooCommerce.
✅ SiteGround con máximo descuento: 👉 drp.li/L9wcw
✅ Astra PRO al mejor precio: 👉 bit.ly/3UTmKlh
🔥 Recursos descargables GRATIS del vídeo & copia de la web: 👉 drp.li/tjwIH
🛠️ Servicios profesionales de Alegría: 👉 rli.to/tlZbE
🛠️ Plugins adicionales: 👉 rli.to/zQZkv
** Cómo crear una Tienda Online en WordPress y WooCommerce **
Autor: Alegría de tuwebconalegria.com. Alegría cuenta con más de 15 años de experiencia con sus propias tiendas y las de sus clientes.
En este tutorial vas a ganar 15 años de experiencia y vas a ahorrar muchos errores. Vas a crear una tienda real como un profesional yendo paso a paso de la mano de Alegría.
Es una tienda muy completa, con un diseño profesional y 100% adaptada a dispositivos móviles (diseño "responsive"). Esta tienda online te valdrá tanto para venta de productos como para venta de servicios.
Empezamos desde cero, no necesitas ningún conocimiento técnico, no tienes que hacerlo todo seguido, puedes ir paso a paso y volver cuando quieras con la ayuda de la tabla de contenidos de abajo.
Coméntanos tus dudas, lo que te parece el vídeo, etc. ¡Y no te olvides de suscribirte con campanilla a este canal para avisos de nuevos vídeos!
0:00 Intro.
0:45 Vistazo rápido a la web que crearemos juntos.
4:35 Contratación del Hosting & Dominio + Instalación WordPress.
15:18 Activación SSL y configuración de WordPress.
26:52 Instalación del tema WordPress.
28:22 Instalación de los plugins básicos.
29:38 Creamos la estructura de páginas de la web. Sitemap.
30:56 Creamos las páginas legales obligatorias con las plantillas gratuitas descargables.
34:24 Subimos las imágenes de la tienda a la web.
36:50 Personalizamos el diseño global, colores, tipografías, creamos el menú de la cabecera y la diseñamos con nuestro logo.
48:41 Creamos el pie de página (footer).
55:05 Diseñamos la página de inicio (home page).
1:27:00 Diseñamos la página de contacto.
1:34:20 Diseñamos la página de nosotros.
1:41:02 Instalamos y configuramos WooCommerce. Pasarela de pago. Stripe.
1:57:27 Categorías y productos simples y variables, creamos atributos de productos.
2:19:20 Creamos servicios (productos virtuales) y aprendemos la edición masiva de productos.
2:27:10 Creamos las páginas de clases y de productos. Aprendemos a usar shortcodes y filtros de WooCommerce.
2:40:50 Un poco de magia con CSS...
2:42:17 Repaso y pedido final, cupones, añadiendo mi cuenta y carrito. Personalizamos los correos de confirmación de pedido.
2:56:10 Blog, scroll y plugin de RRSS.
3:06:40 Cómo seguir: cómo indexar nuestra web en Google y consejos PRO.
Tutoriales mencionados en el vídeo + cursos útiles:
🔥 Tutorial básico HTML: 👉 drp.li/bhxtj
🔥 Tutorial básico CSS: 👉 drp.li/RRVUw
🔥 Tutorial "Cómo crear un blog": 👉 t.ly/E53K
🔥 Tutorial Apuntar dominio a hosting: 👉 drp.li/PVynL
🔥 Tutorial Posicionamiento web (SEO) desde cero: 👉 bit.ly/3TQ0Jmd y • [Webinar] Taller SEO o...
🔥 Tutorial elegir colores web: 👉 • 🎨 La psicología del CO...
🔥 Explicación codificación colores: 👉 • APRENDE ▶ Qué es el Mo... y es.wikipedia.org/wiki/Colores...
🔥 Tutorial configurar envíos bien: 👉 • Cómo CONFIGURAR ENVÍOS...
🔥 Tutorial Stripe: 👉 • Introducción a Stripe ...
🔥 Tutorial Google Analytics: 👉 drp.li/VB9UE
🔥 Tutorial Google Search Console: 👉 drp.li/p2VbE
🔥 Tutorial SEO: 👉 drp.li/opmGW
👨🏻🎓 Curso de diseñador web profesional GRATIS: 👉 bit.ly/33CPxTh
👨🏻🎓 Curso de Excel para principiantes GRATIS: 👉 bit.ly/3kKpuRq
Síguenos también en las redes sociales de Ciudadano 2.0:
1.) Instagram: ibit.ly/3BX0
2.) Facebook: ibit.ly/Hmf8
3.) Twitter: ibit.ly/Pncv
Omg contigo aprendi todo, despues de ver tantos videos y tan aburridos.. tu voz es hermosa .. muchas gracias
Súper este video, muy fuerte, gracias Alegria
Gracias 😊
Desde Colombia, !que maravilla excelencia pura! Gracias, Gracias, gracias.
Muchas gracias por tus amables palabras. 😊
Sin palabras!!! solo destacar el profesionalismo y excelente contenido de muy alto valor. "Alegría" que dulce voz, muy agradable al oido del receptor.
Muchas gracias por tus amables palabras. Y si no te has suscrito aún, ya sabes. 😊
Muchas gracias 😊
Muchas gracias por este excelente y útil video. Muy claro todo.
Gracias 🙏🏼
Muy bueno el video. Es mi primera vez reo una tienda. Con lo unico que me estoy volviendo loca es con los colores
I love this Ale!!!!!❤️❤️❤️
😍😍😍 thanks Jica!!!
Muchas gracias😊
A ti por ver el tutorial y tu comentario 😊
Buenas!lo mejor que vi nunca, pura canelita, que gustazo, llevo con mi web una semana y todo son problemas, como se podría decir por fin veo la luz, infinitas gracias Alegría! Este pedazo tutorial se merece miles de likes. Un saludo grandote desde Barcelona.😉👏
Muchas gracias 🙏🏼
suscripción nueva !!!! te mereces un millón y mas
🤍🙏🏼
Lo mejor que he visto en mi vida. Al fin alguien que explica las cosas de verdad. Mil puntos🙂
Me alegro muchísimo porque esto ha sido precisamente el objetivo del vídeo.
Una pregunta: ¿te ha parecido entonces también acertado que no usasemos plantillas?
Gracias 🙏🏼
Enhorabuena!!!!! Menudo video!!!! Quë crack!!!! Gracias por tanta información tan valiosa y bien contada. Un hurra!!!
Mucha gracias, genial que te haya gustado 🤗
Muchas gracias 😉
Gran trabajo, gracias por compartir
Gracias 😊
MUCHISIMAS GRACIAS POR EXPLICARLO TAN BIEN, ES EL SEGUNDO VIDEO TUYO QUE ME SALVA LA VIDA, GRACIASS¡¡¡¡¡
Muchas gracias por tus amables palabras. Y si no te has suscrito aún, ya sabes. Además, así nos ayudas a crecer el canal. 😊
Gracias 😊
Muchas gracias por este super-tutorial, el mejor que he visto!!!.
Me alegro mucho de que te haya sido útil. 😊
Muchas gracias
WOW Hola Alegria!!!! Qué buen video de verdad muchísimas gracias bella dama, Me atrevo a decir que es el mejor video que he visto y muy, pero muy bien explicado muchísimas gracias y que tengas un bello y exitoso día bendiciones.
Muchas gracias por tus amables palabras. 😊
Muchas gracias 😊
Grandísimo Tutorial para principiantes !!!! Muchas gracias por compartir toda esta información.
Muchas gracias a ti por tu amable comentario. Es tremendamente satisfactorio recibir esa acogida tan cálida después de la panzada de trabajo que ha sido este vídeo... 😊
Muchas gracias
Increíble el tutorial!! Lo mejor que he visto. Hasta ahora siempre me usado Elementor, pero la verdad es que después de ver el tutorial, me lo voy a pensar 😁
Muchas gracias Javi. Sí, la verdad es que hay opciones muy interesantes más allá de Elementor 😉
Muchas gracias ! Esta forma os abre muchas más posibilidades y evitamos actualización de Elementor o de cualquier otro que nos limiten o que no permitan seguir el vídeo. A por ello, queremos ver vuestras tiendas !
Excelente tutorial
Gracias! 😊
Madre mia pedazo de tutorial!! Llegue de "casualidad" buscando tutoriales de WooCommerce actualizados, lo "guardar para ver mas tarde" junto con otros 7 tutoriales y no se porque empece por este. Me dio buena impresion ver que estaba minutado y justo encontre lo que buscaba en el minuto 2:27:10 (shortcodes), vi ese trozo y quise ver todo el tutorial desde el principio. Una autentica maravilla, explicado de Zero to Mastery, la voz y el tono de Alegria te mantiene atento a la pantalla diciendo "por favor dame mas" y muy cuidados esos detalles de "descansa un poco y luego seguimos". Enhorabuena y gracias por tan currado tutorial. Por supuesto he anyadido para ver mas tarde los tutoriales sugeridos, pero este seguro que lo volvere a consultar mas de una vez. Bueno. Chao y gracias. RECOMENDADO AL 100%
Muchísimas gracias también por tus amables palabras. 😊
Muchísimas gracias de corazón.
Excelente video tutorial, muy profesional y bien explicado, solo una cosa seria bueno que lo realizara con plantillas y css gracias por su servicio y vocación para los que estamos empezando este oficio de desarrollo y diseño de productos digitales tecnológicos
Hola Nando, como se explica en el propio vídeo, lo hemos hecho sin plantillas para cerciorarnos de que la gente aprenda las cosas importantes desde cero. Una vez hecho, eso instalar una plantilla (si te refieres a las plantillas de inicio) es trivial. Y si la quieres modificar, tendrás mucho más criterio para hacerlo que sin esa base que sentamos aquí en el tutorial.
Por otra parte, entrar a fondo en CSS y HTML se sale completamente del ámbito de este tutorial y es demasiado algo demasiado complicado y tedioso para la gran mayoría del público al que se dirige este vídeo.
Por eso, damos solamente unas pinceladas muy breves en la sección PRO para que se entienda lo que es y remitimos a referencias terceras para quienes quieran aprenderlo.
Te dejamos también aquí los recursos mencionados en el vídeo:
✅ El hosting de SiteGround con máximo descuento: 👉 bit.ly/3dSd3y7
🔥 Recursos descargables GRATIS del vídeo & copia de la web: 👉 bit.ly/3QpJ5pq
🛠 Servicios profesionales de Alegría: 👉 bit.ly/35iWXyb
🛠 Plugins adicionales: 👉 bit.ly/2OOoH5O
Tutoriales mencionados en el vídeo + cursos útiles:
🔥 Tutorial básico HTML: 👉 bit.ly/3WU1JbB
🔥 Tutorial básico CSS: 👉 bit.ly/2LFvMEc
🔥 Tutorial "Cómo crear un blog": 👉 t.ly/E53K
🔥 Tutorial SiteGround: 👉 ua-cam.com/video/V2vePwBmG5Q/v-deo.html
🔥 Tutorial Apuntar dominio a hosting: 👉 ua-cam.com/video/V2vePwBmG5Q/v-deo.html
🔥 Tutorial Posicionamiento web (SEO) desde cero: 👉 bit.ly/3TQ0Jmd y ua-cam.com/video/cDQ4k8zq_AE/v-deo.html
🔥 Tutorial elegir colores web: 👉 ua-cam.com/video/Yt6lRN3_MNQ/v-deo.html
🔥 Explicación codificación colores: 👉 ua-cam.com/video/5aDqILReKsY/v-deo.html y es.wikipedia.org/wiki/Colores_web
🔥 Tutorial configurar envíos bien: 👉 ua-cam.com/video/Sceoqd1s9O8/v-deo.html
🔥 Tutorial Stripe: 👉 ua-cam.com/video/d38QXjPy3Gs/v-deo.html
👨🏻🎓 Curso de diseñador web profesional GRATIS: 👉 bit.ly/33CPxTh
👨🏻🎓 Curso de Excel para principiantes GRATIS: 👉 bit.ly/3kKpuRq
Mil gracias por compartir tus conocimientos de forma desinteresada. Que Dios te lo pague. Si puedes me podrías dar una referencia a un tutorial o video para agregar en la cabecera, una barra de búsqueda en este proyecto. De nuevo mil gracias
Directamente en personalizar cabecera pulsas en añadir dónde lo querías y te da la opción de buscador 😊
Es lo mejor que he visto para aprender, lo haces de forma clara y precisa, y por cierto la voz es maravillosa. Sin embargo soy muy novato y me van surgiendo algunas dudas pues yo voy haciendo mi propia página siguiendo tus enseñanzas y adaptándola (mi página es mucho más sencilla que la que explicas). De momento tengo dos dudas: una es que no me funciona el formulario de contacto (lo he probado y no me llegan los mensajes). He leído algo en la web de WPForms sobre SMTP pero no lo entiendo muy bien. La otra duda es si se pueden hacer dos menús diferentes en diferentes cabeceras, es decir diferentes de color pues en algunas cabeceras de páginas hay una imagen de fondo y en otras (las páginas legales) está en blanco el fondo de la cabecera y obviamente hay que adaptar el color del menú a cada fondo. Muchas gracias por tu tiempo y te felicito por este excelente tutorial.
En cuanto al email, efectivamente, los tiros probablemente vayan por dónde dices: que el mecanismo por defecto de WordPress no está funcionando y necesitas integrar con SMTP que quiere decir en castellano que necesitas algún plugin de WordPress que te permite conectar tu web a un servidor de correo tuyo para que el email se envíe a través de ese servidor de correo. Si buscas "SMTP WordPress" te saldrán tutoriales sobre este tema.
En cuanto a las cabeceras, sí se puede, incluso en la versión gratuita de Astra. La clave es que configurarlo en la cabecera normal por un lado y en la transparente en el otro. Estamos publicando un curso de Astra actualmente, te será útil para esto.
hola, gracias por el video, me queda la sigueinte duda:
espectra es igual que elementor?
que diferencia hay entre espectra y elementor?
si quiero colocar un video de yotube como le puedo colocar una imagn superpuesta para que me permita darle clic al video de yotube, espero me entinedas, como funciona en elementor.
Muchísimas gracias, qué maravilla!!
Hablas de muchas cosas que sabía a medias y aquí están clarísimas y paso a paso.
¿Te puedo pasar una página que tengo medio montada y que me des presupuesto para acabarla con todas las herramientas de eficiencia que describes aquí? No sabía que hubiese tantas posibilidades y se ve que las manejas al dedillo.
¡Muchas gracias Luis! Hay muuucho curro detrás. 😉
Gracias Luis ! ❤ claro por supuesto envíame lo que necesites.
great!
Gracias 😊
Thanks!
Hola!! primero que nada, muchas gracias por tan espectacular tutorial! Una genialidad! Quisiera hacerte una consulta, en la parte del video: 2:07:10 mostras cómo se ve el producto en la tienda, y tanto los talles cómo el color se visualizan en un cuadro, a mi me aparecen uno al lado del otro y desordenados, cómo podría hacer para que aparezcan cómo tu ejemplo? en cuadro queda mas prolijo, muchas gracias, y espero puedas ver mi mensaje 😀
En opciones de personalizar WooCommerce
Qué bien explicado, Alegría!😊
Me gustaría hacerte una consulta porque hice mi página web con tu anterior video y con Elementor. ¿Es posible ir rediseñando con Spectra, por ejemplo creando páginas como borrador o que no se vean, y al final eliminar todo lo diseñado con Elementor? ¿Esto puede generar mucha "basura" y hacer muy lenta la página? ¿Cúal sería la mejor forma para cambiar deElementor a Spectra?
Muchas gracias por todo el contenido que ofreces.
Sip, lo he probado y no hay problema. Puedes ir sustituyendo poco a poco. Y gracias por tu comentario 🥰
Buenas tardes, me quedaría saber cómo un cliente puede hacer una devolución, hice todo como en el vídeo y me ayudó un montón, lo único que con el tema de los pedidos cuando cambio el estado notifica de algunas cosas y de otras no. Muchas gracias por el video
Pronto publicaremos un tutorial. Suscribite al canal si aún no lo has hecho para que te salte la notificación.
Magnífico video... una pregunta la optimización de las imagenes a WEBp... como lo haces por un plugin? hay algún vídeo donde lo explicas? muchas gracias
Estamos publicando hoy cómo hacerlo 😊
Un buen video el mejor que he visto lo unico que tengo una consulta he creado la tienda ya y me ha quedado increible pero no me extraña con tus explicaciones lo unico que cuando abro en el menu de movil se me ven todas las paginas que tengo creadas las de aviso legal las de politica de cookies y todas yo solo quiero que se vean las del menu de cabezera pero no se de donde se toca si me pueden ayudar se lo agradeceria es lo que me falta para ponerla en marcha ya, muchas gracias
Revisa en cabecera pulsando en móvil el menú que tienes seleccionado. Hay que revisar la cabecera en tablet y móvil. 😊
Hola alegria, gran video me ayudo muchisimo. Quiero preguntarte si el código css solo corrige el margen en escritorio? lo aplique y lo corregi pero en movil aun se puede ver igual.
Hola Wilmer, sí el CSS se ha centrado en la versión web. La elaboración de los detalles para la versión móvil, ya como ejercicio para los alumnos. 😉
Hola! tengo una pregunta sobre la pagina de "tienda" donde se visualizan los productos. Es posible personalizar un poco esta pagina para agregarle un header al menos? gracias de antemano! Es tal vez el mejor tutorial que he visto en internet
Gracias! Si, si sigues los pasos verás que distinguimos entre mostrar productos en página o en categoría. Precisamente para que veáis la diferencia, con página puedes diseñar y añadir una cabecera y en categorías no (al menos sin código ni plugins). Lo puedes ver en el paso 15. Desde el minutaje en la descripción te lleva directamente 😊
Espectacular tutorial! Me surge una duda, actualmente tengo el hosting con Siteground y lifetime con Divi. ¿Consideras que es una buena opción para crear mi tienda online o es mejor que me decante por otro tema más liviano (Astra Pro, Generate Press, Genesis...) ? Muchas gracias por tus contenidos!
Si estás con Divi y te va bien, mi recomendación es no cambiarlo de momento. Vete meditándolo con calma y cuando tengas que renovar la licencia de Divi, quizás ya no te merezca la pena y sea el momento de plantearte migrar.
Hola otra vez...gracias por vuestro trabajo. Quería haceros una pregunta para saber si se puede poner una celda en productos donde nos pueda escribir el cliente una observación o una reseña
Gracias por todo!
Gracias a ti. Lo tienes por defecto en el paso de pedido, ahí el cliente puede dejar comentarios. Y en cada producto tienes las valoraciones también activadas por defecto.
Hola excelente tutorial ! ..se puede aplicar para vender cursos o productos digitales ,?
Si por supuesto elige producto virtual y es lo mismo.
Un abrazo y mi agradecimiento desde Honduras, por tan excelente tutorial. Tengo una sola consulta, que ojalá puedan ayudarme. COmo debo crear un Producto que se puede vender descargable o fisico a la vez... Por ejemplo un libro, es el mismo producto pero lo puedo vender en Formato Digital (PDF) a un precio menor, pero tambien puedo vender el Libro impreso por envio... Y asi tengo libros en distintas categorias (Misterio, Infantiles, Biografias, Estudio, etc) pero como debo crear el producto Variable...? Muchas gracias nuevamente
Mi recomendación es que crees dos, uno físico y otro descargable y los enlaces como producto recomendado uno con otro 😊
Me encantan tus videos...explicas genial...Una pregunta se podría añadir un campo para personalizar, por ejemplo para escribir el nombre?...gracias!
¿Pero dónde exactamente? ¿En cuál(es) de los diferentes formularios?
@@c2cero Gracias por responder, sería en el apartado de producto. Podemos poner de alguna manera la opción de personalizar igual que se ponen colores, poner también un nombre?...Pedro, Juan, Alicia...
Gracias!!!
El tutorial es espectacular! Mi web debo hacerla multilingüe, que plugin me recomendáis que sea compatible con este tema?
Hola Gabriela, como vas a necesitar seguramente no sólo múltiples idiomas, sino también múltiples monedas, etc., probablemente, en tu caso, uno de los plugins que mejor te pueda encajar sea éste:
wordpress.org/plugins/woocommerce-multilingual/
Efectivamente, también necesitaré multidivisas. Entiendo que el WPML no es gratuito. Hay alguno que sea gratuito y sus prestaciones sean similares?
buenisimo el tutorial!!! haces referencia al tutorial en la seccion PRO, eso donde sería??
Fíjate en la descripción en el índice y pulsando sobre el minutaje te lleva
Muchas gracias por tus amables palabras, ¡Un abrazo! 🤗
Hola, muy buen video, todo paso a paso y con los recursos necesarios para lograr el mismo resultado, muchas gracias. Sólo una consulta, las imágenes están disponibles para descargarlas?
Os dejamos todo, si! Lo tenéis en la descripción y ahora en el comentario de Ciudadano 2.0
Hola Mario, las imágenes vienen con la copia de seguridad. Pero nos has puesto sobre la pista, y las vamos a añadir de manera separada también. En unas horas, mañana más tardar, está. ¡Muchas gracias!
Ya hemos añadido las imágenes aparte dentro del .zip descargable.
@@c2cero gracias excelente
Muchas gracias por el tutorial.
Tengo una consulta a ver si podríais ayudarme.
En el Home tengo unos artículos como los mas vendidos y sale bien pero el único problema es que mee salen las tallas debajo de la foto. Como podría quitarlo para que no me salgan pero si salgan cuando entra en el producto.
Gracias.
En principio, aquí podría atacar con CSS personalizado:
.home .product-size {
display: none;
}
Buenas tardes, podriais aconsejarme que plugin utilizar para un slider? Muchas gracias.
El propio plugin de Spectra que se usa en el vídeo para mejorar el editor de bloques lleva uno. Te recomendaría probarlo para ver si te da lo que necesitas y evitas la instalación de un plugin adicional que siempre es bueno.
Muchas gracias por este maravilloso tutorial. Mi pregunta es como una vez redimensionada la imagen la convierto a formato webp?
Muchas gracias.
Simplemente utiliza la opción de "Archivo / Exportar como" de Photopea. 😉
@@c2cero Muuuchisimas gracias. Hacéis una labor estupenda 🥰
hola como estas muy buen tutorial ,una pregunta en el celular me sale mezclado el menu de cabecera y pie de pagina en la cabecera superior
Hola Nando, ¿has revisado tu diseño en la vista móvil?
El curso está muy bien y completo, pero hay momentos q habría q explicar cómo hacer las cosas, como por ejemplo en los encabezados para poner un texto largo..a mí no me deja..si hago copiar y pegar se me crea cm párrafo y etc y tb otras cosas q he seguido en el video tutorial, ya q si es la primera vez q se utiliza este editor de bloques...hay cosas q si no la sabes de cierto te cuesta..a mí me pasa a veces cn Elementor. Gracias
Ten en cuenta que estamos concentrando muchas cosas en poco tiempo. Si no, el tutorial se nos hace inabordable y se va a 10 horas...
Sí eso es cierto también... ya q encima el curso son de 3 horas..tb puse este comentario para q me respondierais a ciertas dudas. De todas formas demasiado q explicas bien y sobretodo tu voz Alegría q a mi me tranquiliza y me ayuda a seguir con el tutorial :)
Y por esto ya me suscribi pq me parece buena metodología q aplicáis al aprender en este canal. Gracias por contestarme y seguid así ;)
Muchísimas gracias me alegro mucho.😊
buenas tardes para una tienda en linia de lenceria para poder montrar una guia de tallas al lado del producto como puedo hacer
muchas gracias por este video tan bueno
Pronto publicaremos tutorial. Suscríbete para que te salte la notificación.
Hola, estoy siguiendo los pasos al pie de la letra pero cuando voy a la vista movil nunca me queda en el tamaño correcto, hay algún tamaño estándar para configurar los contenedores?gracias
Hola Mariana. No hay ningún tamaño estándar. Eso ya es completamente a tu gusto. Un truco: te recomiendo usar también la vista móvil de Chrome: pulsa F12, te tiene que salir un panel con diferentes elementos en la derecha (puede también que te salga abajo). Ese panel tiene un menú y en los dos iconos en el lado izquierdo de ese menú haz clic en el derecho, el que que es móvil encima de una tablet. Aquí puedes simular diferentes tipos de móviles y es una vista móvil bastante mejor que la propia de WordPress. Posiblemente esto te pongas las cosas más fáciles.
hola queria consultar si esto aplica tambien para uruguay ya que no veo en las opciones seleccionar mi pais gracias
¿A qué opciones te refieres exactamente?
Hola . Estoy realizando mi ecomerce siguiendo tu tutorial y adaptandolo a mis necesidades. La verdad es que es un trabajo muy laborioso y sin tu ayuda, seria imposible de seguir.
Mi pregunta es, donde puedo localizar los shortcode, que no los encuentro en las carpetas de recursos que has dejado. Los codigos css si que estan( duplicados), pero yo no veo los shortcode. Me ayudas por favor?
Muchisimas gracias.
Los shortcodes no vienen en los recursos porque los que estamos usando se ven tal cual en el tutorial o se insertan automáticamente al insertar bloques de WooCommerce. En cualquier caso, tienes la lista de shortcodes y documentación correspondiente en la web de WooCommerce:
woocommerce.com/document/woocommerce-shortcodes/
Hola Alegría, Un tutorial estupendo, me está ayudando un montón, pero hay una cosa que no soy capaz de solucionar y es que cuando creo botones e intento enlazarlos a otra página de la web, desde preajustes/contenido/link, no me van a ninguna parte ¿cómo puedo solucionarlo?
Gracias. Asegúrate que estás posicionado sobre el botón y prueba sobre el propio botón en la cadenita. De todas formas donde dices debe funcionar quizás sea la url que estás pegando. Si es fuera de la misma página que sea la url completa y si es un anclaje en la propia página asegúrate de que tengas creado ese anclaje y que lo enlaces con la # delante.😊
Hola, me ha encando el video y he seguido los pasos y estoy fascinada con el resultado. Aun me falta la parte pro, pero cuando voy a revisar mi pagina, en el movil cuando entro en las 3 rayitas, me aparecen todas las paginas, incluso las que estan en la parte inferior, la tienda aparece al final. En el ordenador está perfecto. Como hago? Porque el video lo he visto un par de veces y no encuentro como arreglarlo
El menú para móvil es un menú diferente al de escritorio. Vete a la configuración de los menús y localiza el menú móvil.
una pregunta por que en el editor de spectra versión móvil se ve muy bien, pero si le doy inspeccionar todo esta mal, los márgenes quedan fuera de lugar, por que??
pues solo me he respondido, ingresan a su web desde su teléfono (android) y no se ve ningún problema con el diseño, a seguir! ahora solo me quedan un problema tengo unos iconos de redes sociales que no puedo borrar, me aparecen antes del pie de pagina. gracias si me ayudan
Para personas que compran un producto digital a España desde países de Latinoamérica (por ejemplo) hay muchas que no pueden usar su targeta de crédito. ¿Qué método de pago recomendáis?
Stripe y añadiría Google pay y Apple Pay.
@@ConAlegriaa gracias🥰
Buenas, en las opciones de la columna de la derecha solo me aparece container y no me aparece bloque, es porque tengo que actualiza a astra pro? Muchas gracias!!
No hace falta revisa bien cada paso puedes parar el vídeo o hacer que vaya más lento😊
hola, una pregunta: ¿La parte de los impuestos no me queda claro si toma el % de IVA de tu país automáticamente o debo hacer alguna operación con códig😖? ¿Si quiero conectar una plataforma tipo Print On Demand o Marketplaces, también dependiendo del país donde yo estoy (Italia) y adonde venda🗺 , cómo puedo tener información en ello? Gracias
Nada de código, sigue el paso y verás que lo añadimos manual 😊
@@ConAlegriaa Grazie Mille!
Hola buenas gracias por explicar tan bien
Pero cómo podemos instalar esas plantillas legales ??
No se instalan es texto.
Buenas tardes, los tutoriáles son geniales. Tengo un problema al llegar a la configuración de Stripe, al intentar conectar no se parece en nada a las instrucciones dadas en el video y no consigo hacerlo, se ve que se a actualizado el modo de acceder a Stripe y no lo logro. ¿hay una actualización sobre este asunto que pueda ver?
Hola Roberto, esas cosas lamentablemente son inevitable, las interfaces de usuarios cambian constantemnete. Eso sí, no te asustes porque lo que apenas suele variar son los conceptos, simplemente se presentan las cosas de otra manera. Dicho esto: en UA-cam puedes buscar vídeos específicos sobre esto en particular. Mi recomendación es que los ordenes por fecha para que te salgan realmente todos los vídeos, no sólo los vídeos de canales grandes y bien posicionados.
Hola, acabo de empezar, ya he hecho el pago, tengo un dominio nuevo, pero en configuración de WordPress, no me deja hacer nada, es como si mi dominio no existiese, ¿Tengo que esperar alguna activación o algo? Gracias
Con los dominios recién registrados es posible que tengan que transcurrir unas horas para que el dominio esté plenamente operativo (propagación del dominio). Si el problema persiste, comentaselo al soporte del hosting. Ellos te ayudarán a solucionarlo.
consulta: por defecto se me activo el fondo transparente en todos los botones, sin embargo me gustaría conservar el color naranja en el botón de agregar al carrito, intente dándole en inspeccionar, cambiar a color naranja, copiar el código ya modificado y pegarlo en CSS, pero me cambio también los botones de la tienda a naranja, ayuda! gracias de antemano....
Hazlo desde spectra mejor
Hola muchas gracias por el video, me parece una buena enseñanza. Felicidades. A parte me gustaría comentarte, no se porque pero en la versión móvil el desplegable hamburguesa donde está el menú no me funciona, tu sabrías porque? te ha pasado? Gracias
Si te refieres a que no se ve, es posible que sea un problema de colores, que no se vea porque las rayas de la hamburguesa y el fondo sean el mismo color o muy parecido. En ese caso, es solo cuestión de cambiar los colores.
Exactamente me refiero que el desplegable no funciona cuando pasa a ser de móvil, sabrías cual es la solución
Hola muchas gracias por este tutorial, cuando configuró stripe lo pagos me aparecen desactivados, como puedo arreglar esto?
Contacta con soporte de stripe
Hola he instalado el CADDY par el carrito y por otro lado tengo la página de finalizar compra. Sabría decirme como enlazar el carrito con la página de finalizar compra? no lo consigo. Mil gracias
No conozco Caddy no sabría decirte 😅
Hola, saludos desde Colombia. A mi me sucede que NO me está leyendo la estilos . Cuando voy a ver la página en otro navegador o incluso en el mismo donde estoy desarrollando el sitio , no salen las imágenes , ni los colores de los botones, ni el texto con los colores y tamaños que se le asignaron durante la edición de la página home en Spectra. Que estará pasando?
Hola Duly, es muy extraño lo que comentas. ¿Has guardado la página? Si es en la previsualización puede pasar a veces que no te esté visualizando la versión correcta de la página. Pero si la guardas, debe funcionar siempre.
Es posible que el woocommerce no funcione si no es la version pro de astra?
No, funciona perfectamente con la versión gratuita. Si estás teniendo problemas tiene que ser por otro motivo.
Hola, no me aparece para descargar el plugin AddtoButton. Como es en ese caso?
Fíjate bien cómo se escribe escríbelo exactamente igual y saldrá 😊
Buenas tardes, me gustaria saber si el tema es de pago, o si se puede utilizar todos los recursos gratuitamente, gracias
Tanto el tema como los plugins que usamos en el vídeo son gratuitos. Pero del tema hay también una versión de pago, Astra Pro. No la usamos en el vídeo, usamos la versión gratuita, pero sugerimos la versión de pago para quienes quieran tener más opciones de personalización.
@@c2cero Muchas gracias por ofrecer información optima e inmediata
Tema y plugins gratuitos 😮
Buenos dias, porqué me mezcla la home y redes sociales con la cabecera? Como lo separo? En elñ video sale debajo de la cabecera.........Gracias.
Pueden ser varias cosas, ¿en qué paso del vídeo del vídeo te está pasando exactamente? Ponnos por favor el momento del vídeo (hh:mm:ss) en el que está pasando. Otra opción es que restaures la copia de seguridad descargable y veas cómo está hecho ahí.
Asegúrate que la cabecera la maquetas en personalizar maquetador de cabeceras y el pie en maquetador de pie. Si ya has usado “sociales” en el pie cuidado no sea un elemento que hayas escogido en la cabecera. Si repasas ambos pasos y los haces igual no debes tener problema.
Hola! no me funciona el plugin de spectra. No se pueden añadir bloques...
Asegúrate que esté activado no solo instalado sino activado 😊
Tengo un inconveniente, ahora cuando intento acceder al wordpress la página me saca, la vuelvo a instalar y nada. Pensé que era cosa de contraseña pero ya la restauré y no puedo acceder. Por favor ayúdame
Es un comportamiento muy raro el que describes. Tiene pinta de alguna configuración a nivel de servidor que está dando problemas. Repórtalo con tu hosting. Ellos pueden acceder al servidor y ayudarte, desde aquí es imposible decirte más.
Tengo un problema a la hora de añadir las imagenes. Me las carga pero no se visualizan. Y a la hora de elegir el logo me ocurre lo mismo, me redirige a recortar pero no hay imagen. Donde puede estar el fallo? Por lo demás, un video excelente. Muchas gracias!
Si ves que las imágenes se cargan, pero no muestra las imágenes, suele haber dos causas principales: un plugin incompatible y/o permisos de archivo inadecuados. ¿Has instalado algún plugin adicional a los mencionados en el tutorial? ¿Y, estás usando el hosting que recomendamos? En todo, caso esto es un caso típico para el servicio de soporte del hosting. Dirígete a ellos, porque para diagnosticar con certeza el problema y solucionarlo seguramente sea necesario acceder a tu instalación.
Buenas tardes, llegado a este punto no me deja entrar en personalizar, da fallo, he borrado el plugin de pago y no entiendo, sigue sin funcionar, puedes ayudar, gracias.
Para poder ayudarte necesitaríamos saber a qué punto te refieres.
@@ConAlegriaa Cierto, en cuanto descargo el woocommerce me da fallo y no me deja entrar en "personalizar" y, en la pagina "tienda" , me enseña la pagina "home", no entiendo.......???? Gracias por ayudarme.
Hola, en el minuto 16:48 dices que en algún momento te expulsará y que lo hará por seguridad y que luego sólo tienes q volver a entrar, pero a mí me expulsó y ya no me ha dejado volver a entrar, de eso hace dos días y sigo sin poder entrar y no me sale ningún mensaje de error ni me pone nada de lo q ha pasado. No se qué hacer😢
Hola Ana, es muy raro. ¿Seguro que estás usando el nombre y usuario correctos? En cualquier caso, la propia pantalla de login tiene un enlace para recuperar/reestablecer la contraseña. Haz clic, sigue los pasos y deberías poder solucionar el problema.
muchas gracias! arreglado
Hola: estoy haciendo el diseño de la web y el menú de inicio se ve tal y como yo quiero en la versión escritorio , pero no sé que pasa que en la versión móvil que aparece todo desordenado, y elementos que van en el pie de página siguen apareciendo cuando no debería de ser así ¿Cómo puedo solucionarlo? Muchísimas gracias
Cuando tengas el menú cómo quieres desde maquetador de cabecera pulsa en la versión móvil y ajusta lo que necesites. Es simplemente que tienes que adaptar el menú a la versión móvil. Lo del pie de pagina no lo entiendo bien si quieres dadnos más detalle y tratamos de ayudarte. Siempre está la opción de que retrocedas y hagas este paso exacto cómo lo hacemos en el vídeo. 😊
@@ConAlegriaa con lo del pie de página me refiero a las secciones de información y enlaces legales, están en el pie de página pero me siguen apareciendo en el menú de inicio en la versión móvil. Además desde que instale woo commerce, me aparece también la página de finalizar compra, y los menús desplegables no aparecen como tales, no muestra las categorías, y todo esto esto intento editarlo en la versión móvil, pero es que en el editor me voy a la versión móvil y me aparece bien (desplegables y cada cosa en su sitio, no aparece la página finalizar compra). Vaya parrafada que te estoy echando pero es la única cosa que no logro solucionar, porque lo has explicado todo increíblemente bien. Gracias
@@noeliagonzalez44 Difícil ayudarte por aquí son muchos puntos. Pero sospecho que entrando por el maquetador de cabeceras y yendo a la versión móvil te posas sobre el elemento que quieras eliminar y lo quitas. Es raro pero quizás te está colocando el menu de pie de página y no el de cabecera en la versión móvil. Lo mismo con finalizar compra o cualquier elemento que no quieras tienes que localizarlo desde maquetador de cabeceras. No se me ocurre más. :(
@@ConAlegriaa Solucionado, borré el menú en la versión de móvil, lo añadí otra vez y ahora aparece todo ordenado y en su sitio. Un millón de gracias!!!!
Buenos dias, por favor, como puedo cambiar el tamaño de letra en un widget del menu del pie de pagina, no lo consigo, gracias.
Los widgets están algo limitados. Va a tomar el tamaño que le hayas dado en los ajustes globales a los h2-h3. Prueba a subir los tamaños ahí 😊
@@ConAlegriaa Muchas gracias!
@@selimfresko3488 entiendo que has probado sobre la barra que contiene los widgets del pie de pagina en el lado izquierdo las opciones que te da dentro de Design y en tipografía. Ahí te deja ajustes básicos 😊
He instalado la tienda con woocommerce y no me funciona, no puedo acceder a personalizar, booro el plugin de woocommerce y todo funciona bien, en la pagina de la tienda, no se porque me aparece la home...........................ayudadme si posible, gracias.
Lo siento Selim, pero pueden ser mil pequeños detalles en los que te hayas equivocado. Desde aquí no te podemos dar soporte. ¿Qué hosting estás usando?
¿Cómo podemos configurar pagos por Bizum si usamos Stripe?
Bizum tiene que ser con tpv virtual de momento solo ofrecido por redsys.
@@ConAlegriaa gracias! 🥰
Exactamente me refiero que el desplegable no funciona cuando pasa a ser de móvil, sabrías cual es la solución? lo he hecho con Astra
A qué desplegable te refieres? Y si indicas el momento del vídeo, nos facilitas la respuesta.
Me refiero a cuando se crea la cabecera. En el momento que se pone en tamaño móbil el desplegable del menú no funciona. 🙂@@c2cero
Tienes que colocar el menú de “móvil” editando en maquetador de cabeceras la vista de móvil
Buenas, estoy siguiendo el tutorial para mi tienda y es una pasada como me está quedando.
Pero me he quedado atascada al comienzo de la tienda.
Yo no quiero una página de tienda con un desplegable, quiero un menú tienda, de hecho tengo creado mi menú secundario, con las categorías de los productos, pero ahora donde me pide la página de la tienda, no sé qué poner..🥹.
Me podéis ayudar con esto o decirme dónde me puedo dirigir para que me guíen en este paso??
Mil gracias por todo lo que nos aportas.
No sé si te entiendo bien, pero quizás te estás refiriendo a un mega-menú que es una opción que viene con la versión profesional del pago de Astra y que se menciona al final, en la sección PRO.
@@c2cero gracias... No he llegado aún a esa parte.. hay algún correo para hablar con vosotros directamente??
Crea el menú que quieras siempre en principal. Asigna la página de tienda que quieras no te afecta.
@@ConAlegriaa gracias.. lo conseguí hacer anoche. Enhorabuena por este pedazo de tutorial... El mejor, con el mejor resultado... Me está quedando chulísima... Mil gracias ☺️
@@margabermudezhidalgo1013 me alegro muchísimo
Valla q buen tutorial soy un emprendedor y queriendo superarme ya q e vendido monedas y billetes antiguos
Adelante, deseando ver vuestros resultados.
Pues a por ello a tope con tu tienda 😉
¿Cómo configuramos las facturas de los pedidos para que generen series según el producto? (por ejemplo)
Para facturar suelo utilizar ERPs como holded, contasimple. Cualquiera que tenga integración con WooCommerce.🙂
@@ConAlegriaa gracias🥰
Como se descargan las plantillas legales , no lo encuentro. Gracias
Accede a los recursos desde la descripción del vídeo 😊
Hola es con Astra pro?
No, el tutorial se hace con la versión gratuita de Astra.
18:05 Configuración de WordPress.
Gracias por el aporte 😊
y como transfiero el dinero de mis ventas a mi cuenta?, no encuentro la opción
Si se refiere a Stripe debe contactar con ellos 😊
Hola, no funciona el link a los recursos descargables.
Hola Mariana, hemos comprobado el enlace y está funcionando bien. Prueba desde otro dispositivo a ver si ha podido tener que ver.
36:05 Paréntesis sobre las imágenes.
Gracias por el aporte 😊
Alegría es mi madre
Buenas, alguien me puede decir por qué mi imagen de fondo no me ocupa todo el ancho de la pantalla?
Entiendo que lo estás haciendo como en el tutorial: con un contenedor Spectra. En este caso, revisa el apartado de propiedades "Contenedor" dentro de la pestaña "General" y cerciórate de que tienes el contenedor configurado con "Ancho completo".
@@c2cero Lo tengo seleccionado y nada, llevo días intentándolo pero no doy con la solución. Cuando estoy en la pantalla de edición y cierro la vista de lista si que me ocupa todo el ancho de la pantalla, pero cuando voy a vista previa se centra la foto dejando bastante margen en ambos lados
Buenos días. En el minuto 32:14, alguien puede explcarme las plantillas en formato.dotx, no entiendo como se realiza el texto que se muestra en pantalla en el minuto 32:23. Muchas gracias
This image cannot be processed by the web server. Convert it to JPEG or PNG before uploading. En Media tengo el error. Como subo el formato webp?
Cual plugin de wordpress sirve para que habilite el formato webp. Tengo la versión 6.4.3, he leido que despues de la version 5.9 acepta el formato webp. No sé si es necesario habilitar este formado en Media, pero no encuentro la forma de hacerlo. Requiero de su ayuda. Gracias mil.
Noto que si paso de webp a png el tamaño del archivo se aumenta considerablemente. Por ej. cabecera-ofertas.webp (de 32kB) a cabecera-ofertas.pngg(106kb).
¿Qué herramienta recomendáis para empezar con el mail marketing sin costes y pudiendo automatizar lo máximo posible conectándola a una tienda online de WooCommerce en WordPress?
Sin duda, Mailrelay. Aquí tienes un tutorial: www.ciudadano2cero.com/tutorial-mailrelay-wordpress/
Las otras preguntas, las responde mejor Alegría que es la experta. 😉
Si, mailrelay es la opción que os damos en la sección PRO
Gracias a los dos! Un placer haber escuchado vuestro webinar☺️
Hay cosas q me las tengo q inventar por intuición ya q se de esto y practique mucho cn Elementor...pero cn este de Spectra me está costando seguiros en un sitio web q estoy haciendo como vosotros.. mi recomendación es q hay q pararse y explicar mejor según q cosas..pq no todos sabemos hacerlas a la primera. Gracias
Las etiquetas H no se pueden utilizar arbitrariamente como se está haciendo, utilizar de título H1 y de subtítulo H5, o H2 y H5, eso "no" es correcto; para utilizar un H5 previamente se debió haber usado antes H3 y H4; para un subtítulo en este caso es más adecuado una etiqueta "p"
Perdona que te diga, pero eso no es así. No tienes que usar un H3 o H4 como "condición previa" para poder usar un H5. No sé si lo dices por SEO o por qué motivo, pero en cualquier caso es incorrecto.
@@c2cero, las etiquetas H a pesar de haber mucha literatura oficial al respecto, han sido uno de los temas más controvertidos a la hora de usarlas correctamente; tu web puede funcionar perfectamente sin ninguna etiqueta h1 o con cinco etiquetas h1 en un mismo documento, o practicar usar h1 en el título y para el subtítulo h5, no hay problema, funcionará perfecto, pero tener una buena jerarquía de etiquetas H, siempre comenzando con , luego usar y así, sucesivamente, hace que la página pueda aspirar a muchas características especiales en las busquedas de Google, como resultados enriquecidos, calificación de comentarios y mucho más. La tecnología de asistencia del lector de pantalla puede interpretar la estructura de cualquier página web y leerla en voz alta para los usuarios con discapacidad, si la jerarquía de las etiquetas H no es la adecuada se confundirán e irán de un lado a otro para encontrar el siguiente encabezado lógico, provocando su abandono.
Todo iba muy bien hasta que llegamos la zona de crear (productos y servicios) yo me he perdido😕😕😕😕😕😕😕😕🤦♂🤦♂🤦♂🤦♂🤦♂🤦♂🤦♂🤦♂
Vamos algo rápido para no hacer el vídeo eterno. Si vuelves atrás en el vídeo, seguro que vuelves a coger el hilo 😉
DESCARGADAS
Estupendo. 😊
Demasiado rapido
Es verdad que el vídeo va algo rápido en algunos tramos, pero no queríamos hacer un vídeo de 4 horas, pero sí mantener un contenido muy detallado. Lo soluciona fácil con el reproductor de UA-cam donde puedes bajar la velocidad de reproducción.
😅