Mostrar campos personalizados en el listado de productos de WooCommerce

Si utilizas ACF para completar la información de los productos de WooCommerce, puede ser muy práctico para el gestor de la tienda poder verlos directamente en el listado del administrador.


por

Advanced Custom Fields es un plugin del que hemos hablado varias veces en este blog (y del que tienes un curso completo en la Zona DPW) que es extremadamente práctico para extender la estructura de WordPress con campos adicionales en cualquier tipo de entrada, incluidos los productos de WooCommerce.

Aunque para según que tipo de información los atributos de producto pueden ser suficientes, para otra más compleja se quedan cortos, y las opciones de ACF con todos los tipos de campo que permite puede ser ideal.

Si es el caso, y has creado campos personalizados para un producto, es posible que para facilitar el día a día del gestor de la tienda, necesites mostrar ese campo, no solo en la ficha de producto, sino también en el listado del administrador de productos.

A continuación vamos a ver brevemente cómo podemos hacerlo:

Imaginemos que hemos creado un campo personalizado en ACF llamado ‘proveedor’ y lo hemos asociado al tipo de post «producto».

Mostrar campo ACF en producto WooCommerce

Como le hemos indicado que aparezca en un metabox en el lateral, al editar el producto tendremos la caja para añadir el contenido al nuevo campo:

Mostrar campo ACF en producto WooCommerce

Si queremos que aparezca ese valor en el listado de productos, podemos utilizar el siguiente código, ya sea en un plugin de snippets de código o en el archivo functions.php de nuestro tema o tema hijo.

En este snippet, primero estamos creando una nueva columna para el listado, ocultando otras que no necesitamos para ganar espacio, y en la segunda función le estamos diciendo que valor debe mostrar. (get_field() es la forma que tenemos con ACF para recuperar el valor de un campo personalizado, y ‘proveedor’ en este caso es el nombre que le hemos puesto a ese campo)

De esta forma, nos aparecerá como una nueva columna:

Mostrar campo ACF en producto WooCommerce

Como ves, es una forma relativamente sencilla de personalizar y mejorar las fichas de productos de WooCommerce y su gestión.

¿Eres implementador o desarrollador WordPress?

En la Zona DPW encontrarás más recursos, tutoriales, plantillas, y una biblioteca de snippets para poder utilizar en tu día a día y ganar tiempo en tu trabajo:

ACCEDER AHORA

Comentarios

