Maquetación y producción web

  • More
Add new...
 
 

Servicios de hosting

Te comparto el siguiente servicio de hosting que acabo de descubrir: https://www.ovhcloud.com/es/web-hosting/compare/

¿Lo conocías? ¿Qué tal te resultan sus servicios y precios?

¿Lo debatimos?

Plácido.

"OVHCloud

Complemento el debate publicado hace unos días (Debate Tipográfico i: ¿Qué son esas etiquetas en el nombre de esta fuente?) con este enlace a un tutorial de DigitalOcean sobre CSS para el uso de fuentes variables en el diseño web: https://www.digitalocean.com/community/tutorials/css-variable-fonts

¡Saludos y bonita jornada!

Plácido.

Para agregar íconos, automáticamente, a enlaces de un sitio web utilizando CSS, puede usarse el pseudoelemento ::before o ::after en combinación con la propiedad content:

<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
        a::after {
            content: url('https://www.dominio.com/icono.png'); /* Corresponde a la URL del ícono */
            display: inline-block;
            margin-left: 5px;
        }
    </style>
    <title>Agregar ícono a enlaces</title>
<head>
<body>
    <p><a href="#">Este es un enlace con un ícono agregado mediante CSS</a></p>
</body>
</html>

Explicación:

  • a::after - Se utiliza para añadir el contenido luego del texto de cualquier enlace ().
  • content: url('https://www.dominio.com/icono.png') - Indicamos la URL del contenido a mostrar automáticamente a los enlaces.
  • display: inline-block - Obliga a que el ícono se comporte como un bloque en línea, permitiendo agregar márgenes, ajustar posición y otras propiedades de bloques.
  • margin-left: 5px - Añade espacio entre el enlace y el contenido agregado con CSS.

Importante:

Evidentemente, podemos agregar contenidos a enlaces de clases específicas, mediante el atributo class:

HTML:

<p><a href="#" class="enlace_con_icono">Este es un enlace con un ícono agregado mediante CSS</a></p>

CSS:

a.enlace_con_icono::before {
    content: url('URL_DEL_ICONO'); /* Reemplaza 'URL_DEL_ICONO' por la URL del icono que quieras usar */
    display: inline-block;
    margin-right: 5px; /* Espacio entre el icono y el texto del enlace */
}

El debate:

  • ¿Conocías la técnica?
  • ¿La has utilizado antes?
  • ¿Qué otra solución propones?

Crea popups con Popup Maker, plugin gratuito para WP

Si necesitas un creador de popus gratuito para WordPress, te recomiendo Popup Maker. Disponible en versión open source y de pago, ofrece una variedad de funcionalidades que lo hacen especialmente destacado.

Te comparto la siguiente información, evalúalo, y si lo ves adecuado para implementar en tu sitio, déjanos tus comentarios:

Créditos: Captura desde https://wordpress.org/plugins/popup-maker/#

Ventajas

  • Buena calificación, buena cantidad de instalaciones, y lo que es más importante, actualizaciones frecuentes.
  • Fácil de usar, ofrece más de una docena de plantillas para el diseño de tus popus.
  • Ofrece opciones de segmentación avanzadas para campañas de marketing online, incluyendo la segmentación geográfica y otras lógicas condicionales.
  • Puede usarse para disminuir el abandono de carritos de compras, mediante formularios, por ejemplo. Se integra con WooCommerce.
  • Diseño centrado en la conversión: elija entre temas diseñados para convertir las visitas en conversiones.

Enlaces relacionados:

¿Cuál me recomiendas para usar en Divi?

Este es mi caso, y de ahí la pregunta, que tal vez pueda ser la tuya también: ¿Qué plugins para popus me recomiendas para usar con Divi?

  1. Si necesitas popups solamente para usar formularios de distintos, tienes una suscripción a Divi, o su versión de pago único, casi que sin dudarlo, te recomendaría Bloom, sobre todo si quieres una solución sencilla y efectiva: https://www.elegantthemes.com/plugins/bloom/
  2. Para una solución más completa, que permita contenidos varios, mi recomendación sería Popus for Divi, de divimode.com: https://es.wordpress.org/plugins/popups-for-divi/

Enlaces relacionados:

¿Dudas, sugerencias? Escríbenos en los comentarios :)

Registro de consentimientos de cookies gratuito

Comparto el que, para mi, es uno de los dos plugins gratuitos más eficientes para la gestión de consentimientos de cookies: Pressidium Cookie Consent (¿Conoces el otro?)

