Cómo utilizar eficazmente los bucles de wordpress y los bloques de bucles de consulta para optimizar la presentación del contenido de su sitio web

¿Qué es un bucle de WordPress?

El bucle de WordPress es la principal estructura de código PHP utilizada en WordPress para mostrar el contenido de entradas y páginas. Es un bloque de código PHP utilizado para recuperar entradas, páginas y otros tipos de contenido de una base de datos y mostrarlos en un sitio web WordPress.

Imagen[1]-Cómo optimizar la visualización del contenido de un sitio web mediante el uso eficiente de los bucles de wordpress y los bloques de bucle de consulta - Photon Fluctuation Network | Servicio profesional de reparación de WordPress, alcance global, respuesta rápida

Cómo funcionan los bucles de WordPress

Los bucles de WordPress son una función básica que permite ver el contenido de las entradas y páginas cuando los visitantes navegan por su sitio web. Este bucle extrae automáticamente la información de las entradas de la base de datos de tu sitio web, como el título, la fecha de publicación, el contenido del cuerpo y otros datos relevantes.

Aquí tienes un ejemplo de bucle de WordPress para que entiendas mejor cómo funciona:

Cuando usted visita un sitio web WordPress, el contenido de las entradas y páginas que se muestran en el sitio se presentan a través de una serie de funciones de trabajo. Cada una de estas funciones tiene su propia tarea específica, así que echa un vistazo a lo que cada uno de ellos es responsable de:

  • get_header() responder cantando get_footer(): Estas dos funciones se encargan de añadir cabeceras y pies de página a las páginas web, respectivamente. La cabecera suele contener el menú de navegación y el logotipo del sitio, mientras que el pie de página puede contener información de contacto, avisos de copyright, etc.
  • si (have_posts())Esta sentencia se utiliza para comprobar si hay un artículo que mostrar. Si lo hay, devuelve true para que el bucle pueda empezar a mostrar el artículo; si no lo hay, devuelve false para que el contenido del artículo no se muestre en la página web.
  • while (have_posts())Este es un bucle que se ejecutará hasta que se hayan mostrado todos los artículos. Permite que el sitio muestre cada artículo uno tras otro.
  • el_post(): Esta función prepara los datos del artículo actual que se va a mostrar, permitiendo otras funciones comoel_título()tal vezthe_post_thumbnail()Esta información puede obtenerse y presentarse correctamente.
  • el_título(), el_autor(), the_post_thumbnail()Estas funciones se utilizan para mostrar el título, el autor y la miniatura de un artículo. En las páginas web, suelen ir envueltas en código HTML para darles un formato estético.
  • declaración final endwhile responder cantando endif: Sirven para cerrar los bucles y sentencias anteriores y garantizar que la lógica del código se cierra correctamente.

Atención:Por defecto, el bucle muestra para cada entrada elel_título()yla_hora()responder cantandola_categoría() Etiquetas de plantilla de WordPress.
Alternativamente, utilice la siguiente sintaxis de código PHP para sus bucles WordPress. Aunque las funciones y los elementos son los mismos, la sintaxis tiene un formato diferente. A continuación se muestra un ejemplo de un bucle de WordPress escrito utilizando la sintaxis alternativa:

endwhile; endif; get_footer(); ?

Cómo utilizar bucles en WordPress

Imagen [2] - Cómo utilizar eficazmente los bucles de wordpress y los bloques de bucles de consulta para optimizar la visualización del contenido del sitio web - Photon Fluctuation Network | Servicio profesional de reparación de WordPress, Alcance global, Respuesta rápida

Cómo utilizar bucles para crear hipervínculos en los títulos de las entradas

En WordPress, si desea añadir un hipervínculo al título de una entrada, de modo que al hacer clic en el título pueda saltar directamente a la página de detalles de la entrada, puede utilizar la funciónthe_permalink()función. Esta función obtiene y muestra el permalink (URL) de la entrada actual.

<?php if (have_posts()) : while (have_posts()) : the_post(); ?> 
           <h2><a href="/es/</?php the_permalink(); ?>"><?php the_title() ;?></a></h2>

Cómo utilizar WordPress para recorrer contenidos, autores, fechas y categorías

Si desea que la entrada contenga autor, fecha, categoría y contenido, aplique el siguiente código de WordPress:

