Llegará un día – antes de que te des cuenta – en que también el editor de productos de WooCommerce será el editor de bloques Gutenberg. Pero ¿y mientras tanto? ¿puedo crear y editar productos con bloques Gutenberg de WordPress?
- Respuesta corta: Sí
- Respuesta larga: Sigue leyendo…
Y no estoy hablando de añadir bloques de productos en entradas y páginas de WordPress, ya con el editor de bloques activo por defecto, sino de que el editor de productos también use bloques, pues actualmente sigue usando el editor clásico.
¿Debería usar el editor de bloques para productos WooCommerce?
Si estás satisfecho con el editor clásico de productos nada que decir, sigue con ello, todo seguirá funcionando hasta que se ponga el editor de bloques por defecto también para productos.
Cómo activar el editor de bloques para productos WooCommerce
Pero la realidad es que ya podrías estar usando el editor de bloques para crear y editar productos de WooCommerce, solo tienes que copiar y pegar este código y ya está:
/* Editor de bloques Gutenberg para productos WooCommerce */
function ayudawp_gutenberg_productos($can_edit, $post_type){
if($post_type == 'product'){
$can_edit = true;
}
return $can_edit;
}
add_filter('use_block_editor_for_post_type', 'ayudawp_gutenberg_productos', 10, 2);
La próximas vez que añadas o edites un producto WooCommerce tendrás activo por defecto del editor de bloques Gutenberg de WordPress.
Truco extra: Usa este código para otros tipos de contenido
Lo mejor de este código es que puedes adaptarlo y activar el editor de bloques para cualquier otro tipo de contenido, no solo productos.
Si tienes, por ejemplo, un tipo de contenido llamado libros, solo tendrías que hacer un pequeño cambio en el código, cambiando el tipo de contenido (product) por el que quieres a que se aplique, en este ejemplo book.
/* Editor de bloques Gutenberg para CPT book */
function ayudawp_gutenberg_libros($can_edit, $post_type){
if($post_type == 'book'){
$can_edit = true;
}
return $can_edit;
}
add_filter('use_block_editor_for_post_type', 'ayudawp_gutenberg_libros', 10, 2);
Pasarías de tener el editor clásico para el tipo de contenido libros…
A poder aprovechar todo el potencial del editor de bloques:
Limitaciones
Ahora bien, antes de hacer este cambio «temprano» debes saber que puedes encontrarte con alguna limitación. Dependerá de ti si son importantes o irrelevantes.
- El editor de la descripción corta del producto sigue siendo el clásico.
- El tema activo debe ser compatible con el editor de bloques para que se muestren sus cajas de configuración.
- Los plugins activos deben ser compatibles con el editor de bloques para que se muestren sus cajas de ajustes relativos a los productos.
- En el editor Gutenberg no se muestra la opción de visibilidad del producto (catálogo, tienda, búsquedas), que tendrás que activar aparte (ver abajo)
- Podrían desaparecer algunas taxonomías que se carguen mediante la API REST, que habrá que reactivar (ver abajo)
Por lo demás no verás ningún otro cambio, los datos de los productos siguen como siempre, y ahí no le afectará el cambio de ningún modo.
Reactivar la visibilidad del producto
Como te decía, una de las limitaciones es que en el editor de bloques Gutenberg no se muestra por defecto la opción de ajustes de visibilidad del producto, que sí tienes en el editor clásico.
En el editor de productos mediante bloques no tienes estos ajustes, sino solo los ajustes habituales de las entradas y páginas.
Pues bien, la manera más sencilla de recuperar estos ajustes es copiando y pegando en tu instalación el siguiente código, que añade una nueva caja meta al editor de bloques, con todos los ajustes de visibilidad de los productos WooCommerce:
/* Activar visibilidad de productos en editor de productos WooCommerce con Gutenberg */
function register_catalog_meta_boxes() {
global $current_screen;
if ( method_exists( $current_screen, 'is_block_editor' ) && $current_screen->is_block_editor() ) {
add_meta_box( 'catalog-visibility', __( 'Visibilidad en el catálogo', 'textdomain' ), 'product_data_visibility', 'product', 'side' );
}
}
add_action( 'add_meta_boxes', 'register_catalog_meta_boxes' );
function product_data_visibility( $post ) {
$thepostid = $post->ID;
$product_object = $thepostid ? wc_get_product( $thepostid ) : new WC_Product();
$current_visibility = $product_object->get_catalog_visibility();
$current_featured = wc_bool_to_string( $product_object->get_featured() );
$visibility_options = wc_get_product_visibility_options();
?>
<div class="misc-pub-section" id="catalog-visibility">
<?php esc_html_e( 'Visibilidad en el catálogo:', 'woocommerce' ); ?>
<strong id="catalog-visibility-display">
<?php
echo isset( $visibility_options[ $current_visibility ] ) ? esc_html( $visibility_options[ $current_visibility ] ) : esc_html( $current_visibility );
if ( 'yes' === $current_featured ) {
echo ', ' . esc_html__( 'Destacado', 'woocommerce' );
}
?>
</strong>
<a href="#catalog-visibility"
class="edit-catalog-visibility hide-if-no-js"><?php esc_html_e( 'Editar', 'woocommerce' ); ?></a>
<div id="catalog-visibility-select" class="hide-if-js">
<input type="hidden" name="current_visibility" id="current_visibility"
value="<?php echo esc_attr( $current_visibility ); ?>" />
<input type="hidden" name="current_featured" id="current_featured"
value="<?php echo esc_attr( $current_featured ); ?>" />
<?php
echo '<p>' . esc_html__( 'Este ajuste determina en qué páginas de la tienda se verá el producto.', 'woocommerce' ) . '</p>';
foreach ( $visibility_options as $name => $label ) {
echo '<input type="radio" name="_visibility" id="_visibility_' . esc_attr( $name ) . '" value="' . esc_attr( $name ) . '" ' . checked( $current_visibility, $name, false ) . ' data-label="' . esc_attr( $label ) . '" /> <label for="_visibility_' . esc_attr( $name ) . '" class="selectit">' . esc_html( $label ) . '</label><br />';
}
echo '<br /><input type="checkbox" name="_featured" id="_featured" ' . checked( $current_featured, 'yes', false ) . ' /> <label for="_featured">' . esc_html__( 'Este es un producto destacado', 'woocommerce' ) . '</label><br />';
?>
<p>
<a href="#catalog-visibility"
class="save-post-visibility hide-if-no-js button"><?php esc_html_e( 'Aceptar', 'woocommerce' ); ?></a>
<a href="#catalog-visibility"
class="cancel-post-visibility hide-if-no-js"><?php esc_html_e( 'Cancelar', 'woocommerce' ); ?></a>
</p>
</div>
</div>
<?php
}
Lo que obtienes es esto:
Hay otro modo de hacerlo, el modo nativo mediante PluginPostStatusInfo, pero es de momento mucho más complicado que el método anterior de añadir una caja meta al estilo tradicional de WooCommerce.
Reactivar taxonomías que carguen por API REST
Si solo usas taxonomías estándar de WooCommerce seguramente no te haga falta, pero cada vez más plugins permiten añadir, consultar y editar taxonomías mediante llamadas API REST.
Si echas en falta alguna taxonomía tras activar el editor de bloques en productos WooCommerce también deberías copiar y pegar este código en tu sistema:
/* Taxonomias de producto mediante REST API con editor Gutenberg */
function enable_taxonomy_rest( $args ) {
$args['show_in_rest'] = true;
return $args;
}
add_filter( 'woocommerce_taxonomy_args_product_cat', 'enable_taxonomy_rest' );
add_filter( 'woocommerce_taxonomy_args_product_tag', 'enable_taxonomy_rest' );
Y con esto ya está, ya puedes usar el editor de bloques Gutenberg de WordPress también en productos WooCommerce.
La entrada Editor de bloques Gutenberg también en productos de WooCommerce la publicó primero Fernando Tellado en Ayuda WordPress. No copies contenido, no dice nada bueno de ti a tus lectores.
0 Commentaires