Saltar navegación

Inicio › Soporte › Soporte en español › [Resuelto] Mini-cart Woocommerce y WPML

[Resuelto] Mini-cart Woocommerce y WPML

Este hilo está resuelto. Aquí tienes una descripción del problema y la solución.

Problem:
Si estás experimentando problemas con el mini-carrito de WooCommerce en tu sitio web multilingüe, que se abre hacia el lado derecho y queda fuera de vista solo en Safari, el problema podría estar relacionado con el código HTML.
Solution:
Te recomendamos verificar el código HTML de tu sitio, especialmente asegurándote de que cada etiqueta 

<li>

esté correctamente cerrada con su correspondiente 

</li>

. Este detalle puede parecer menor, pero es crucial para que los elementos se muestren correctamente en diferentes navegadores, incluido Safari.

Si esta solución no resuelve el problema o si parece no estar relacionada con tu caso, te sugerimos abrir un nuevo ticket de soporte. También es altamente recomendable que revises los problemas conocidos, verifiques la versión de la solución permanente y confirmes que tienes instaladas las últimas versiones de los temas y plugins. Para asistencia adicional, puedes visitar nuestro foro de soporte.

Este es el foro de soporte técnico de WPML, el plugin multilingüe de WordPress.

Todas las personas pueden leerlo pero solo los clientes de WPML pueden ingresar comentarios. El equipo de WPML responde en los foros 6 días a la semana, 22 horas por día.

Etiquetado: 

Este tema contiene 13 respuestas, tiene 0 voces.

Última actualización por Paola Mendiburu hace 1 mes, 1 semana.

Asistido por: Paola Mendiburu.

Autor Publicaciones
mayo 12, 2025 a las 7:32 am #17021251

maria-isabelM

Antecedentes del problema:
Estoy intentando tener mi sitio web con WooCommerce en español e inglés. En español, todo funciona bien, pero en Safari, en inglés, el mini-carrito del menú se abre hacia el lado derecho, quedando fuera de la vista de los usuarios. Para testearlo, es necesario añadir un producto a la cesta de la compra. Esto solo pasa en Safari, en el resto de navegadores se ve bien. Español: enlace oculto Inglés: enlace oculto

Síntomas:
En Safari, el mini-carrito del menú en inglés se abre hacia el lado derecho, quedando fuera de la vista de los usuarios.

Preguntas:
¿Por qué el mini-carrito se abre hacia el lado derecho en Safari?
¿Cómo puedo solucionar el problema del mini-carrito en Safari?
mayo 12, 2025 a las 9:40 am #17021906

Carlos Rojas
Partidario de WPML desde 03/2017

Idiomas: Inglés (English ) Español (Español )

Zona horaria: Europe/Madrid (GMT+02:00)

Hola,
Muchas gracias por contactarnos

1.- Puede describir cual es la relación entre el problema que ha descrito y la traducción del contenido con WPML?

2.- Por favor actualice los plugins de WPML a la última versión en Plugins -> Añadir nuevo -> Pestaña 'Comercial'

Saludos,
Carlos
mayo 13, 2025 a las 7:03 am #17025338

maria-isabelM

Buenas tardes, el problema viene en la versión inglesa de la web y más en concreto en Safari, que es donde no se ve bien el mini cart.

¡Un saludo!
mayo 14, 2025 a las 10:15 am #17031505

Paola Mendiburu
Partidario de WPML desde 11/2020

Idiomas: Inglés (English ) Español (Español ) Italiano (Italiano )

Zona horaria: Europe/Madrid (GMT+02:00)

Hola!

Soy Paola y continuaré con el ticket ya que puedo verlo en Safari.

El problema es que el enlace al minicarrito se queda "por debajo" del enlace a la página del my-account -solamente en Ingles y en Safari- y es por ello que la animación no se termina como puedes ver en el código que verás en las imágenes adjuntas.

El problema no es de traducción, sino del html del header en ésa parte.

header.png
codigocarrito.png
mayo 19, 2025 a las 7:16 am #17046598

maria-isabelM

¡Hola, Paola! El HTML es le mismo para la versión inglesa y para la española, y también para todos los navegadores claro ¿Cómo es posible que pase esto?

