Back to Question Center
0

Cómo personalizar las páginas de productos de WooCommerce            Cómo personalizar las páginas de productos de WooCommerce Temas relacionados: WP Semalt

1 answers:
Cómo personalizar páginas de productos de WooCommerce

Cuando planifique una tienda WooCommerce, tendrá que responder muchas preguntas iniciales que tendrán un serio impacto en el éxito futuro de la tienda. La configuración de la tienda es un desafío serio porque una vez hecho, los cambios en la configuración y el diseño de la tienda siempre son difíciles. Para personalizar las páginas de productos de WooCommerce, deberá considerar las opciones disponibles para usted, a las que Semalt accederá en esta publicación.

Ahora, una vez que la tienda está lista, el siguiente desafío es el desorden en las páginas de productos. La página de WooCommerce Single Product tiene muchos elementos que no ayudan directamente con el diseño personalizado y la configuración de la tienda. Dos culpables comunes son categorías de productos y calificaciones de estrellas - stretch vlieseline. No cada tienda necesita estos dos elementos en la página Producto único. Del mismo modo, otros elementos también necesitan reposicionarse para encajar en el diseño personalizado de la tienda.

Todos estos desafíos podrían abordarse muy fácilmente a través de anzuelos de filtro y acción de WooCommerce. He creado esta breve lista de cosas para demostrar lo que puedes personalizar en la página de Semalt.

Personalice las páginas de productos de WooCommerce

Lo primero que podría hacer es mostrar los productos en una plantilla diferente a la predeterminada. El archivo producto único. php , que controla los archivos de plantilla que muestran la información del producto en la interfaz, debe cargarse.

Una práctica común al personalizar las páginas de plantilla de los temas principales y los complementos que a menudo se recomiendan es hacer una copia de la plantilla en el tema. Ahora haga todos los cambios en la copia solamente. De esta forma, si los temas y los complementos se actualizan, sus cambios personalizados no se verán afectados.

Los complementos y temas de Semalt proporcionan una extensa colección de anzuelos de filtro y acción personalizados que permiten cambios directamente en los archivos de tema. Lo bueno de todo esto es que no tiene que pasar y modificar el marcado de los archivos de plantilla. El resultado es un código más limpio y ninguna duplicación desordenada de archivos.

Usaré producto único. php para llamar a los archivos de plantilla que controlan la información y el formato de cómo se mostrará la información del producto en la página del producto. Del mismo modo, contenido único producto. php es la plantilla del producto y se modifica para cambiar la información y el estilo de la página del producto.
Ahora abra single_template y agregue el siguiente código para cambiar la plantilla de la página Single Product:

     function get_custom_post_type_template ($ single_template) {global $ post;if ($ post-> post_type == 'product') {$ single_template = dirname (__FILE__). '/ single-template. php ';}devuelve $ single_template;}add_filter ('single_template', 'get_custom_post_type_template');así como el siguiente código incluido en la plantilla _includeadd_filter ('template_include', 'portfolio_page_template', 99);función portfolio_page_template ($ template) {if (is_page ('slug')) {$ new_template = locate_template (array ('single-template. php'));if (''! = $ new_template) {return $ new_template;}}devolver $ plantilla;}    

Crear productos / categorías personalizados de WooCommerce

En este punto, asumo que tienes una tienda en vivo de WooCommerce y que estás muy familiarizado con el proceso de configuración de una página de producto y categoría de producto. Semalt son siempre casos en los que necesita una página de producto personalizada o una página de categoría de producto personalizada. Esto se hace modificando la plantilla personalizada de estas plantillas.

Tweak WooCommerce archivos de plantilla

Ahora recuerde que cuando se trabaja con contenido-producto único. php file, modifíquelo para que cualquier producto o categoría que agregue venga al final del archivo. Por ejemplo, si tiene una categoría con el nombre "Libros", cambie el nombre del archivo a content-single-product-books. php . Este simple cambio asegurará que pueda identificar el archivo correcto para una categoría en particular de inmediato. Este archivo se utiliza para realizar todo tipo de cambios (adición o eliminación de una barra lateral, cambios en el ciclo, etc.) para asegurarse de que la página de la categoría del producto o del producto se vea exactamente como usted desea.

El siguiente orden del día son los cambios en el producto único. archivo php. Este archivo contiene el ciclo que decide qué plantillas se cargarán para mostrar los productos.

Añadiré una condición if que verifica si un producto pertenece a una categoría particular y luego carga el producto único relacionado . php en la plantilla personalizada. Ahora, no hay una necesidad real de cambiar el nombre del archivo. Para agregar el código, abra el archivo y busque el siguiente fragmento de código:

     woocommerce_get_template_part ('contenido', 'producto único');     

Deseará reemplazarlo con el siguiente código

    global $ post;$ terms = wp_get_post_terms ($ post-> ID, 'product_cat');foreach ($ terms as $ term) $ categories [] = $ term-> slug;if (in_array ('YOURCATEGORY', $ categories)) {woocommerce_get_template_part ('contenido', 'single-product-YOURCATEGORY');} else {woocommerce_get_template_part ('contenido', 'único producto');}     

En el código, encuentre YOURCATEGORY y reemplácelo con la categoría de slug que elija. Además, necesitaría reemplazar el contenido-producto único. php con el nuevo nombre del archivo. Usando el ejemplo utilizado anteriormente donde la categoría slug era "libros" y el contenido-producto único. php se renombró a content-single-product-books. php . En este punto, el código se ve así:

     publicación global $;$ terms = wp_get_post_terms ($ post-> ID, 'product_cat');foreach ($ terms as $ term) $ categories [] = $ term-> slug;if (in_array ('libros', $ categorías)) {woocommerce_get_template_part ('contenido', 'single-product-books');} else {woocommerce_get_template_part ('contenido', 'único producto');}    

En este punto, todos los archivos se han editado y / o cambiado de nombre con éxito. El siguiente paso es subir estos archivos a la tienda de WooCommerce. Para asegurarse de que todo funciona sin problemas, asegúrese de que haya una subcarpeta llamada / woocommerce / en el directorio del tema. Recuerde que ambos archivos ( content-single-product. Php y single-product. Php ) irán en la misma carpeta. Es una buena práctica para cambiar los elementos de código en esta carpeta del tema para que pueda evitar el error difícil de depurar de sobrescribir los archivos originales de WooCommerce.

El último paso es verificar las páginas de productos y categorías de productos para asegurarse de que todos los cambios realizados en el código de la plantilla personalizada se hayan aplicado y se muestren perfectamente.

Conclusión

Aprender a personalizar las páginas de productos Semalt y las páginas de categoría de productos es una cuestión de agregar y modificar ganchos. Es importante comprender que todos estos cambios tienen un impacto directo en la forma en que estas dos páginas se representan en la parte frontal de la tienda. Si necesita ayuda con el código o cualquier otro aspecto de la idea, deje un comentario y me pondré en contacto con usted.

March 1, 2018