Algunos temas y plugins usan shortcodes urlencoded. Por ejemplo, este es el caso de los módulos del maquetador visual WPBakery, como Progress Bar, Round Chart o Line Chart. En esta guía explicamos cómo activar la traducción del contenido que se usa con este tipo de shortcodes.
¿Qué son los shortcodes “urlencoded”?
Cuando inserta un elemento que usa shortcodes urlencoded y cambia su editor de WordPress al modo Texto, verá que tienen un aspecto similar al siguiente.
[vc_progress_bar values="%5B%7B%22label%22%3A%22Development%20Test%22%2C%22value%22%3A%2290%22%7D%2C%7B%22label%22%3A%22Design%20Test%22%2C%22value%22%3A%2280%22%7D%2C%7B%22label%22%3A%22Marketing%22%2C%22value%22%3A%2270%22%2C%22color%22%3A%22bar_blue%22%7D%5D" title="Progress Bar Title Test" units="%"]
El value en dichos shortcodes se decodifica en un array codificado en JSON similar al siguiente:
[{"label":"Development Test","value":"90"},{"label":"Design Test","value":"80"},{"label":"Marketing","value":"70","color":"bar_blue"}]Y finalmente, ese resultado JSON también se decodifica en un array similar a este:
Array JSON decodificado
array (
0 =>
array (
'label' => 'Development Test',
'value' => '90',
),
1 =>
array (
'label' => 'Design Test',
'value' => '80',
),
2 =>
array (
'label' => 'Marketing',
'value' => '70',
'color' => 'bar_blue',
),
)Si esto le parece demasiado complejo, no se preocupe. Se trata de un proceso interno en el que usted, como usuario, no necesita intervenir.
Traducir valores en shortcodes “urlencoded”
Ahora, veamos cómo traducir las partes label y value de ese array. Antes de la versión 3.9 de WPML, era difícil traducir shortcodes de este tipo, pero ahora se puede hacer en unos pocos pasos sencillos.
1. Añada el shortcode a su archivo wpml-config.xml.
Si no tiene uno o no está familiarizado con él, esta página de documentación debería ayudarle, especialmente la sección Contenido del maquetador visual.
En su wpml-config.xml, además del código habitual que añade para un shortcode, también necesita añadir los atributos type="area" y encoding="urlencoded_json":
Shortcode de Progress Bar
<shortcode>
<tag>vc_progress_bar</tag>
<attributes>
<attribute encoding="allow_html_tags">title</attribute>
<attribute type="area" encoding="urlencoded_json">values</attribute>
</attributes>
</shortcode>2. Añada el siguiente código al archivo functions.php de su tema.
Función de Progress Bar
add_filter( 'wpml_pb_shortcode_encode', 'wpml_pb_shortcode_encode_urlencoded_json', 10, 3 );
function wpml_pb_shortcode_encode_urlencoded_json( $string, $encoding, $original_string ) {
if ( 'urlencoded_json' === $encoding ) {
$output = array();
foreach ( $original_string as $combined_key => $value ) {
$parts = explode( '_', $combined_key );
$i = array_pop( $parts );
$key = implode( '_', $parts );
$output[ $i ][ $key ] = $value;
}
$string = urlencode( json_encode( $output ) );
}
return $string;
}
add_filter( 'wpml_pb_shortcode_decode', 'wpml_pb_shortcode_decode_urlencoded_json', 10, 3 );
function wpml_pb_shortcode_decode_urlencoded_json( $string, $encoding, $original_string ) {
if ( 'urlencoded_json' === $encoding ) {
$rows = json_decode( urldecode( $original_string ), true );
$string = array();
foreach ( $rows as $i => $row ) {
foreach ( $row as $key => $value ) {
if ( in_array( $key, array( 'text', 'title', 'features', 'substring', 'btn_text', 'label', 'value', 'y_values' ) ) ) {
$string[ $key . '_' . $i ] = array( 'value' => $value, 'translate' => true );
} else {
$string[ $key . '_' . $i ] = array( 'value' => $value, 'translate' => false );
}
}
}
}
return $string;
}La parte más importante del código anterior se encuentra en la siguiente línea:
if ( in_array( $key, array( 'text', 'title', 'features', 'substring', 'btn_text', 'label', 'value', 'y_values' ) ) )
Aquí, debe añadir las claves correctas que puede obtener del array JSON decodificado. En nuestro ejemplo, serían label y value.
¡Y eso es todo! Ahora, en el Editor de traducción, verá los campos label y value de esos shortcodes y estarán listos para su traducción.
Editor de traducción: “label” y “value” disponibles para su traducción