Funciones

  • Fácil personalización e integración de un banner de consentimiento de cookies
  • Carga condicionales de scripts de terceros según las preferencias seleccionadas por el usuario (GDPR, CCPA y otros).
  • Tal vez el más liviano y rápido de cargar, entre los que he probado.
  • Compatible con a11y, compatible con WAI-ARIA.
  • Fácilmente traducible, con opción de detección automática de idioma a partir del idioma establecido en el navegador del usuario o el idioma de la página desde donde está cargándose.
  • Responsive: Se adapta a los distintos dispositivos, con facilidad.
  • De manera manual, podemos listar las URL de los scripts que se desean bloquear, admitiendo tanto coincidencias exactas como expresiones regulares, evitando que se carguen hasta que el usuario haya dado su consentimiento.
  • Borrado automático de cookies cuando un usuario opta por no aceptar una categoría específica dentro de la configuración de cookies.
  • Solicita nuevamente el consentimiento a los usuarios luego de cada actualización de las políticas y listado de cookies.
  • Registrar los consentimientos de los usuarios para poder proporcionar prueba del consentimiento para fines de auditoría.
  • IMPORTANTE: Es de destacar que, soluciones que no registren consentimientos de aceptación, no son suficiente ante regulaciones como la GDPR, lo que destaca la importancia de este plugin.
  • Agrega un botón de configuración flotante que permite a los usuarios cambiar sus preferencias de cookies en cualquier momento.
  • Permite ocultarlo ante bots y controladores web.
  • Integración del Google Consent Mode (GCM) lo que permite ajustar el comportamiento de las etiquetas de Google en función de las preferencias de consentimiento del usuario. Admite implementaciones de Google Tags y de Google Tag Manager (GTM).

Importante:

La misma procede desde la página del plugin, la que coincide, en mi caso, con los usos que le he dado al plugin. Antes de implementar el plugin, verifica si se ajusta a tus necesidades.

URL:

https://es.wordpress.org/plugins/pressidium-cookie-consent/

Imagen de cabecera: Captura de pantalla parcial desde la URL compartida.

#PolíticasDeCookies #RegistroDeConsentimientos

Cuál es el ranking de tu plugin de WordPress

WP Rankings ofrece indicadores sobre el ranking de los plugins de WordPress en WordPress.org, comparándolo día a día.

Los creadores del sitio afirman que en https://www.wordpress.org/plugins ofrecen una cantidad limitada de plugins en lo que se refiere a rankings, afirmando que este ranking se limita a la cantidad de visitas. Fuente: https://wp-rankings.com/about/

Luego, continúan explicando que los autores de los más de 53.000 plugins publicados no tienen acceso a un ranking completo, a menos que usen la API de wp.org y lo calculen. WP Rankings, explican, fue creado para darles a los desarrolladores de plugins de WordPress pistas sobre el crecimiento de sus plugins, y ofrecerles algunas otras estadísticas adicionales.

También aclaran que este proyecto también es empleado para mostrar las capacidades de su plugin Directory, en combinación con su tema Blockstrap.

Pensado para desarrolladores, ¿de qué modo lo utilizarías como especialista en WordPress?

Enlaces relacionados:

Notas:

  1. La imagen de cabecera, corresponde a una captura de pantalla parcial desde https://wp-rankings.com/plugins/full-width-responsive-slider-wp/
  2. La imagen al inicio de esta publicación muestra parte de la lista de los 50 plugins que han tenido la mayor escalada del día, presentados desde la portada de WP Rankings.

Rankings

Plugins recomendados: "Sitio en mantenimiento"

Poco a poco iré compartiendo en el grupo algunos plugins para WordPress. En esta oportunidad toca el turno para aquellos dedicados a poner nuestro sitio en estado de mantenimiento, o de construcción.

Vamos por la lista, ordenada según cantidad de instalaciones y de opiniones recibidas:

LightStart – Maintenance Mode, Coming Soon and Landing Page Builder

Al día de la fecha:

  • Actualizado: hace 4 semanas
  • Instalaciones activas: 600.000+
  • Probado hasta: WP 6.6.1, versión de PHP5.6 o superior
  • Idiomas: 31

Valoraciones:

  • Página de mantenimiento.
  • Página de próximamente para sitios web nuevos.
  • Landing page para sitios existentes.
  • Permite establecer una fecha y un temporizador de puesta en producción.
  • Compatible con Multisite, donde cada instalación admite su propia configuración de mantenimiento.
  • Totalmente personalizable (colores, textos y fondos).
  • Formulario de suscripción (exporta correos a un archivo .csv).
  • Formulario de contacto y bot (recibe correos electrónicos de los visitantes).
  • Diseño responsivo.
  • Iconos de redes sociales.
  • Apto para cualquier tema de WordPress.
  • GDPR Ready.

