Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Copa WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Cómo mostrar extractos de entradas en temas de WordPress

Nota editorial: Ganamos una comisión de los enlaces de socios en WPBeginner. Las comisiones no afectan a las opiniones o evaluaciones de nuestros editores. Más información sobre Proceso editorial.

¿Quieres aprender a mostrar extractos de entradas en tu tema de WordPress?

Al mostrar extractos de entradas en lugar del artículo completo en su blog, puede ayudar a los visitantes a encontrar rápidamente contenido interesante y reducir el tiempo de carga de su sitio.

En este artículo, le mostraremos cómo añadir fácilmente extractos de entradas a su tema de WordPress.

How to display post excerpts in WordPress themes

¿Por qué mostrar extractos de entradas en WordPress?

Por defecto, WordPress mostrará entradas completas en la página de inicio, en la página del blog y en las páginas de archivo de tu sitio web. Sin embargo, esta no es la mejor experiencia para los usuarios que quieren navegar rápidamente a través de las diferentes entradas y encontrar la que quieren leer primero.

También puede implicar mucho desplazamiento, lo que supone un gran problema para los usuarios de smartphones y tabletas.

A medida que publiques más entradas, WordPress también puede dividir tus blogs en varias páginas utilizando la paginación. A medida que las entradas más antiguas se desplazan a otras páginas, suelen recibir menos visitas y menos participación.

Por esta razón, muchos propietarios de blogs muestran extractos de entradas en sus páginas de archivo e índice del blog. Dado que solo se carga una parte de cada artículo, esto puede aumentar la velocidad y el rendimiento de WordPress.

An example of post excerpts in a WordPress theme

WordPress es compatible con / dar soporte a extractos de entradas, pero no todos los temas hacen uso de esta característica.

Dicho esto, vamos a mostrarte cómo mostrar extractos de entradas en cualquier tema de WordPress.

Cómo comprobar si su tema de WordPress es compatible con extractos de entradas

La mayoría de los temas populares de WordPress tienen un ajuste que le permite mostrar extractos de entradas en lugar de la entrada completa.

Para ver si su tema es compatible con extractos de entradas, visite la página Apariencia ” Personalizar en el escritorio de WordPress.

La ubicación de estos ajustes variará en función de su tema de WordPress, pero debe buscar los ajustes etiquetados como “Blog”.

Adding post excerpts to a WordPress theme using the Customizer

Por ejemplo, si utiliza el tema Astra de WordPress, deberá seleccionar “Blog” y, a continuación, hacer clic en “Blog/Archivo”.

A continuación, desplácese hasta la sección “Elementos de la entrada” y despliegue la pestaña “Extracto”. Una vez hecho esto, selecciona la opción “Extracto”.

Adding post excerpts to your WordPress website

Si su tema tiene una opción de “Ajustes del tema” o “Ajustes generales de la entrada”, también puede activar extractos de entradas en estas secciones.

Una vez hecho esto, basta con hacer clic en el botón “Publicar”. Ahora, si visita el blog, el archivo o la página de inicio, verá un anuncio / catálogo / ficha en lugar de entradas completas.

Si tu tema no es compatible con / dar soporte a extractos de entradas, tendrás que añadirlo. Simplemente usa los enlaces rápidos de abajo para saltar al método que quieras usar:

Método 1: Añadir extractos de entradas a WordPress usando código (Fácil)

Si tu tema de WordPress no es compatible con extractos de entradas por defecto, siempre puedes añadir esta característica manualmente.

Puedes editar los archivos de tu tema de WordPress directamente, pero te recomendamos que crees un tema hijo. De esta forma, cuando actualices tu tema de WordPress, no perderás los cambios realizados.

Para más detalles, consulte nuestra guía para principiantes sobre cómo crear un tema hijo de WordPress.

Una vez hecho esto, tendrá que encontrar la plantilla que controla cada página en la que desea mostrar extractos de entradas. En la mayoría de los temas, será home.php, content.php, category.php y archive.php.

Si necesita ayuda para encontrar el archivo adecuado, consulte nuestra guía para principiantes sobre la jerarquía de plantillas de WordPress.

Una vez hecho esto, simplemente localice el siguiente código en cada archivo:

<?php the_content(); ?>

A continuación, sustituya este código por la etiqueta_excerpt:

<?php the_excerpt(); ?>

Una vez hecho esto, marque / compruebe el archivo en su sitio web. Ahora debería ver extractos de entradas donde antes estaba el artículo completo.

Cambiar la longitud del extracto de WordPress por defecto

