Cómo agregar un ícono de carrito de WooCommerce a una barra de menú en WordPress










  • WooCommerce es una excelente manera de vender productos físicos y digitales desde su sitio web de WordPress. El complemento se ejecuta sin problemas y le brinda todo lo que necesita para comenzar. A veces, sin embargo, quieres un poco de estilo extra. Aquí es donde entra en juego el ícono del carrito de WooCommerce.

    ¿Alguna vez ha estado comprando en un sitio web y ve un pequeño ícono de carrito de menú ubicado en algún lugar del menú del sitio web ? Si posee un sitio web de WooCommerce , puede lograr esto. Le dará a los usuarios de su sitio web la posibilidad de ver un ícono de carrito en las áreas de menú de su sitio web.

    Hay un par de maneras de hacer esto. Podrías escribir tu propio código y construir el ícono del carrito de WooCommerce de esa manera. Sin embargo, eso parece mucho trabajo para algo que se puede hacer usando un excelente complemento de WordPress.

    Encontré un complemento sólido que puede instalar y configurar para mostrar un ícono de carrito en el área de menú de su sitio web. Repasaremos cómo instalar, activar y configurar la herramienta.

    Primero, hablemos de por qué le gustaría mostrar un botón de carrito de WooCommerce en su sitio web.

    ¿Por qué mostrar un icono de carrito de WooCommerce?

    Cuando un cliente visita su sitio web, naturalmente desea brindarle una experiencia de compra personalizada. Hay varias formas de hacer esto en WooCommerce. Una de estas formas es agregar algo como un ícono de carrito de compras a su sitio web.

    Dado que el complemento que vamos a ver permite diferentes opciones de visualización, le brinda a los usuarios de su sitio la capacidad de ver los artículos de su carrito y los totales desde cualquier área. Lo que esto significa es que no tendrán que hacer clic en el enlace del carrito para ver sus artículos y totales en otra página.

    Esta es una forma suave, ingeniosa y divertida de personalizar la experiencia de compra. Sin mencionar que brinda a los clientes un tiempo más fácil con la navegación . Echemos un vistazo al complemento.

    Carrito de menú de WooCommerce

    Complemento del icono del carrito del menú de WooCommerce

    El complemento WooCommerce Menu Cart instalará automáticamente un botón de carrito de compras en el área de la barra de navegación del menú de su sitio web. El complemento es muy liviano y es fácil de instalar y configurar.

    Este es en realidad uno de esos complementos con solo unas pocas opciones de configuración, pero brinda mucha potencia y funcionalidad. WooCommerce Menu Cart tiene una versión pro del complemento que ofrecerá aún más funcionalidad, pero puede hacer lo suficiente con la herramienta gratuita.

    El complemento está repleto de funciones para algo tan pequeño y liviano. Algunos de estos incluyen:

    • Mostrar icono de carrito con precios
    • Visualización del icono del carrito con artículos
    • Mostrar icono de carrito con precios y artículos
    • Mostrar el ícono del carrito solo cuando se agregan artículos
    • Mostrar siempre el ícono del carrito
    • Carro flotante a la izquierda, a la derecha o usar la configuración predeterminada del menú
    • Capacidad para personalizar su propio CSS

    Este complemento del ícono del carrito de WooCommerce también es muy compatible con la mayoría (si no todos) de los principales complementos. Finalmente, viene con traducción para más de 20 idiomas . Básicamente, es un pequeño complemento fantástico para mostrar un ícono de carrito de compras en el menú de su sitio web.

    Echemos un vistazo a cómo instalar, activar y configurar el complemento WooCommerce Menu Cart.

    Nota: Estas instrucciones asumen que ya tienes WooCommerce instalado y configurado en tu sitio web.

    Instalar y activar el carrito de menú de WooCommerce

    Para que pueda mostrar correctamente un botón de carrito de WooCommerce, primero debe instalar y activar el complemento. Puede hacerlo directamente desde su panel de administración de WordPress. Simplemente vaya a la página de complementos y busque el complemento que desee.

    Instale y active el complemento del icono del carrito de WooCommerce

    Una vez que el complemento se haya instalado y activado, debe acceder a la página de configuración principal para configurar los ajustes que desee. Para hacer esto, haga clic en WooCommerce> Configuración del carrito de menú.

    Haga clic en woocommerce y luego haga clic en menu cart setu

    Esto lo llevará a la página de configuración principal donde puede configurar el complemento del ícono del carrito de WooCommerce para que se ajuste a sus necesidades.

    Configurar el icono del carrito de WooCommerce

    Ahora que está en la página de configuración principal, verá todas las opciones de configuración en un área. Como dije anteriormente, el complemento es muy fácil de configurar y ejecutar. Repasemos los ajustes juntos.

    Las primeras cuatro configuraciones de la herramienta le permiten configurar la funcionalidad de visualización del icono. Esto incluye cosas como el complemento de comercio electrónico que está utilizando (en este caso, WooCommerce), el menú donde desea que se muestre el ícono y si se muestra cuando está vacío. También puede optar por habilitar o deshabilitar el icono por completo. Esto podría ser útil al solucionar problemas.

    Configuración del icono del carrito de WooCommerce

    Ahora desplácese hacia abajo y eche un vistazo al siguiente conjunto de opciones. Tiene la opción de opciones de visualización flotante, así como la cantidad de productos para mostrar. Aquí, también tiene la opción de elegir el ícono de su carrito.

    Nota: La versión gratuita del complemento solo le permite usar el ícono predeterminado para mostrar. Si desea más opciones de íconos, deberá comprar la versión pro.

    Además, puede optar por mostrar precios, artículos del carrito o ambos. Finalmente, elija dónde desea que se muestre el carrito. Puede hacer que flote a la derecha, flote a la izquierda o dejar que tome la alineación predeterminada del menú.

    Más configuraciones del ícono del carrito

    Ahora desplácese un poco más hacia abajo hasta las últimas opciones de configuración para el complemento del carrito de menú de WooCommerce. Tienes la opción de cómo quieres mostrar los precios en el carrito del menú. Puede mostrar productos totales o mostrar precios con descuentos.

    Aquí es donde también puede ingresar cualquier clase de CSS personalizada que desee. Solo juega con esto si sabes lo que estás haciendo. Finalmente, puede elegir si desea usar AJAX personalizado o no.

    Finaliza tu configuración

    ¡Eso es todo! No olvide hacer clic en el botón «Guardar cambios» para que se apliquen todas sus opciones de configuración. Lo has hecho. El ícono del carrito de WooCommerce ahora se mostrará en la parte frontal de su sitio web de WordPress de acuerdo con la configuración que eligió.

    Icono de carro de WooCommerce Pro

    Solo para mencionar la versión pro del complemento por un segundo. Definitivamente puedes irte sin comprarlo. Sin embargo, si desea mucha más funcionalidad y más configuraciones y opciones de estilo, entonces la versión pro de WooCommerce Menu Cart es definitivamente el camino a seguir.

    Puede verlo y comprarlo directamente desde la página de configuración principal del complemento que ya tenemos instalado.

    Icono de carrito de WooCommerce versión pro

    Pensamientos finales

    Cree una experiencia de compra más personal para sus clientes agregando más funciones a su sitio web de WooCommerce. Una forma sencilla de hacer esto es agregar un ícono de carrito de WooCommerce. Esto le da a su sitio web un aspecto visualmente más atractivo y también permite una navegación más fácil.

    Ya no será necesario que un usuario navegue a su página de carrito principal para ver los artículos agregados y los precios totales. Puede usar el complemento para mostrarles todo esto. Agregar extras a su configuración de WooCommerce nunca es una mala idea. También hay otras formas de agregar funcionalidad , pero agregar este ícono de carrito es un buen comienzo.

    ¿Alguna vez ha usado este complemento del ícono del carrito de compras de WooCommerce para mostrar el ícono? ¿Prefiere otro complemento o codificarlo usted mismo para lograr esto?