¿Quieres mostrar tu equipo en WordPress sin plugins adicionales? En este tutorial te enseño cómo hacerlo reutilizando un logo slider que ya tengas instalado. Ideal para una sección “Quiénes somos” profesional y sin complicarte.

Ideal para páginas como “Quiénes somos”, “Nuestro equipo” o cualquier sección donde quieras destacar al talento humano detrás de tu proyecto.

✅ ¿Qué necesitas antes de empezar?

• Tener instalado un plugin tipo Logo Slider (como el que vimos en videos anteriores).
• Acceso a tu constructor visual (usamos Divi en este ejemplo, pero puedes aplicarlo también con Elementor o usando bloques HTML/Código).
• Imágenes de tu equipo (idealmente en formato cuadrado para mejor visualización).
• Acceso para insertar código CSS y HTML.

🧩 Paso 1: Crea un nuevo Logo Slider

1. Ve a la sección de Logo Sliders en tu panel de WordPress.
2. Crea uno nuevo y nómbralo, por ejemplo, “Nuestro equipo”.
3. Sube todas las imágenes de tu equipo de trabajo.
4. Publica el slider y copia el shortcode que te genera.

✏️ Paso 2: Agrega nombres y cargos

Para mostrar el nombre y cargo de cada miembro del equipo, utilizamos un pequeño truco:

• En el campo de “Título” del logo, coloca el nombre y cargo separados por una barra vertical (|).

Ejemplo:

Jesús | Chef Ejecutivo

Esto nos permitirá separarlos con un salto de línea más adelante usando código.

🎨 Paso 3: Personaliza el diseño con CSS

Vamos a darle estilo al slider para que luzca como una sección de equipo. Puedes insertar este código en el área de CSS de tu tema, en el módulo de código de Divi, o directamente dentro de una etiqueta <style> en tu bloque HTML:

Importante: Asegúrate de que tu slider tenga la clase personalizada slider-equipo. Puedes asignarla en la sección de “Avanzado” del módulo, o dentro del HTML si estás usando un bloque de código:

htmlCopiarEditar<div class="slider-equipo">

[shortcode_del_slider]

</div>

🔄 Paso 4: Convierte la barra | en salto de línea

Para que el nombre y cargo se separen, insertamos este pequeño script de reemplazo:

Este script reemplaza la barra vertical por un salto de línea <br> al cargar la página.

🌐 Resultado final

Tu slider ahora mostrará a cada miembro del equipo con:

• Foto circular o con bordes redondeados
• Nombre arriba
• Cargo abajo
• Diseño limpio y adaptado a tu marca

Y todo esto sin instalar más plugins, reutilizando uno que ya tenías para logos de empresas. ¡Eficiente y profesional!

🛠️ ¿Usas Elementor o Gutenberg?

Si usas otros constructores, puedes replicar el mismo efecto usando bloques HTML y estilos en el personalizador. Déjamelo saber en los comentarios si quieres un tutorial para eso.

🙌 Recomendaciones finales

Mostrar a tu equipo de trabajo en WordPress sin instalar más plugins no solo mejora la velocidad del sitio, también te permite mantener una estructura más limpia y optimizada. Este truco es perfecto para proyectos pequeños o medianos que ya usan un logo slider, y quieren aprovecharlo al máximo.

¿Te gustaría ver este tutorial adaptado a Elementor o Gutenberg? ¡Déjamelo en los comentarios!