Gracias.
mayo 19, 2025 a las 10:27 am #17047749

Paola Mendiburu
Partidario de WPML desde 11/2020

Idiomas: Inglés (English ) Español (Español ) Italiano (Italiano )

Zona horaria: Europe/Madrid (GMT+02:00)

¿Me podrías indicar como has creado el header?

En todos los navegadores el html en la traducción es el mismo solo que solo afecta a Safari.
mayo 22, 2025 a las 8:59 am #17060407

maria-isabelM

Buenos días, el header está construido con html, css, php y javascript, es un header programado a medida en el archivo header.php del tema personalizado.

Gracias por tu ayuda.
mayo 22, 2025 a las 6:07 pm #17063298

Paola Mendiburu
Partidario de WPML desde 11/2020

Idiomas: Inglés (English ) Español (Español ) Italiano (Italiano )

Zona horaria: Europe/Madrid (GMT+02:00)

Pues se ve que hay un problema en el código.

¿Como es el código de esa sección?
mayo 26, 2025 a las 11:26 am #17072963

maria-isabelM

Hola, Paola. Aquí te dejo el código:

<?php
/**
* Header
*
* Theme: Lele Lerele
*/
?>
<!DOCTYPE html>
<html <?php language_attributes(); ?>

<head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<meta name="viewport" content="width=device-width" />
<meta name="description" content="<?php bloginfo( 'description' ); ?>">
<?php
function theme_slug_render_title() {
?>
<title><?php wp_title( '|', true, 'right' ); ?></title>
<?php
}
?>
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>">
<link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri(); ?>/css/animate.css" />
<link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri(); ?>/css/theme.css" />
<link href="enlace oculto" rel="stylesheet">
<link rel="profile" href="enlace oculto" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<link rel='shortcut icon' href="enlace oculto" />
<script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/jquery-1.7.2.min.js"></script>
<script src="enlace oculto" crossorigin="anonymous"></script>

<?php wp_head(); ?>
</head>

<body id="<?php if (ICL_LANGUAGE_CODE == 'es'): ?>body-es<?php elseif (ICL_LANGUAGE_CODE == 'en'): ?>body-en<?php endif; ?>"<?php body_class(); ?>>

<header class="site-header">

<?php if( get_field('top_bar_activation', 'options') == 'si' ): ?>
<!-- TOP BAR -->
<div id="top_bar">
<div class="top-bar-inner" class="fadein">
<p><?php the_field('top_bar_text', 'options'); ?></p>
</div>
</div>
<?php endif; ?>

<div class="header-inner<?php if( get_field('home_header_color') ):?> header-<?php the_field('home_header_color'); ?><?php endif; ?>">
<!-- Language -->
<div id="header_lang" class="fadein">
<?php wp_nav_menu( array( 'theme_location' => 'language', 'container'=> false ) ); ?>
<?php if ( is_active_sidebar( 'widget-currency' ) ) : ?>
<div class="header-currency">
<?php dynamic_sidebar( 'widget-currency' ); ?>
</div>
<?php endif; ?>
</div>

<!-- Logo -->
<div id="header_center" class="fadein">
<div id="logo">
">



<?php endif; ?>

</div>
</div>

<!-- Header links -->
<div id="header_links">
<ul class="nav-shop">
<li class="toggleMenu">
<img src="enlace oculto" width="25" height="20" alt=""/><span class="uppercase"><?php if (ICL_LANGUAGE_CODE == 'es'): ?>Menú<?php elseif (ICL_LANGUAGE_CODE == 'en'): ?>Menu<?php endif; ?></span>