<?php if (have_posts()) : while (have_posts()) : the_post(); ?> 
           <h2><?php the_title() ;?></h2> 
           &lt;?php the_time(&#039;F j, Y&#039;); ?

Las etiquetas condicionales son un conjunto de funciones especiales de WordPress que ayudan a los desarrolladores de temas a decidir cómo mostrar el contenido de un sitio web en función de distintos tipos de páginas o situaciones. Estas funciones permiten un control muy flexible sobre la lógica de visualización de un sitio web, permitiendo que distintas páginas muestren contenidos diferentes.

Por ejemplo, si desea que determinados contenidos sólo se muestren en la página de inicio, puede utilizar la opción is_home() función. Esta función comprueba si la página actual es la página de inicio del blog; si es así, ejecuta el código apropiado para mostrar un contenido específico. Si desea mostrar algo en una página separada de una entrada, puede utilizar la función is_single() función. Esta función se utiliza para determinar si la página actual es una entrada única.

Estas son las etiquetas condicionales más comunes en WordPress:

  • is_front_page() - Se utiliza para la página de inicio del sitio web.
  • is_page() - Para páginas de WordPress.
  • is_category() - Para los archivos de categorías.
  • is_tag() - Para etiquetar archivos.
  • is_archive() - Se utiliza para archivar páginas.
  • is_search() - Se utiliza en la página de resultados de búsqueda.
  • is_author() - Para archivos de autor.
  • is_404() - para es la página 404 ff.

En las páginas en las que desee utilizarlos, ajústelos a "verdadero ".

Estamos utilizando un archivo con la extensiónif statement is_front_page()Marcador, ver ejemplo:

<h2><?php the_title() ;?></h2>

Los usuarios de WordPress pueden utilizar el código anterior para mostrar las entradas en la portada.

Cómo personalizar los bucles de WordPress mediante archivos de plantilla

Para personalizar la forma en que se muestran las entradas en su sitio de WordPress, puede editar varios archivos de plantilla clave en la carpeta del tema. Estos archivos incluyenarchivo.php(se utiliza para mostrar la página de archivo),index.php(página de inicio),categoría.php(página de categoría) ytag.php(etiqueta).

Para los temas de WordPress no bloqueados, se requieren bucles de WordPress.

Ejemplo de bucle de WordPress

Cómo crear el tema Twenty Twenty en WordPressindex.phpSe añade código al archivo para que las distintas categorías de entradas tengan estilos de visualización diferentes. Este método ayuda a los lectores a distinguir más fácilmente entre las distintas categorías de entradas.

Consulte el siguiente código de bucle de WordPress, que está comentado según la documentación oficial para ayudarle a entender lo que hace cada parte:

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
    <div no numeric noise key 1011>
        <h2>
            <a href="/es/</?php the_permalink(); ?>"><?php the_title(); ?></a>
        </h2>
        <p class="post-category">Categoría:</p>
        <?php if ( in_category(3) ) : ?>
            <div style="color: red;"> <!-- 这里设置特别样式 -->
                <?php the_content(); ?>
            </div>
        
    </div>
<?php endwhile; else : ?>
    <p>No se ha encontrado ningún puesto.</p>
<?php endif; ?>

Inserción de anuncios

Con WordPress Loop, puede insertar anuncios en las entradas.Recuerde poner el código del anuncioReemplazar parcialmente con código real. :

//Código de publicidad
          

<a href="">

<a href="">

Obtener mensajes entre dos fechas

Para gestionar el sitio más fácilmente, las entradas entre dos fechas pueden filtrarse fácilmente mediante un bucle de WordPress.

= '2024-01-01' AND post_date endwhile; ?

Fíjate en los ajustes. 2024-01-01 y 2024-05-01.

Mostrando entradas hechas hace un año

Si desea mostrar los mensajes que se hicieron hace un año, utilice el siguiente código:

endif; ?

Lista de próximas entradas

Enumere las próximas entradas para animar a los usuarios a visitar su blog en el futuro.

<h2><?php the_title(); ?></h2> 
    <span class="datetime"><?php the_time('j.F Y'); ?></span></p> 
<?php endwhile; 
else: ?><p>No hay entradas programadas para el futuro.</p> 
<?php endif; ?>

Mostrar los últimos mensajes

Si desea mostrar sólo las últimas entradas principales, puede consultar el código siguiente:

$sticky, 'caller_get_posts' => 1 ) );

if (have_posts()) :
    while (have_posts()) : the_post().
        the_title().
        the_excerpt();
    endwhile; endif; endif
endif.
? >endif; ?

Crear una página de archivo

Una página de archivo es una colección de sus entradas publicadas anteriormente. Muestra fácilmente las entradas populares anteriores a los visitantes de tu web. Para crearla, consulte el código siguiente:

