Cómo mostrar fácilmente un medidor de progreso en WordPress










  • ¿Está buscando una forma sencilla de agregar un medidor de progreso en WordPress? Si es así, le complacerá saber que hay un complemento que puede agregar uno, Ultimeter. En cuestión de minutos, puede crear un medidor de progreso completamente funcional que puede actualizar las 24 horas del día.

    Hoy demostraré cómo usar Ultimeter para construir un medidor de progreso en WordPress.

    ¿Qué es un medidor de progreso?

    Un medidor de progreso se puede utilizar para indicar el crecimiento o desarrollo de cualquier proyecto. Se usan comúnmente para recaudar fondos, pero podrías usar uno para mostrar el progreso de casi cualquier cosa que se pueda representar con números.

    Por ejemplo, capítulos escritos para un proyecto de libro, días hasta el lanzamiento de un producto (o el nacimiento de sus pollitos).

    También puede iniciar el medidor al 100% y reducir el valor todos los días para que sirva como cuenta regresiva. Úselo para mostrar cualquier hito en un sitio web de WordPress. Si puede contarlo, puede visualizarlo con un medidor de progreso.

    Y para ayudarnos en esa visualización, instalemos el complemento Ultimeter.

    Cómo crear un medidor de progreso en WordPress

    Paso 1: instale el complemento Ultimeter

    La instalación de Ultimeter es gratuita y hay una versión paga que desbloquea algunas funciones. Cubriremos los conceptos básicos para configurar un medidor de progreso usando la versión gratuita. La única restricción es que debe poder cuantificar el progreso que está realizando.

    Esto es fácil de hacer cuando hay un objetivo en mente, como un objetivo de recaudación de fondos, pero puede ser más complicado para algunos temas que no son fáciles de cuantificar.

    Inicie sesión en su panel de administración de WordPress.

    En la navegación de la columna izquierda, pase el mouse sobre el enlace «Complementos» y haga clic en el enlace «Agregar nuevo».

    pase el mouse sobre el enlace "Complementos" y haga clic en el enlace "Agregar nuevo"

    En el cuadro de búsqueda disponible, ingrese «Ultímetro».

    busque el complemento WordPress Ultimeter

    Una vez que haya localizado el complemento, haga clic en el botón «Instalar ahora».

    haga clic para instalar el complemento WordPress Ultimeter

    Haga clic en el botón «Activar».

    haga clic para activar el complemento WordPress Ultimeter

    Paso 2: Configuración de Ultímetro

    Para nuestro ejemplo aquí, configuraremos una recaudación de fondos para comprarle un bote a Jim. No conozco a nadie llamado Jim, pero si lo conociera, me imagino que apreciaría un barco gratis.

    Cuando se complete la instalación del complemento, accederá a una página de introducción para el complemento. Haga clic en el botón «Crear ultímetro» para comenzar.

    haga clic en el botón "Crear ultímetro"

    Si dejó esa página de introducción después de la instalación, pase el mouse sobre el enlace «Ultimeter» y haga clic en el enlace «Add New Ultimeter».

    haga clic en el enlace "Agregar nuevo ultímetro"

    El complemento se abre en la pestaña «Tipo de medidor».

    Primero, asigne un título al medidor (el campo de entrada del título está visible en todas las pestañas).

    ingrese un título para el medidor

    La versión gratuita del complemento le permite elegir entre una barra de progreso de objetivo horizontal o un medidor de tipo termómetro vertical. Para la campaña del barco de Jim, seleccionaré el indicador horizontal haciendo clic en la imagen.

    haga clic en el medidor que le gustaría usar

    Ahora haga clic en la pestaña «Opciones de objetivo».

    Las opciones «Seleccionar un formato de objetivo» son «Cantidad recaudada» o «Porcentaje recaudado».

    seleccionar el formato de objetivo

    Elija el idioma y la moneda para su medidor de los menús desplegables «Seleccione un idioma» y «Seleccione una moneda».

    configuración de idioma y moneda

    La “Cantidad del objetivo” es la cantidad que estamos tratando de recaudar para el barco de Jim. La «cantidad recaudada» es cuánto tenemos hasta ahora.

    Nota: si no está utilizando este complemento para una recaudación de fondos, considere ingresar una cantidad de 100. Esto le permite influir fácilmente en el porcentaje del medidor. Por ejemplo, si ha completado el 16%, eso significa que ha recibido 16 dólares. Hace que las matemáticas sean simples.

    configuración de la cantidad objetivo y la cantidad recaudada

    Puede cambiar el color del medidor usando el selector de color en la pestaña Opciones de estilo. Asegúrese de considerar qué color de fondo está utilizando al seleccionar el color. Si la barra de progreso es difícil de leer, será menos efectiva.

    selector de color

    No entraremos en la pestaña «Hitos» ya que esa función no está disponible en la versión gratuita del complemento.

    Haga clic en el botón «Publicar» para guardar el medidor.

    haga clic en el botón "Publicar"

    Paso 3: mostrar el medidor en una página o publicación

    Ahora que nuestro medidor está listo para funcionar, debemos agregarlo a una publicación o página. Puede editar una publicación o página existente, o crear una nueva.

    Voy a crear una nueva página para este tutorial. Pero antes de crear la página, tenemos que copiar el código abreviado del medidor.

    En la columna de navegación de la izquierda, pase el mouse sobre el enlace «Ultímetro» y haga clic en el enlace «Todos los ultímetros».

    Haga clic en el enlace «Editar» para su medidor.

    haga clic en el enlace "Editar"

    Haga clic en el botón «Copiar código abreviado».

    Nota: También hay una opción Duplicar. Esto le permite hacer una copia del medidor de progreso. Esto es útil si planea utilizar varias barras de progreso en un sitio web.

    haga clic en el botón "Copiar código abreviado"

    Ahora podemos crear una nueva página y agregar el shortcode a la página donde queremos que aparezca el medidor. Si usa el editor de Gutenberg, deberá agregar un bloque de código abreviado y, si está en el editor clásico, puede agregar el código abreviado en cualquier lugar del editor visual.

    agregar shortcode a la publicación o página

    Ahora, cuando guardamos la página, nuestro medidor está allí.

    metro en la página

    Se ve bien, pero aún no ha terminado, ahora deberá aprender a actualizar la barra de progreso. Afortunadamente, actualizar la barra de progreso lleva menos de un minuto.

    Paso 4: Actualización del progreso hacia su meta

    El objetivo de un medidor de progreso es mostrar qué tan cerca está de alcanzar una meta, por lo tanto, necesitará actualizar el valor regularmente. Siempre que tenga un valor actualizado para su medidor, ingréselo en el campo «Cantidad recaudada».

    Para hacer esto, regrese a «Todos los ultímetros» en la navegación del administrador de WordPress y haga clic en el enlace «Editar» para su medidor.

    Haga clic en la pestaña «Opciones de objetivo» y en la sección «Cantidad recaudada», ingrese el nuevo valor.

    Nota: Si estuviera siguiendo mi consejo de agregar 100 como el monto objetivo para los medidores de progreso que no son de recaudación de fondos, ingresaría el porcentaje de aumento. Entonces, si quisiera que aumentara en un 5%, ingresaría 5.

    actualizando el valor de la cantidad recaudada

    Haga clic en el botón «Actualizar» para el medidor y el nuevo valor aparecerá en el medidor. Actualizará el medidor de progreso automáticamente, como se muestra a continuación:

    medidor actualizado en la página

    También puede editar la configuración de otros medidores, incluso cambiando de la barra horizontal a la imagen del termómetro de meta.

    Si desinstala el complemento, las páginas y publicaciones que usaron el complemento se verán afectadas:

    • Se eliminarán los medidores creados por el complemento.
    • Los códigos cortos del complemento dejarán de funcionar, por lo que los códigos cortos en sí se mostrarán en cualquier lugar donde se hayan utilizado.

    Felicitaciones por aprender a configurar un medidor de progreso en WordPress usando el complemento Ultimeter. Recuerde actualizar la barra de progreso periódicamente.

    El uso de imágenes puede estimular las contribuciones

    Aprendemos y procesamos mucha información visualmente , por lo que es lógico que un medidor de progreso de recaudación de fondos pueda animar a las personas a contribuir. Al hacerlo, en realidad pueden «mover el medidor» por sí mismos.

    Si está utilizando un medidor para mostrar el progreso de algo que no sea una contribución, el elemento visual aumentará el interés y hará que la gente regrese para verificar los cambios. Ahora que ha visto lo fácil que es agregar un medidor de progreso a cualquier sitio de WordPress, con suerte encontrará una buena razón para usar uno.

    ¿Alguna vez ha seguido el progreso de un proyecto en su sitio web? ¿Existen métodos que le gustaría utilizar además de los que hemos mostrado aquí? ¡Házmelo saber en los comentarios!