Asi voy avanzando en las entradas de cada producto
Mientras que aqui viene ser mis entradas para las novedades
Me encanto esta clase, ya que no sabia como hacer un campo para productos y novedades que se diferencien entre si. uwu
Comprender las bases y el punto de partida
Bienvenida y recomendaciones
¿Cómo es un entorno de desarrollo profesional en WordPress?
Presentación del proyecto y repaso del curso de fundamentos
Crear Post Types y Archivos
¿Cómo se crea y se personaliza una categoría en WordPress?
Creemos la UI de un archivo en la web
¿Por qué es importante la navegabilidad de la web y cómo se mejora?
¿Qué es un Post Type y cómo se pueden personalizar los diferentes tipos?
¿Cómo creamos la UI de un Post Type personalizado?
Construyamos un loop personalizado
¿Qué es una taxonomía y cómo se registra una nueva?
¿Qué es un page template y cómo se utiliza?
Utilizar AJAX
¿Cómo funcionan los emails en WordPress?
¿Cómo utilizar AJAX dentro de WordPress?
Empecemos a construir un filtro dinámico para la web
Completemos la función AJAX para darle vida a nuestro filtro
La REST-API de WordPress
¿Cómo se utiliza la REST-API de WordPress?
¿Qué son y cómo funcionan los endpoints?
Hagamos el primer llamado a la API
Utilizar Bloques
¿Qué es un bloque de Gutenberg?
Creando un bloque nativo con React
Optimicemos el bloque con componentes de WordPress
Creemos el primer bloque dinámico
Mejorando la experiencia del usuario en Gutenberg con SSR (Server Side Render)
Creando bloques con ACF Pro
Crea un bloque igual al de ACF pero de forma nativa
Deployment
¿Cómo se lleva un sitio a producción?
¿Cómo podemos optimizar la indexación y el SEO de nuestro sitio?
¿Cómo defiendo a mi sitio de ataques externos y lo hago más seguro?
Finalizar el Curso
Conclusiones
No tienes acceso a esta clase
¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera
Si ya tienes una cuenta,
¿Cómo creamos la UI de un Post Type personalizado?
8/29Recursos
¿Cómo diferenciar la interfaz de productos de novedades en WordPress?
En el mundo del desarrollo web, personalizar la interfaz puede marcar una gran diferencia en la experiencia de usuario. En este contenido, te guiaré paso a paso para crear un archivo en WordPress que permitirá diferenciar la interfaz de tus productos de la de tus novedades. ¡Prepárate para potenciar la experiencia visual de tu sitio web!
¿Cómo iniciamos este proceso?
Para empezar, ingresaremos al editor de código. La meta es copiar nuestro archivo single.php, que es el que WordPress toma por defecto para mostrar contenido individual en nuestro sitio. Vamos a guardarlo con un nuevo nombre para que sea específico de nuestros productos.
- Copiar y renombrar el archivo:
- Copia el archivo
single.php. - Guarda la copia como
single-product.php. Esto se debe a que WordPress utiliza una jerarquía de plantillas y al nombrar el archivo de esta forma, automáticamente aplicará este diseño a los productos.
- Copia el archivo
¿Cómo se verifica que estamos utilizando el nuevo archivo?
Una vez que hemos creado nuestro archivo single-product.php, debemos verificar que efectivamente está en uso al visualizar un producto en nuestro sitio web. Inicialmente, puede que no veas cambios visibles, ya que acabamos de copiar el archivo sin modificar.
¿Qué cambios realizamos para personalizar la interfaz?
Ahora, vamos a modificar el archivo nuevo para que visualmente se distinga de las novedades:
-
Eliminar la navegación actual:
- Queremos personalizar y, en este caso, eliminar el segmento de navegación entre productos. Esto ofrecerá un enfoque más limpio y específico para los productos.
-
Incorporar un título distintivo:
- Incluye un título en el archivo
single-product.phpque indique que estamos viendo un producto en particular. Implementa lo siguiente dentro del archivo para mostrar el nombre del producto de manera dinámica:
<h1>Este producto es: <?php the_title(); ?></h1>- Al actualizar el sitio, debería aparecer el nombre del producto donde está aplicado este archivo.
- Incluye un título en el archivo
Con estos pasos bien claros, habrás logrado diferenciar visualmente la sección de productos de otras partes del sitio web. Recuerda que la personalización es clave para una experiencia de usuario óptima. Sigue explorando las posibilidades de WordPress y, sobre todo, no temas experimentar con nuevas ideas. ¡Avancemos juntos en este apasionante proceso de desarrollo web!
Aportes 6
Preguntas 7
Ordenar por:
El enfoque de WordPress para renderizar páginas puede parecer complejo al principio. Sin embargo, en realidad es bastante eficiente. Si tuvieras una plantilla única para cada página de tu sitio web, la personalización sería una pesadilla. El enfoque modular de WordPress con respecto a las plantillas te permite realizar cambios en un solo archivo y usar ese elemento en todo tu sitio web dondequiera que lo necesites.
Comparto screen de como va mi proyecto:
VAMOS A IR AL EDITOR DE CÓDIGO, Y copiar el archivo single guardarlo con el nombre single-producto.php producto porque es el posttype que guardamos en functions.php (register_post_type(‘producto’, $args);
a) Eliminamos la navegación para diferenciar los archivos:
<?php get_template_part( ‘template-parts/post’, ‘navigation’ ) ?>
b) Incorporamos elemento al título para probar si es el archivo en uso:
<h1>Este producto es: <?php the_title() ?></h1>
Todo muy claro. Gracias
Aquí te dejo algunas herramientas y recursos en línea para generar tipos de contenido personalizados (Custom Post Types) en WordPress:
GenerateWP (https://generatewp.com/post-type/) - una herramienta en línea gratuita que te permite generar código para tipos de contenido personalizados, taxonomías, campos personalizados y más.
Custom Post Type UI (https://es.wordpress.org/plugins/custom-post-type-ui/) - un plugin gratuito para WordPress que te permite crear tipos de contenido personalizados y taxonomías mediante una interfaz de usuario amigable.
Pods (https://pods.io/) - un plugin gratuito para WordPress que te permite crear tipos de contenido personalizados, campos personalizados y taxonomías, y también ofrece herramientas de personalización avanzadas.
Advanced Custom Fields (https://www.advancedcustomfields.com/) - un plugin premium para WordPress que te permite crear campos personalizados para tipos de contenido personalizados y otros elementos de WordPress.
Toolset (https://toolset.com/) - un plugin premium para WordPress que te permite crear tipos de contenido personalizados, campos personalizados, taxonomías y plantillas personalizadas, todo a través de una interfaz de usuario amigable.
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?