&gt;
  <h2><?php $numposts = $wpdb->get_var("SELECT COUNT(*) FROM $wpdb->posts WHERE post_status = 'publish'");
if (0 < $numposts) $numposts = number_format($numposts); ?>
<h2><?php echo $numposts.' recipes published since January 01, 2024'; ?>
  </h2>
  <ul id="archive-list">
    <?php
    $myposts = get_posts('numberposts=-1&');
    foreach($myposts as $post) : ?>
      <li>. <a href="/es/</?php the_permalink(); ?>"><?php the_title(); ?></a></li>
    <?php endforeach; ?>
  </ul>

Comprender los bloques de bucle de consulta de WordPress

Una de las actualizaciones más importantes de los bucles de WordPress es la introducción del bloque de bucle de consulta. Vamos a aprender qué es y cómo usarlo.

Imagen [3] - Cómo utilizar eficazmente los bucles de wordpress y los bloques de bucle de consulta para optimizar la visualización del contenido del sitio web - Photon Fluctuation Network | Servicio profesional de reparación de WordPress, alcance global, respuesta rápida

¿Qué es un bloque de bucle de consulta?

El bloque WordPress Query Loop se introdujo en WordPress 5.8 y es una potente adición a la funcionalidad básica de bucle. El editor Gutenberg lo utiliza para mostrar entradas en tu sitio.

Con los bloques de bucle de consulta de WordPress, puede crear formatos de entrada de WordPress complejos y visualmente atractivos que muestren el contenido en un orden específico. Se pueden aplicar varios filtros, como categorías, etiquetas o fechas.

Cómo utilizar los bloques de bucle de consulta en WordPress

Para añadir un bloque de bucle de consulta, abra o añada una nueva entrada de WordPress en el editor de bloques:

Imagen [4] - Cómo utilizar eficazmente los bucles de wordpress y los bloques de bucle de consulta para optimizar la visualización del contenido del sitio web - Photon Fluctuation Network | Servicio profesional de reparación de WordPress, Alcance global, Respuesta rápida

Una vez en el editor, seleccione el bloqueInsertador "+"Iconos:

Imagen [5] - Cómo utilizar eficazmente los bucles de wordpress y los bloques de bucles de consulta para optimizar la visualización del contenido de su sitio web - Photon Fluctuation Network | Servicio profesional de reparación de WordPress, alcance global, respuesta rápida

Consulta de búsquedaconsultay haga clic en él

Imagen [6] - Cómo utilizar eficazmente los bucles de wordpress y los bloques de bucle de consulta para optimizar la visualización del contenido de su sitio web - Photon Fluctuation Network | Servicio profesional de reparación de WordPress, alcance global, respuesta rápida

Se añadirá un nuevo bloque de bucle de consulta a su entrada. Ahora, compruebe las siguientes secciones para la personalización.

Bloques de bucle de consulta personalizados

Cada vez que añada un nuevo bloque de bucle de consulta, verá dos opciones:

Imagen [7] - Cómo utilizar eficazmente los bucles de wordpress y los bloques de bucles de consulta para optimizar la visualización del contenido de su sitio web - Photon Fluctuation Network | Servicio profesional de reparación de WordPress, alcance global, respuesta rápida

"Elige".Las opciones le permiten elegir entre varios modos diferentes. Sólo tienes que elegir tu favorito

Imagen [8] - Cómo utilizar eficazmente los bucles de wordpress y los bloques de bucle de consulta para optimizar la visualización del contenido del sitio web - Photon Fluctuation Network | Servicio profesional de reparación de WordPress, alcance global, respuesta rápida

Cada bloque de bucle de consulta consta de varios bloques anidados, como títulos de entradas o extractos. Si desea saber qué bloques se utilizan en un bloque de bucle de consulta, abra la herramienta Visión general del documento. Aquí verá todos los bloques anidados y podrá navegar entre ellos:

Imagen [9] - Cómo utilizar eficazmente los bucles de wordpress y los bloques de bucles de consulta para optimizar la visualización del contenido de su sitio web - Photon Fluctuation Network | Servicio profesional de reparación de WordPress, alcance global, respuesta rápida
  • Inicio en blanco

existeInicio en blancoEn las opciones, verás varias plantillas. Elige la que más te guste. En este ejemplo, vamos a añadir la plantilla con el título del post y el extracto:

Imagen [10] - Cómo utilizar eficazmente los bucles de wordpress y los bloques de bucles de consulta para optimizar la visualización del contenido de su sitio web - Photon Fluctuation Network | Servicio profesional de reparación de WordPress, alcance global, respuesta rápida