14 respuestas a «Mostrar campos personalizados en el listado de productos de WooCommerce»

  1. Avatar de Marcelo Juarez

    |

    Esther … sos una genia!
    se nota que sabes un monton
    muy valiosa tu ayuda,
    me salvaste de una …
    Muchisimas gracias !
    saludos!
    Marcelo

    1. Avatar de esther

      |

      Gracias Marcelo, me alegra que te haya sido útil! :))

      1. Avatar de rosa ester

        |

        es muy útil pero como puedo hacer que éste nuevo dato sea posible ordenarlo?

        1. Avatar de esther

          |

          Hola Rosa!
          Me apunto preparar la ampliación del script con la opción de ordenar columna.

          Saludos!

  2. Avatar de mariana

    |

    Hola, no entiendo dónde tengo que poner el código….!? lo puse en functions.php pero no resulta

    1. Avatar de esther

      |

      Hola Mariana,

      Sí, debes ponerlo en functions.php, pero antes debes crear el campo personalizado con ACF correspondiente y sustituir en el código el nombre del campo ‘proveedor’ del ejemplo por el que corresponda.

      Saludos!

  3. Avatar de CRISTIAN

    |

    Hola esther, tengo un problema que igual me puedes ayudar. Uso custom post types con gravity para subir productos a traves de un formulario.

    >Tengo el field de precio creado y una vez sube el prdocuto, en el backedn si que aparece ese precio pero luego en el front no se muestra. No se muy bien por donde pillar esto para que se muestren esos campos que en el back si son visibles

  4. Avatar de Bernat

    |

    Hola, necesitaría poder hacer esto mismo para un CPT que he realizado a medida con este snipped:

    add_action( ‘init’, ‘crear_nou_cpt’ );
    /**
    * Registro un custom post type ‘libro’.
    *
    * @link http://codex.wordpress.org/Function_Reference/register_post_type
    */
    // Creating a clases Custom Post Type
    function crear_nou_cpt() {
    /* Añado las etiquetas que aparecerán en el escritorio de WordPress */
    $labels = array(
    ‘name’ => __( ‘Clases’, ‘post type general name’, ‘text-domain’ ),
    ‘singular_name’ => __( ‘Clases’, ‘post type general name’, ‘text-domain’ ),
    ‘menu_name’ => __( ‘Clases’, ‘text-domain’ ),
    ‘parent_item_colon’ => __( ‘Parent Clases’, ‘text-domain’ ),
    ‘all_items’ => __( ‘Totes les clases’, ‘text-domain’ ),
    ‘view_item’ => __( ‘Veure Clase’, ‘text-domain’ ),
    ‘add_new_item’ => __( ‘Afegir nova Clase’, ‘text-domain’ ),
    ‘add_new’ => __( ‘Afegir nova’, ‘text-domain’ ),
    ‘edit_item’ => __( ‘Editar Clase’, ‘text-domain’ ),
    ‘update_item’ => __( ‘Actualitzar Clase’, ‘text-domain’ ),
    ‘search_items’ => __( ‘Cercar Clase’, ‘text-domain’ ),
    ‘not_found’ => __( ‘Not Found’, ‘text-domain’ ),
    ‘not_found_in_trash’ => __( ‘Not found in Trash’, ‘text-domain’ )
    );

    /* Configuro el comportamiento y funcionalidades del nuevo custom post type */
    $args = array(
    ‘labels’ => $labels,
    ‘description’ => __( ‘Clases de yoga online’, ‘text-domain’ ),
    ‘labels’ => $labels,
    ‘supports’ => array( ‘title’, ‘editor’, ‘excerpt’, ‘author’, ‘thumbnail’, ‘revisions’, ‘custom-fields’),
    ‘public’ => true,
    ‘hierarchical’ => false,
    ‘show_ui’ => true,
    ‘show_in_menu’ => true,
    ‘show_in_nav_menus’ => true,
    ‘show_in_admin_bar’ => true,
    ‘query_var’ => true,
    ‘rewrite’ => array( ‘slug’ => ‘clases’ ),
    ‘has_archive’ => true,
    ‘can_export’ => true,
    ‘exclude_from_search’ => false,
    ‘yarpp_support’ => true,
    ‘taxonomies’ => array(‘post_tag’),
    ‘publicly_queryable’ => true,
    ‘capability_type’ => ‘post’,
    ‘menu_position’ => 3,
    ‘menu_icon’ => ‘dashicons-video-alt3’,
    );
    register_post_type( ‘clases’, $args );
    }

    // Lo enganchamos en la acción init y llamamos a la función crear_taxonomia_nova() cuando arranque
    add_action( ‘init’, ‘crear_taxonomia_nova’, 0 );

    //create a custom taxonomy name it «type» for your posts
    // * duplicar aquest bloc per cada taxonomia nova que volem afegir
    function crear_taxonomia_nova() {
    /* Configuramos las etiquetas que mostraremos en el escritorio de WordPress */
    $labels = array(
    ‘name’ => _x( ‘Clases’, ‘taxonomy general name’ ),
    ‘singular_name’ => _x( ‘Clases’, ‘taxonomy singular name’ ),
    ‘search_items’ => __( ‘Cercar clases’ ),
    ‘all_items’ => __( ‘Totes les clases’ ),
    ‘parent_item’ => __( ‘Parent Clases’ ),
    ‘parent_item_colon’ => __( ‘Parent Clases:’ ),
    ‘edit_item’ => __( ‘Editar Clase’ ),
    ‘update_item’ => __( ‘Actualitzar Clases’ ),
    ‘add_new_item’ => __( ‘Afegir nova Clase’ ),
    ‘new_item_name’ => __( ‘New Clases Name’ ),
    ‘menu_name’ => __( ‘Tipos de clases’ ),
    );

    /* Registramos la taxonomía y la configuramos como jerárquica (al estilo de las categorías) */
    register_taxonomy(‘types’,array(‘clases’), array(
    ‘hierarchical’ => true,
    ‘labels’ => $labels,
    ‘show_ui’ => true,
    ‘show_admin_column’ => true,
    ‘query_var’ => true,
    ‘rewrite’ => array( ‘slug’ => ‘clasesonline’ ),
    ));
    }

    ======

    Cómo lo puedo adaptar?

    1. Avatar de Bernat

      |

      Ya lo tengo, cambiando «manage_edit-product_columns» por «manage_edit-clases_columns», ya que «clases» es el nombre del cpt.
      Gracias por este aporte

      1. Avatar de esther

        |

        Hola Bernat!
        Genial, veo que ya es encontrado la solución, cualquier duda me dices!

        Saludos,

  5. Avatar de Luis Castillo

    |

    Hola, he creado un campo personalizado en cada producto que es «Surtido» de tipo condiconal si/no, lo que quiero es que aparezca esa casilla en el editor del pedido, para que la gente que surte pueda ir marcando que productos se van surtiendo y cuales no (en caso de faltantes), tu me puedes ayudar??

    1. Avatar de esther

      |

      Hola Luis!

      No se como has creado el campo, pero si usas Advanced Custom Fields para hacerlo, tiene opción por defecto para asignar ese campo a un pedido de WooCommerce, de esta forma te saldrá automáticamente en el editor de un pedido pero no en la web.
      Saludos!

  6. Avatar de carlos rivas

    |

    Se podria explicar donde esta getfield en la funcion que comentas porque no hay:

    «y en la segunda función le estamos diciendo que valor debe mostrar. (get_field() es la forma que tenemos con ACF para recuperar el valor de un campo personalizado»

    1. Avatar de esther

      |

      Hola Carlos, cierto! en el código de ejemplo uso un campo personalizado nativo, no uno de acf.
      Has de sustituir el get_post_meta por el get_field que comentaba.

      Saludos!
      esther.