Por defecto, WordPress mostrará las primeras 55 palabras de cada entrada y luego añadirá una elipsis (…) para mostrar que hay más contenido.

Puede cambiar esto para mostrar más o menos palabras añadiendo código a su sitio web WordPress. Aunque es posible editar los archivos del tema directamente, esto puede ser complicado.

Un simple error también puede causar muchos errores comunes de WordPress e incluso puede romper completamente su sitio.

Por esa razón, recomendamos usar WPCode. Facilita añadir fragmentos de código en WordPress sin tener que editar los archivos de tu tema. De esta forma, puedes actualizar o cambiar tu tema sin perder el código personalizado.

Primero, necesitas instalar y activar el plugin gratuito WPCode. Para más información, puedes consultar nuestra guía para principiantes sobre cómo instalar un plugin de WordPress.

Una vez activado, visite la página Fragmentos de código ” + Añadir fragmento desde el escritorio de WordPress y haga clic en el botón “Usar fragmento” bajo la opción “Añadir su código personalizado (nuevo fragmento)”.

How to show post excerpts using code

En la siguiente pantalla, escriba un título para el fragmento de código. Esto es sólo para tu referencia, así que puedes usar lo que quieras.

A continuación, abra el menú desplegable “Tipo de código” y seleccione “Fragmento de código PHP”.

Customizing your post excerpts using code

Una vez hecho esto, basta con pegar lo siguiente en el editor de código:

return 100;
}
add_filter('excerpt_length', 'new_excerpt_length');

// Changing excerpt more
function new_excerpt_more($more) {
return '...';
}
add_filter('excerpt_more', 'new_excerpt_more');

Este código cambia la longitud del extracto de la entrada a 100 caracteres. Puede cambiar el ‘100’ a cualquier número que desee.

Después de pegar el código, cambie el conmutador de “Inactivo” a “Activo” en la esquina superior derecha y, a continuación, haga clic en el botón “Guardar fragmento de código”.

Save and activate code snippet WPCode

Para más consejos sobre cómo personalizar los extractos de sus entradas, consulte nuestra guía práctica sobre cómo personalizar los extractos de WordPress sin código.

Método 2: Añadir extractos de entradas utilizando el editor de sitio completo (solo para temas en bloque)

Si está utilizando uno de los nuevos temas de WordPress en bloque, puede añadir extractos de entradas utilizando el editor de sitio completo.

Para empezar, diríjase a Apariencia ” Editor en el escritorio de WordPress.

Using the full-size editor (FSE)

Por defecto, el editor de sitio completo muestra la plantilla de inicio de su tema, pero puede añadir un extracto a cualquier plantilla.

En el menú de la izquierda, basta con hacer clic en “Plantillas”.

Displaying post excerpts in WordPress using the full-site editor (FSE)

Ahora verá una lista de todas las plantillas que componen su tema de WordPress. Dependiendo de su tema, es posible que desee añadir extractos al archivo, índice, búsqueda o plantilla similar.

Sólo tienes que buscar la plantilla que quieres editar y darle un clic.

Displaying post excerpts using the WordPress full-site editor (FSE)

WordPress mostrará ahora una vista previa de esta plantilla.

Para editar la plantilla, haga clic en el icono del lápiz pequeño.

Displaying post excerpts using the WordPress full-site editor (FSE)

Ahora, haz clic en el icono “+”.

En el panel de búsqueda que aparece, escriba “Extracto de entrada”.

Adding the post excerpt block to a block-based WordPress theme

Cuando aparezca el bloque adecuado, arrástralo y suéltalo en tu estructura / disposición / diseño / plantilla.

Puede repetir este proceso para añadir varios extractos de entradas a la plantilla.

Adding the post excerpt block to a block-based WordPress theme

Para ajustar el aspecto del extracto, basta con hacer clic para seleccionar el bloque Extracto de entrada.

En el menú de la derecha, puede empezar por elegir si el enlace “Leer más” aparece en la misma línea que el extracto utilizando el conmutador “Mostrar enlace en nueva línea”.

Adding a read more button to a blog archive page

Una vez hecho esto, selecciona la pestaña “Estilos”. Aquí puedes cambiar el color del texto, añadir un color de fondo, cambiar el tamaño de la letra, etc.

A medida que realice cambios, la vista previa se actualizará automáticamente, de modo que podrá probar distintos ajustes para ver cuál es el más adecuado.

How to customize a WordPress post excerpt

Cuando esté satisfecho con cómo se ha establecido el extracto de la entrada, haga clic en el botón “Guardar” para aplicar los cambios.