<?php if (ICL_LANGUAGE_CODE == 'es'): ?>
<li class="nav-account fadein">enlace oculto" ><img src="enlace oculto" width="20" height="20" alt=""/><span class="uppercase">Mi cuenta</span>
<?php elseif (ICL_LANGUAGE_CODE == 'en'): ?>
<li class="nav-account fadein">enlace oculto" ><img src="enlace oculto" width="20" height="20" alt=""/><span class="uppercase">Account</span
<?php endif; ?>
<li class="nav-search fadein"><img src="enlace oculto" width="20" height="20" alt=""/><span class="uppercase"><?php if (ICL_LANGUAGE_CODE == 'es'): ?>Buscar<?php elseif (ICL_LANGUAGE_CODE == 'en'): ?>Search<?php endif; ?></span>
<li class="nav-cart fadein">
<img src="enlace oculto" width="20" height="20" alt=""/>
<div class="cart-contents">
<?php echo WC()->cart->get_cart_contents_count(); ?>
</div>
<span class="uppercase"><?php if (ICL_LANGUAGE_CODE == 'es'): ?>Carrito<?php elseif (ICL_LANGUAGE_CODE == 'en'): ?>Cart<?php endif; ?></span>

</div>
</div> <!-- end .header-inner -->

<!-- Menu -->
<nav id="site-navigation" class="main-navigation fadein<?php if( get_field('home_header_color') ):?> header-<?php the_field('home_header_color'); ?><?php endif; ?>">
<div class="close" id="menu-close"></div>
<?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav' ) ); ?>
</nav>

<!-- Search -->
<div class="top-search-form">
<div class="top-search-form-inner">
<div class="close" id="top-search-close"></div>
<form method="get" id="searchform" action="<?php echo home_url(); ?>/">
<input type="text" value="<?php esc_attr_e('Search'); ?>"
onblur="if (this.value == '') {this.value = '<?php esc_attr_e('Search'); ?>';}"
onfocus="if (this.value == '<?php esc_attr_e('Search'); ?>') {this.value = '';}" name="s" id="s" />
<input type="hidden" name="lang" value="<?php echo(ICL_LANGUAGE_CODE); ?>"/>
<input type="hidden" name="post_type" value="product" />
</form>
</div>
<div class="top-search-enter">
<?php if (ICL_LANGUAGE_CODE == 'es'): ?>Pulsa intro para iniciar la búsqueda
<?php elseif (ICL_LANGUAGE_CODE == 'en'): ?>Press enter to search
<?php endif; ?>
</div>
</div>

<!-- Cart -->
<div class="cart-mini fadein">
<div class="close" id="top-cart-close"></div>
<div class="header-quickcart"><?php woocommerce_mini_cart(); ?></div>
</div>

</header>

<div id="wrapper" class="main-wrapper">

¡Gracias!
mayo 27, 2025 a las 8:43 am #17076445

Paola Mendiburu
Partidario de WPML desde 11/2020

Idiomas: Inglés (English ) Español (Español ) Italiano (Italiano )

Zona horaria: Europe/Madrid (GMT+02:00)

Vale el problema que veo que no cierras los

  • y de ahí el problema. Asegúrate de que cada
  • tenga su correspondiente

    • .

    Como ves es un problema relacionado con el código que con WPML.
    mayo 30, 2025 a las 8:27 am #17090936

    maria-isabelM

    Hola Paola, el cierre de ese div se encuentra en footer.php los temas de wordpress se construyen así 🙂 La verdad es que creo que estamos en un callejón sin salida 😅
    mayo 30, 2025 a las 3:06 pm #17092660

    Paola Mendiburu
    Partidario de WPML desde 11/2020

    Idiomas: Inglés (English ) Español (Español ) Italiano (Italiano )

    Zona horaria: Europe/Madrid (GMT+02:00)

    Me refiero al cierro de los

  • que es lo que genera el problema en el código.
    		•
    junio 2, 2025 a las 4:38 pm #17098777

    maria-isabelM

    Hola, Paola ¿al cierre de qué exáctamente? Parece que tu mensaje se cortase y no leo lo que quieres decir.

    Un saludo!
    junio 3, 2025 a las 9:06 am #17100989

    Paola Mendiburu
    Partidario de WPML desde 11/2020

    Idiomas: Inglés (English ) Español (Español ) Italiano (Italiano )

    Zona horaria: Europe/Madrid (GMT+02:00)

    Ok perdona eso es porque puso un código de manera incorrecta. El problema está relacionado con el código del header no directamente con WPML.

    Está relacionado que no se cierran los 

    <li>

    correctamente.