Mostrar y ocultar texto expandible

acordeon abierto

Si te gustan esos textos que se expanden al hacer clic en una leyenda del tipo “ver“, o lo que sea, estabas esperando esto hace tiempo.

A mi la primera vez que me surgió esta utilidad fue con las subpáginas, cuando necesitas cortar un texto muy largo en varias páginas y me preguntaba que si no habría algún otro modo que no fuera usar la quicktag <!--nextpage-->, y encontré un modo de pasar de página con una especie de movimiento deslizante muy chulo.

Pero había algo que aún no había encontrado y ¡me encanta!, poder mostrar las subpáginas de una página en la página superior y se abra la página siguiente en forma de texto expandido. Esto me ha pasado varias veces, cada vez que tenía un tema sin submenús y quería que desde la página principal pudiese mostrar las siguientes-

Y no lo logré porque no conocía el plugin Subpage as expansible text shortcode que, usando el shortcode [ subpages_expand ] (espacios extra añadidos para que no se active) en la página superior, al terminar el texto de la página actual añade automáticamente los títulos de sus páginas inferiores y, haciendo clic en ellos, se expande y muestra su contenido, una chulada, que puedes ver funcionando en la página de servicios de Ayuda WordPress.

Bueno no, ¡lo siguiente!

Otra funcionalidad posible de esto de los textos expansibles sería una página de preguntas frecuentes donde cada pregunta muestre la respuesta al hacer clic en ella. Para ello hay un plugin especializado, Easy FAQ with expanding text.

Primero creas la página de preguntas frecuentes simplemente marcando una casilla al efecto en la ventana de edición de páginas que la define como FAQ. Luego simplemente elige el estilo de encabezamiento para las preguntas, párrafos, listas, fotos y videos bajo los que se ocultará el texto hasta que se haga clic en el encabezamiento de cada uno. Y sino usa los shortcodes [bg_faq_start] y [bg_faq_end] alrededor del contenido que quieras que se muestre con ese efecto.

Pero ¿y si quieres hacer lo mismo en una entrada normal?, expandir o contraer texto a voluntad con solo hacer clic en un texto, también hay opciones, unas cuantas.

Por un lado tienes al veterano plugin Text Expander, una versión a su vez del más viejo y aún funcional Expanding Text que, mediante los shortcodes [DDET (texto para abrir el texto)]Texto a expandir[/DDET] ofrecen justo lo que estamos hablando a pesar de su veteranía.

Más moderno, pero con el mismo objetivo, es Collapse-o-Matic, en este caso usando el siguiente shortcode: [expand title="texto para abrir el texto"]texto oculto que se expandirá[/expand]. En la página oficial del autor tienes más modificadores de uso del shortcode y ejemplos de uso.

Y, para terminar, también puedes instalar WP UI, un plugin que añade, mediante jQuery y CSS3 bonitos efectos de pestañas, textos ocultos que se abren en forma de acordeón, cajas de diálogo y, texto expansible o spoilers en cualquier entrada, pudiendo usar varios estilos diferentes. En su web oficial tienes unos ejemplos de esta maravilla de plugin.

Como ves, por opciones que no quede, así que a expandir y contraer textos en tus entradas, que queda muy chulo y no cuesta ni un euro.

AVISO: esta publicación es de hace dos años o más. Si es un código o un plugin podría no funcionar en las últimas versiones de WordPress, y si es una noticia podría estar ya obsoleta. Luego no digas que no te hemos avisado.

Valora este artículo para mejorar la calidad del blog ...

Al hacer una valoración se recoge una cookie con la IP de tu dispositivo

FlojitoNo está malEstá bienMe ha servidoFantástico (9 votos, promedio: 3,56 de 5)
Cargando…

Autor: Fernando Tellado

Fernando Tellado, apasionado de WordPress, profesor, consultor y ponente. Maquero cansino, padre de tres hijos y de una perrita Beagle, Bilbaíno de nacimiento, Español de corazón y ciudadano de donde me quieran. Autor del libro WordPress - La tela de la araña. Mi blog personal es Navegando con red, donde he crecido como escritor en la red y ofrezco mis visiones acerca de la Web 2.0 y la blogosfera.

Comparte esta entrada en
468 ad

Al dejar un comentario se solicitan datos como tu correo y nombre que se almacenan en una cookie para que no tengas que volver a completarlos en próximas visitas. Para enviar un comentario debes aceptar nuestra política de privacidad | Responsable de los datos: Fernando Tellado García | Finalidad: Gestión y moderación de comentarios | Legitimación: Tu consentimiento expreso | Destinatario: Disqus (acogido a EU-US Privacy Shield) | Derechos: Tienes derecho al derecho al acceso, rectificación, supresión, limitación, portabilidad y olvido de sus datos

Centro de preferencias de privacidad

Cookies imprescindibles

Se usan para almacenar tu nombre, correo, IP y demás datos que dejas en los formularios de comentarios, contacto, acceso y tus preferencias de privacidad.

AUTH_KEY, SECURE_AUTH_KEY, LOGGED_IN_KEY, NONCE_KEY, comment_author, comment_author_email, comment_author_url, rated, gdpr, gawdp

Cookies de terceros

Usamos cookies de terceros en las que se almacenan externamente para conocer tus usos de navegación, si ya estás suscrito al boletín y los elementos compartidos en redes sociales

cfduit_, intercom-id, intercom-lou, mailerlite:language, mailerlite:webform, _ga, _gid
cfduit_, intercom-id, intercom-lou, mailerlite:language, mailerlite:webform
_ga, _gid

¿Quieres cerrar tu cuenta?

Se cerrará tu cuenta y todos los datos se borrarán de manera permanente y no se podrán recuperar ¿Estás seguro?

Pin It on Pinterest