Una vez que haya añadido un bloque de bucle de consulta, puede personalizarlo utilizando la barra de herramientas de bloques o la sección Configuración de bloques.

  • Bloquear la barra de herramientas

La barra de herramientas de bloques es la herramienta principal para personalizar cualquier bloque de WordPress, incluidos los bloques de consulta.

Imagen [11] - Cómo utilizar eficazmente los bucles de wordpress y los bloques de bucle de consulta para optimizar la visualización del contenido del sitio web - Photon Fluctuation Network | Servicio profesional de reparación de WordPress, Alcance global, Respuesta rápida

Aquí puede convertir un bucle de consulta en un bloque de columnas o grupos, desplazarlo en el editor, ajustar la alineación o cambiar la vista por defecto. Las opciones más destacadas sonAjustes de pantallaresponder cantandointercambiabilidad::

Imagen [12] - Cómo utilizar eficazmente los bucles de wordpress y los bloques de bucle de consulta para optimizar la visualización del contenido del sitio web - Photon Fluctuation Network | Servicio profesional de reparación de WordPress, alcance global, respuesta rápida

Los ajustes de visualización permiten seleccionar el número de entradas de WordPress que se mostrarán, así como establecer el número de ellas que deben saltarse antes de que se muestre el contenido preferido.

Imagen [13] - Cómo utilizar eficazmente los bucles de wordpress y los bloques de bucle de consulta para optimizar la visualización del contenido del sitio web - Photon Fluctuation Network | Servicio profesional de reparación de WordPress, alcance global, respuesta rápida

Si no ves los ajustes de visualización, asegúrate de que están desactivados en la sección "Ajustes de bloqueo".Hereda las opciones de consulta de la plantilla.

Otra función útil de WordPress esSustituya. Con él, puedes sustituir fácilmente el modo actual por cualquier otro:

Imagen [14] - Cómo utilizar eficazmente los bucles de wordpress y los bloques de bucle de consulta para optimizar la visualización del contenido del sitio web - Photon Fluctuation Network | Servicio profesional de reparación de WordPress, alcance global, respuesta rápida
  • Sector

Otros ajustes importantes del bloque pueden establecerse haciendo clic en la esquina superior derecha del editor del"Ajustes"se encuentra:

Imagen [15] - Cómo utilizar eficazmente los bucles de wordpress y los bloques de bucle de consulta para optimizar la visualización del contenido del sitio web - Photon Fluctuation Network | Servicio profesional de reparación de WordPress, alcance global, respuesta rápida

El bloque Query Loop no sólo permite personalizar el diseño de visualización de las entradas, aplicar filtros o añadir clases CSS personalizadas, sino que también admite la paginación, lo que resulta especialmente útil cuando se gestionan sitios web con mucho contenido.

Cuando su sitio contiene un gran número de entradas, un bloque de bucle de consulta puede mostrar estas entradas en varias páginas a través de la paginación. Esta configuración ayuda a los visitantes a navegar fácilmente por tu blog a través de los números de página:

Imagen [16] - Cómo utilizar eficazmente los bucles de wordpress y los bloques de bucle de consulta para optimizar la visualización del contenido del sitio web - Photon Fluctuation Network | Servicio profesional de reparación de WordPress, alcance global, respuesta rápida

alcanzar un veredicto

Los bucles de WordPress son una potente herramienta que permite a los desarrolladores mostrar de forma eficaz las entradas y el contenido de las páginas de un sitio web. Mediante el uso de una estructura de bucle básica y varias etiquetas condicionales, los desarrolladores pueden personalizar la visualización de contenido basado en tipos de página o condiciones específicas.bucles de WordPress pueden beneficiar a cualquier sitio web mediante la organización de la forma en que se muestran los mensajes, mejorando la experiencia de navegación del visitante.


Contacte con nosotros
¿No puede leer el tutorial? Póngase en contacto con nosotros para obtener una respuesta gratuita. Ayuda gratuita para sitios personales y de pequeñas empresas
Servicio de atención al cliente WeChat
Servicio de atención al cliente WeChat
Tel: 020-2206-9892
QQ咨询:1025174874
(iii) Correo electrónico: info@361sale.com
Horario de trabajo: de lunes a viernes, de 9:30 a 18:30, días festivos libres
© Declaración de reproducción
Este artículo fue escrito por: xiesong
EL FIN
Si le gusta, apóyela.
felicitaciones0 compartir (alegrías, beneficios, privilegios, etc.) con los demás
comentarios compra de sofás

Por favor, inicie sesión para enviar un comentario

    Sin comentarios