¿Quieres mostrar extractos de entradas en más páginas y entradas? Entonces simplemente repita los pasos anteriores, pero esta vez elija una nueva plantilla en el menú de la izquierda.

Método 3: Añadir extractos de entradas a WordPress usando un maquetador de temas (Avanzado)

Si desea tener un control total sobre el aspecto del archivo, la página de inicio, la página del blog y el resto del sitio, puede crear un tema personalizado.

Esto le permite diseñar sus propias páginas y mostrar extractos en cualquier lugar de su sitio web.

SeedProd es el mejor maquetador de temas de WordPress que te permite crear fácilmente un tema de WordPress personalizado sin escribir ningún código. También tiene un bloque de entradas listas que puedes arrastrar y soltar en cualquier página.

Nota: Existe un plugin gratuito de SeedProd que te permite crear bonitas páginas en modo Próximamente y Mantenimiento, sin importar tu presupuesto. Sin embargo, necesitarás el plan SeedProd Pro o Elite para desbloquear el maquetador de temas.

Primero, necesitas instalar y activar el plugin SeedProd. Para más detalles, consulte nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.

Una vez activado, vaya a la página SeedProd ” Ajustes e introduzca la clave de licencia del plugin. Puede encontrar esta información en su cuenta del sitio web de SeedProd.

Adding a SeedProd license key to WordPress

Después de introducir la clave de licencia, estará listo para crear un tema de WordPress personalizado utilizando el maquetador de temas de SeedProd.

En primer lugar, debe ir a la página del maquetador de temas de SeedProd “.

The SeedProd theme builder

Aquí puede utilizar uno de los kits y plantillas de sitio SeedProd ya preparados como punto de partida o crear manualmente una plantilla desde cero.

Recomendamos empezar con un tema existente, ya que crea automáticamente todos los archivos de plantilla necesarios y le da una ventaja.

Dicho esto, haga clic en el botón “Kits de plantillas de temas”.

Creating a custom WordPress theme using SeedProd

Ahora puede elegir cualquiera de las plantillas disponibles.

Todos estos temas son totalmente personalizables, por lo que podrá adaptarlos a la perfección a su blog o sitio web en WordPress.

Choosing a theme template for your WordPress website or blog

Tras elegir un tema, SeedProd creará automáticamente todas las plantillas de temas que necesite.

Puede considerarlo como la versión borrador de su tema personalizado de WordPress.

Customizing the blog, archive, and search pages using SeedProd

Ahora puede personalizar cada plantilla utilizando el editor arrastrar y soltar de SeedProd.

Como queremos añadir extractos de entradas a nuestro sitio web, pasa el ratón por encima de la plantilla“Índice, archivos y búsqueda del blog” y haz clic en el enlace “Editar diseño” cuando aparezca.

How to add post excerpts to your WordPress theme with SeedProd

Esto cargará el editor de arrastrar y soltar de SeedProd.

A la derecha, verás una vista previa de la plantilla. Por defecto, la plantilla de la página del blog mostrará el encabezado, el archivo, el título y todas tus entradas.

The SeedProd drag and drop theme editor and page builder

La parte izquierda muestra un menú con todos los bloques que puede utilizar.

Puedes añadir nuevos bloques arrastrándolos a la página y luego reorganizarlos arrastrándolos arriba y abajo con el ratón.

Puede personalizar cualquier bloque al hacer clic en él y luego utilizar los ajustes del menú de la izquierda. Cuando realice un cambio, la vista previa de SeedProd se actualizará automáticamente para mostrar esos cambios en acción.

How to customize any block in a WordPress theme

Como queremos personalizar los extractos de las entradas, basta con hacer clic para seleccionar el bloque ‘Entradas’ en la vista previa en vivo.

Una vez hecho esto, seleccione el contenido que desea mostrar en este bloque utilizando los ajustes del menú de la izquierda.

Por ejemplo, puede cambiar la estructura / disposición / diseño / plantilla de las columnas, mostrar la paginación, mostrar la imagen destacada y cambiar la etiqueta del título.

How to add post excerpts to a WordPress theme without writing code

Para mostrar el extracto de la entrada, basta con hacer clic en el conmutador “Mostrar extracto” para que se vuelva naranja.

Una vez hecho esto, puede cambiar el número de caracteres que SeedProd muestra en el extracto escribiendo un nuevo número en “Longitud del extracto”.

Adding blog excerpts to a WordPress theme

SeedProd también puede añadir un enlace “Leer más” a cada extracto, que animará a los lectores a abrir el artículo completo.