Motivo de la recomendación: Muy personalizable, buenas funciones y diseño.

Nota: La cabecera de esta entrada corresponde a una captura de pantalla parcial desde la página en del repositorio del plugin en WordPress. La captura de pantalla pertenece a la descripción del plugin.

URL: https://es.wordpress.org/plugins/wp-maintenance-mode/

Minimal Coming Soon – Coming Soon Page

Al día de la fecha:

  • Actualizado: hace 4 semanas
  • Instalaciones activas: 100.000+
  • Probado hasta: WP 6.6.1, versión de PHP5.6 o superior

Valoraciones:

  • Configurar una página de Próximamente, una página de Modo de Mantenimiento, una página de destino (landing page) o una página de lanzamiento para tu sitio web de manera sencilla.
  • Permite el control total de su interfaz.
  • Se conecta con la API de MailChimp para que puedas recopilar correos electrónicos de los visitantes.
  • Compatible con GDPR (verificar), ya que no establece cookies y muestra una advertencia opcional debajo del campo de correo electrónico que los usuarios deben aceptar si desean suscribirse al boletín informativo.
  • Más de 300 temas y 2.000.000 de páginas en la versión PRO.
  • Compatible con todos los temas y complementos de WordPress
  • Drag and drop.
  • Compatibilidad con W3 Total Cache, WP Super Cache, Endurance Page Cache, SiteGround SuperCacher, WP Fastest Cache, Cache Enabler y Swift Performance Cache.
  • Permite CSS y HTML personalizados.
  • Puede permitir que los motores de búsqueda vean el sitio web normal mientras los visitantes ven la página Próximamente.
  • Compatible con URL de inicio de sesión personalizada.
  • 7 fuentes locales integradas para que no tenga que cargar ningún recurso externo.

Motivo de la recomendación: Muy personalizable, excelentes funciones y diseño.

Nota: La captura de pantalla que acompaña su revisión pertenece a la página de descripción del plugin en el sitio de WordPress.

URL: https://wordpress.org/plugins/minimal-coming-soon-maintenance-mode/

WP Maintenance

Al día de la fecha:

  • Actualizado: hace 4 semanas
  • Instalaciones activas: 50.000+
  • Probado hasta: WP 6.6.1
  • Idiomas: 3

Valoraciones:

  • Permite personalizar una página de mantenimiento, o en construcción.
  • Permite elegir colores, fuentes de texto, logotipo, imagen o patrón de fondo.
  • Cuenta regresiva
  • Encabezado personalizado para Analytics
  • Enlaces a redes sociales
  • CSS personalizado.
  • Permite insertar para código corto (Newsletter o formulario de contacto)
  • Permite elegir acceso por tipos de usuarios.
  • Ofrece un archivo para traducción (wp-maintenance.pot).

Motivo de la recomendación: Muy rápido de configurar, es el que suelo usar para crear páginas de sitio en mantenimiento (o próximamente) de forma sencilla.

Nota: La captura de pantalla que acompaña su revisión pertenece a la página de descripción del plugin en el sitio de WordPress.

URL: https://es.wordpress.org/plugins/wp-maintenance/

¿Qué otro plugin sobre páginas para crear páginas de sitios en mantenimiento o páginas de sitios en construcción conoces? ¿Cuál sueles utilizar?

¡Déjanos tus comentarios! :)

Saludos y bonita jornada para ti.

Plácido.

#DesarrolloWeb

Estás arruinando la velocidad de tu sitio web con DIVI

Abro este debate con la excusa de compartirles este video (https://youtu.be/DsuKqcKHg-k?si=qYSbst4PE70uuVKS) en el que se trata, específicamente, sobre cómo pueden afectar las animaciones sobre un sitio web en WordPress construido con Divi.

¿Por qué el título del debate entonces?

Porque, si bien el video se refiere específicamente a Divi, el uso excesivo de JavaScript en cualquier web, especialmente, en este grupo, en cualquier sitio web construido sobre Wordpress, va a afectar necesariamente a su rendimiento.

Las preguntas que dejo planteadas son las siguientes:

  1. ¿Qué constructor de páginas utilizas?
  2. ¿Por qué?
  3. ¿Prefieres rendimiento o presentaciones visualmente más dinámicas a cambio del rendimiento general de tu sitio?
  4. ¿Consideras para ello a tu público objetivo?

¡El debate queda abierto! :)

