ℹ️ Note: Este artículo fue traducido automáticamente usando AI y puede contener imprecisiones. Si algo se ve mal, póngase en contacto con nuestro equipo de apoyo.

Cada tema establece su página del carrito un poco diferente, por lo que el selector de ranura debe sentarse exactamente donde tiene sentido para tu tienda 📍

Con el Posición Ajustes Hoppy Delivery Dates, usted puede controlar donde aparece el selector de ranura en la página del Carrito, cómo está alineado, y lo ancho que es - por separado para Escritorio y Móvil.

📌 Antes de empezar

• Hoppy Delivery Dates está instalado y la aplicación embed está habilitada en su tema
• Estás conectado a tu Shopify admin
• (Opcional) Si planea utilizar un selector de CSS personalizado, ayuda a conocer la estructura HTML de su tema — la herramienta Inspect de su navegador es su amigo aquí 🔍

Paso 1 - Abra la página de Apariencia

En la navegación de la aplicación, vaya a:

Hoppy Delivery Dates → Aspecto

Encontrar el Posición tarjeta — es la primera carta en la página.

Paso 2 - Escoja una pestaña de dispositivo

La tarjeta tiene dos fichas:

• Escritorio 🖥️
• Móvil 📱

Los ajustes se guardan por separado para cada uno, por lo que puede ajustar la posición para las pantallas más grandes y más pequeñas. Configurar una pestaña, luego cambiar a la otra y repetir si es necesario.

Paso 3 - Elija Donde aparece el Picker

Under "¿Dónde quieres posicionar el buscador de fechas?", elegir una de las opciones de radio:

• Predeterminado (antes del botón de salida o el extremo del formulario de página del carrito) → la aplicación coloca automáticamente el selector cerca de su botón de salida. Esto funciona fuera de la caja para la mayoría de las tiendas, ya que la aplicación detecta su tema y utiliza una colocación que coincida — ninguna configuración necesaria ✅
• Antes de un elemento HTML → el picker se coloca justo antes del elemento que especifique
• Al comienzo de un elemento HTML → el picker se coloca dentro del elemento, antes de su contenido existente
• Al final de un elemento HTML → el picker se coloca dentro del elemento, después de su contenido existente
• Después de un elemento HTML → el picker se coloca justo después del elemento que especifique

Usando un selector CSS personalizado

Elegir cualquier opción que no sea Default revela un campo de texto extra. Introduzca el selector CSS del elemento que desea apuntar.

• Ejemplo: .cart_input
• Ejemplo de clase: .cart-footer
• Ejemplo de identificación: #main-cart-footer

⚠️ Si el selector de CSS no coincide con ningún elemento en su página de Carrito, el selector de ranura puede no aparecer en absoluto. Verifique el selector usando la herramienta Inspección de su navegador, y vea siempre la página del Carrito después de guardar para confirmar que el picker es visible.

💡 Si el picker desaparece después de configurar un selector personalizado, vuelva a Default y salvar — esa es la manera más rápida de restaurarlo.

Paso 4 - Establecer la alineación

Elija cómo el recolector se alinea dentro de su contenedor:

• Center
• Izquierda
• Bien.

Ejemplo

• Un tema amplio y mínimo a menudo se ve mejor con Center
• Si su sumario del carrito se sienta a la derecha, Izquierda puede mantener las cosas equilibradas

Paso 5 - Establecer la anchura del contenedor (opcional)

Uso Ancho del contenedor del picker de ranura para controlar lo ancho que es el picker:

• Introduzca un número en el campo de ancho (por ejemplo. 100)
• Elija la unidad de la desplegable junto a ella: % o px

Ejemplo

• 100 + % → el picker se estira para llenar el espacio disponible
• 400 + px → un selector compacto de ancho fijo

ℹ️ Este campo es opcional, déjalo vacío para que el picador use su ancho natural.

Paso 6 - Guardar y comprobar su escaparate

Haga clic Guardar en la parte superior de la página.

Entonces abre la página del carrito de tu tienda y confirma que el picker se sienta exactamente donde lo querías. Recuerde comprobar en el escritorio y el móvil si configura ambas pestañas 👀

⚠️ Notas importantes

⚠️ Las posiciones de escritorio y móviles se configuran independientemente — cambiar una pestaña no afecta a la otra.

ℹ️ El Default opción es el tema: la aplicación detecta tu tema y elige un lugar adecuado automáticamente, por lo que es la opción más segura si no estás seguro.

⚠️ Un selector CSS incorrecto o anticuado (por ejemplo, después de cambiar temas) es la razón más común por la que el picador deja de mostrar — volver a comprobar primero si eso sucede.

🎉 Resultado final

Una vez configurado con éxito:

✅ El picador de ranura aparece exactamente donde lo desea en la página del carrito ✅ Escritorio y Móvil cada uno consigue su colocación ideal ✅ Alineación y anchura hacen que el picador se sienta como una parte natural de su tema ✨

Actualizado el: 10/09/2026