Puede añadir o quitar este enlaze utilizando el conmutador “Mostrar más información”.

Adding a 'Read More' button to your post excerpts

También puedes sustituir el texto “Leer más” por tu propio mensaje escribiendo en el campo “Leer más”.

Cuando esté satisfecho con cómo se ha establecido el extracto de la entrada, haga clic en el botón “Guardar” situado en la esquina superior derecha de la pantalla.

Customizing the 'Read More' link in a post excerpt

Ahora puede personalizar las otras plantillas de SeedProd yendo a SeedProd ” Maquetador de temas y siguiendo el mismo proceso descrito anteriormente.

Para mostrar los extractos de entradas a los visitantes, primero debe activar su tema SeedProd. Para ello, vaya a SeedProd ” Theme Builder y, a continuación, haga clic en el conmutador “Activar SeedProd Theme” para que aparezca “Sí”.

How to enable a custom WordPress theme using SeedProd

Ahora, si visita cualquiera de las páginas de su blog, verá los extractos de las entradas en directo.

Bonus: Mostrar extractos de contenido protegido por contraseña

Si usted tiene un sitio de membresía, entonces puede tener algún contenido que no está disponible para el público en general. Sin embargo, sigue siendo una buena idea mostrar un extracto de su contenido protegido por contraseña.

Esto puede intrigar a los usuarios y animarles a comprar sus suscripciones para acceder a contenidos exclusivos en su sitio web.

Puede hacerlo fácilmente utilizando Restrict Content Pro, que es un popular plugin de protección de contenidos. Una vez activado, sólo tienes que abrir una entrada de tu agrado en el editor de bloques de WordPress, donde podrás añadir un extracto para ella desde el panel de bloques.

A continuación, puede configurar su restricción en el menú desplegable.

Add an excerpt for the restricted post

Por último, publique la entrada y visite su sitio de WordPress.

Aquí, los usuarios podrán ver el extracto de la entrada y el título del contenido restringido como en cualquier otra entrada. Sin embargo, el contenido en sí estará oculto para el público.

Protected content excerpt preview

Para obtener instrucciones detalladas, también puede consultar nuestro tutorial sobre cómo mostrar un extracto de una entrada protegida por contraseña en WordPress.

Esperamos que este artículo te haya ayudado a aprender cómo mostrar extractos de entradas en temas de WordPress. Puede que también quieras ver nuestra guía sobre cómo ganar dinero online blogueando con WordPress y nuestras selecciones de expertos sobre los mejores plugins y herramientas SEO para WordPress que deberías usar.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Descargo: Nuestro contenido está apoyado por los lectores. Esto significa que si hace clic en algunos de nuestros enlaces, podemos ganar una comisión. Vea cómo se financia WPBeginner , por qué es importante, y cómo puede apoyarnos. Aquí está nuestro proceso editorial .

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

El último kit de herramientas de WordPress

Obtenga acceso GRATUITO a nuestro kit de herramientas - una colección de productos y recursos relacionados con WordPress que todo profesional debería tener!

Reader Interactions

94 comentariosDeja una respuesta

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. Manasi says

    for the plane these this is what worked for me – Go to the home page and clkick edit. Go to the block editor and click on the block – Blog Posts. You will seea setting which states ‘post control settings’

    There you can enable or disable the show excerpt setting

  3. Dicado says

    Hi thanks for this. I don’t have those files in my child theme. If I just go ahead and do this in my parent theme, won’t it be erased if there is an update?

    • WPBeginner Support says

      Correct, if you place it in your parent theme and the parent theme is updated your changes would be lost

      Administrador

  4. John says

    Thanks for this post. I also want to ask for help on how to add padding around excerpt. I have added border lines around my excerpt; the problem is the excerpt is touching the borderlines. How do I add padding around the excerpts, preventing it from touching the borderlines? Thanks in advance.

  5. Atul Jagtap says

    Hi their,
    I am using ‘Enlightenment’ theme but I have a problem that in my post I can’t see the short Post Excerpt ie it’s come blank. And this happened only with ‘Enlightenment’ this theme. Because same code I am using in other theme is working fine. So is anybody give me solution on this?

Responder a Francesco Cancelar respuesta

Gracias por elegir dejar un comentario. Tenga en cuenta que todos los comentarios son moderados de acuerdo con nuestros política de comentarios, y su dirección de correo electrónico NO será publicada. Por favor, NO utilice palabras clave en el campo de nombre. Tengamos una conversación personal y significativa.