✅ PluginsWeb | Tutoriales de Wordpress

🔐 Cómo Agregar un Slider Ticker de Categorías para Periódico Online en WordPress (Sin Plugins)

Hoy comparto un código personalizado que he usado en un proyecto recientemente para implementar un slider ticker de categorías que aparece automáticamente en las entradas individuales de tu blog WordPress. Esta solución es ideal para sitios de noticias, revistas digitales o blogs temáticos que desean mejorar la navegación y visibilidad de sus categorías. Qué ofrece este desarrollo Este slider ticker incluye las siguientes características: Puedes ver el Slider Ticker de…

Blog Premium Solo Código WordPress

✅¿Cuál es la Diferencia entre %, em, rem y otras unidades CSS?

Cuando trabajas con CSS en WordPress (o cualquier otra web), te encuentras con muchas unidades de medida: %, em, rem, vw, vh, ch, px…Y si no tienes clara la diferencia, es fácil caer en errores de diseño, especialmente en responsive. En este artículo te explico qué significa cada unidad, cuándo usarla y cómo se comporta dentro de un tema o builder de WordPress, todo con ejemplos fáciles de entender. Unidades…

Solo Código

✅Qué es container-type y por qué es Clave en el Futuro del Diseño en WordPress

Durante años, todo el diseño responsive en CSS ha dependido del ancho del navegador. Pero eso está empezando a cambiar. Hoy te quiero hablar de una de las funcionalidades más potentes que han llegado recientemente a CSS: las Container Queries, y de una propiedad clave para usarlas: container-type.Y sí, esto tiene implicaciones directas en el futuro de WordPress, Gutenberg y cómo diseñamos nuestras webs. El problema con el diseño responsive…

Solo Código WordPress

✅Qué es accent-color en CSS y Cómo Usarlo en Checkboxes, Radios y Más en WordPress

¿Cansado de que tus formularios tengan ese estilo gris y aburrido del navegador? Hoy te presento una propiedad que probablemente no conocías: accent-color. Con solo una línea de CSS, puedes cambiar el color de los checkboxes, botones de radio, sliders y otros elementos de formulario que antes eran casi imposibles de personalizar sin hacks o JavaScript. Si aún no sabes CSS revisa esta Guía de Introducción. Clic aquí. ¿Qué es…

Solo Código Woocommerce WordPress

✅Como Solucioné el Problema de «flasheo» de Tipografía en mi Web

Hoy quiero contarte cómo solucioné un problema clásico que ocurre en muchas webs hechas con WordPress: ese molesto «parpadeo» o «flasheo» de las fuentes al cargar la página. Durante unos milisegundos, al cargar cualquier página, el texto se mostraba con una tipografía estándar (tipo «sans-serif» del sistema) y luego, de repente, aparecía la fuente correcta, en mi caso Outfit. Esto es lo que se conoce como FOIT o FOUT, y…

Optimización Solo Código WordPress

✅¿Por qué mi Menú o Slider «flashea» o se Ve Mal al Cargar? Causas y Soluciones

¿Alguna vez has notado que al cargar tu web en WordPress, el menú de navegación o el slider de la cabecera aparece mal posicionado o con imágenes desproporcionadas durante un instante? Es como si durante unos milisegundos todo se viera sin estilo y luego, de golpe, se corrigiera. Si te ha pasado, tranquilo, no estás solo. Hoy quiero explicarte por qué ocurre este problema y cómo puedes solucionarlo, incluso si…

WordPress

✅Cómo Crear Métricas Animadas en Gutenberg (HTML, CSS y JS)

Hoy te traigo un snippet súper útil para añadir a tu web sin necesidad de plugins: métricas animadas o contadores que suben automáticamente al hacer scroll. Perfectos para mostrar logros, estadísticas o cifras clave en tu landing page o página corporativa. Y como siempre, solo necesitas HTML, CSS y JavaScript dentro de un bloque HTML de Gutenberg, nada más. ¿Para qué sirve este tipo de contador? ¿Qué hace este código?…

Solo Código WordPress

Snippets Gutenberg

✅Cómo Crear un Hero con Video + Slider en Gutenberg (HTML, CSS y JS)

Hoy quiero enseñarte a crear algo muy visual y efectivo para tu página de inicio, landing page o cualquier otra página donde necesites un hero con video de YouTube en autoplay que solo reproduce un fragmento concreto del video, como si fuese un gif animado, y que además incluye un slider de contenido encima del propio video. Y lo mejor de todo es que no necesitas plugins, solo un bloque…

Solo Código WordPress

Snippets Gutenberg

✅Cómo Abrir un Video de YouTube en un Popup con un Botón en Gutenberg

Hoy te traigo un snippet muy práctico para Gutenberg: un botón que abre un popup a pantalla completa con un video de YouTube incrustado. Ideal para páginas de inicio, landing pages o incluso para incluirlo en la barra lateral sin ocupar mucho espacio. ¿Por qué usar este sistema? A veces, incrustar directamente un video de YouTube rompe el diseño o no es lo más estético, especialmente en zonas como el…

Solo Código WordPress

Snippets Gutenberg

✅Cómo Crear un Timeline Animado en Gutenberg solo con HTML y CSS

Hoy te traigo otro snippet útil para Gutenberg: un timeline horizontal animado totalmente personalizado, que puedes insertar directamente desde un bloque de HTML sin depender de constructores visuales o plugins adicionales. ¿Qué vamos a crear? Un timeline o línea de tiempo con 8 pasos, perfecto para mostrar procesos, roadmaps o fases de un proyecto, con las siguientes características: Código completo del timeline Simplemente copia y pega este código dentro de…

Solo Código WordPress

Snippets Gutenberg

✅Cómo Crear un Grid Tipo Masonry de Testimonios con HTML, CSS y JavaScript en Gutenberg

Hoy te traigo otro snippet directo para Gutenberg sin plugins que te va a encantar. Ya hemos visto cómo crear sliders, tablas de precios y carruseles, pero ahora vamos a crear algo que queda genial en cualquier web profesional: un grid tipo masonry de testimonios con animación al hacer scroll. Es perfecto para mostrar las opiniones de tus clientes o usuarios de manera visual y dinámica, sin depender de complementos…

Solo Código WordPress

Snippets Gutenberg

✅Cómo Crear un Carrusel de Miembros del Equipo con HTML, CSS y JavaScript en Gutenberg

En Pluginsweb.es llevamos unos días explorando cómo crear funcionalidades súper útiles directamente dentro de un bloque de HTML de Gutenberg, sin plugins de por medio. Más fácil y ligero, imposible. Ya hemos aprendido a crear: Y hoy vamos un paso más allá con algo que se ve en casi cualquier web corporativa o landing page: un carrusel de miembros del equipo con autoplay infinito y pausa al pasar el ratón.…

Solo Código WordPress

Snippets Gutenberg

Agregar Comentario