Plácido.

¿Qué es un channel manager?

Hace poco recibí una propuesta para el diseño del sitio web para un hotel, en la que hablamos sobre los manejadores de canales, a nivel de reservas online, por lo que hoy te comparto este enlace:

¿Qué es un channel manager y para qué sirve?: https://www.cloudbeds.com/es/articulos/gestion-de-canales/

Espero que el enlace te sea de utilidad.

Saludos y bonita jornada para ti.

Plácido.

  • 1

¿Qué funciones cumple este plugin de WordPress?

Desarrollado por la comunidad de WordPress.org, Health Check & Troubleshooting permite realizar comprobaciones sobre tu instalación de WordPress que te permitirán detectar errores de configuración, identificando, entre otros, conflictos de plugins, themes, o entre cualesquiera de ellos.

¿Qué hace que este plugin sea tan especial?

  • Permite activar un modo de resolución de problemas, que desactiva todos los plugins y themes desde la vista del administrador, aunque manteniendo el sitio en producción, sin alteraciones, para los visitantes del sitio. Esto permite que, activando los plugins o themes, uno a uno, según los que entendamos puedan resultar conflictivos o no, podamos detectar cuál o cuáles de ellos puedan estar generando conflictos en nuestra instalación.
  • Su sección de herramientas te permitirá comprobar:
  • Que los archivos de WordPress no hayan sido manipulados
  • Que los correos electrónicos se pueden enviar
  • Que tus plugins sean compatibles con actualizaciones futuras de PHP

Enlaces relacionados

Notas finales

  • Cabecera de esta entrada: Captura de pantalla desde la página del plugin.
  • Utiliza este, u otros plugins y recomendaciones propuestas en este u otros sitios, bajo tu propia responsabilidad, según tus propios conocimientos, y los pros y contras que evalúes en cada caso.

#Plugins

¿Qué es Plugin Check (PCP)?

A partir de la propia descripción del plugin, podemos resumir lo siguiente:

  • Es una herramienta avalada por WordPress, que permite comprobar si otros complementos para WordPress cumplen con los estándares requeridos para el directorio de complementos de WordPress.org, ejecutando la mayoría de las comprobaciones utilizadas para nuevos envíos.
  • Señala violaciones y observaciones en torno a las mejores prácticas de desarrollo de complementos, desde básicos como el uso correcto de las funciones de internacionalización hasta las mejores prácticas de accesibilidad, rendimiento y seguridad.
  • Las comprobaciones se pueden ejecutar utilizando la interfaz de usuario de WP Admin o WP-CLI:
  • Desde WP Admin: Herramientas> Verificación de complementos.
  • Desde WP-CLI: Usa el comando de verificación del complemento WP. Ej.: Para verificar el complemento “Hello Dolly”: wp plugin check hello.php

Notas importantes:

  1. Cuando se utiliza WP-CLI, por defecto, solo se pueden ejecutar comprobaciones estáticas, si necesitas realizar comprobaciones de tiempo de ejecución, por favor, visita la descripción en la página oficial del plugin (https://es.wordpress.org/plugins/plugin-check/).
  2. El uso de este complemento no reemplaza el proceso de revisión manual, pero ayudará a acelerar su proceso de aprobación para el repositorio de complementos de WordPress.org, así como también a evitar algunos errores comunes.
  3. El plugin también es útil para desarrollar plugins, aunque no se piensen publicar en WordPress.org, si buscamos que siga los requisitos básicos y las mejores prácticas para los complementos de WordPress.
  4. No marca cosas «malas» como tales, sino que está diseñado como una forma no perfecta de comprobar el cumplimiento de las directrices de revisión de plugins, aunque no todos los plugins deban cumplir estas directrices.
  5. Todos los plugins enviados a WordPress.org son revisados manualmente por un equipo de expertos. El comprobador de plugins automatizado no un sistema absoluto de medición.

Resumen de características y funciones de Plugin Check (PCP)

  • Analiza los plugins para detectar problemas potenciales, tales como vulnerabilidades conocidas, entre otros.
  • Revisión de compatibilidad con versiones de WordPress.
  • Ofrece recomendaciones para mejorar la seguridad y el rendimiento.
  • Se integra bien con la interfaz de administración de WordPress para una gestión más fácil.

Enlaces relacionados

Cabecera del artículo: Captura de pantalla desde la página del plugin.