Comprender las bases y el punto de partida

1

Bienvenida y recomendaciones

2

¬ŅC√≥mo es un entorno de desarrollo profesional en WordPress?

3

Presentación del proyecto y repaso del curso de fundamentos

Crear Post Types y Archivos

4

¬ŅC√≥mo se crea y se personaliza una categor√≠a en WordPress?

5

Creemos la UI de un archivo en la web

6

¬ŅPor qu√© es importante la navegabilidad de la web y c√≥mo se mejora?

7

¬ŅQu√© es un Post Type y c√≥mo se pueden personalizar los diferentes tipos?

8

¬ŅC√≥mo creamos la UI de un Post Type personalizado?

9

Construyamos un loop personalizado

10

¬ŅQu√© es una taxonom√≠a y c√≥mo se registra una nueva?

11

¬ŅQu√© es un page template y c√≥mo se utiliza?

Utilizar AJAX

12

¬ŅC√≥mo funcionan los emails en WordPress?

13

¬ŅC√≥mo utilizar AJAX dentro de WordPress?

14

Empecemos a construir un filtro din√°mico para la web

15

Completemos la función AJAX para darle vida a nuestro filtro

La REST-API de WordPress

16

¬ŅC√≥mo se utiliza la REST-API de WordPress?

17

¬ŅQu√© son y c√≥mo funcionan los endpoints?

18

Hagamos el primer llamado a la API

Utilizar Bloques

19

¬ŅQu√© es un bloque de Gutenberg?

20

Creando un bloque nativo con React

21

Optimicemos el bloque con componentes de WordPress

22

Creemos el primer bloque din√°mico

23

Mejorando la experiencia del usuario en Gutenberg con SSR (Server Side Render)

24

Creando bloques con ACF Pro

25

Crea un bloque igual al de ACF pero de forma nativa

Deployment

26

¬ŅC√≥mo se lleva un sitio a producci√≥n?

27

¬ŅC√≥mo podemos optimizar la indexaci√≥n y el SEO de nuestro sitio?

28

¬ŅC√≥mo defiendo a mi sitio de ataques externos y lo hago m√°s seguro?

Finalizar el Curso

29

Conclusiones

No tienes acceso a esta clase

¬°Contin√ļa aprendiendo! √önete y comienza a potenciar tu carrera

Construyamos un loop personalizado

9/29
Recursos

Aportes 18

Preguntas 5

Ordenar por:

Los aportes, preguntas y respuestas son vitales para aprender en comunidad. Regístrate o inicia sesión para participar.

Hola. Comparto mi código para que el loop de los productos relacionados no muestre el producto que se está visualizando actualmente. Para lograrlo utilice el hook get_the_ID y una sentencia IF.

  <!-- Productos Relacionados -->
  <?php
    $ID_producto_actual = get_the_ID();
    $args = array(
      'post_type'       => 'producto',
      'posts_per_page'  => 6,
      'order'           => 'ASC',
      'orderby'         => 'title'
    );
    // En la siguiente variable se define el contenido
    // que vamos a solicitar a la base de datos, a través
    // del array de argumentos previamente definidos.
    // Ahora la variable $productos es un objeto con la configuración
    // necesaria para solicitar contenido.
    $productos = new WP_Query($args);
  ?>
  <!-- Ejecutar el loop con el objeto $productos -->
  <?php if($productos->have_posts()) { ?>
    <div class="row justify-content-center productos-relacionados">
      <div class="col-12">
        <h3 class="my-3 text-center">Productos relacionados</h3>
      </div>
      <?php while($productos->have_posts()) { ?>
        <?php $productos->the_post(); ?>
        <?php if(get_the_ID() != $ID_producto_actual) { ?>
          <div class="col-2 my-3 text-center">
            <?php the_post_thumbnail('thumbnail'); ?>
            <h4>
              <a href="<?php the_permalink(); ?>">
                <?php the_title(); ?>
              </a>
            </h4>
          </div>
        <?php } ?>
      <?php } ?>
    </div>
  <?php } ?>

Espero que les sea de utilidad. Saludos!

una mejor manera de hacer la parte del loop es el siguiente:

<?php if(have_posts()): ?>
        <?php while(have_posts()): the_post(); ?>
            <h1 class="my-3"><?php the_title();?></h1>

            <p class=""><?php the_content();?></p>
        <?php endwhile;?>
    <?php endif; ?>

es m√°s f√°cil de leer, se comprende y no se te pierden las llaves de apertura y cierre de php.

Les comparto el código ya integrando la opción que Carlos Betancourt dió:

<?php get_header(); ?>

<main class='container'>
        <h1> <?php the_title(); ?> </h1>

        <?php if (have_posts()) {
          while (have_posts()) {
            the_post(); ?>
        <div class="row my-5">
          <div class="col-md-6 col-12">
            <?php the_post_thumbnail('large'); ?>
          </div>
          <div class="col-md-6 col-12">
            <?php the_content(); ?>
          </div>
        </div>
        <?php
    $ID_producto_actual = get_the_ID();
    $args = array(
      'post_type'       => 'producto',
      'posts_per_page'  => 3,
      'order'           => 'ASC',
      'orderby'         => 'title'
    );
    // En la siguiente variable se define el contenido
    // que vamos a solicitar a la base de datos, a través
    // del array de argumentos previamente definidos.
    // Ahora la variable $productos es un objeto con la configuración
    // necesaria para solicitar contenido.
    $productos = new WP_Query($args);
  ?>
  <!-- Ejecutar el loop con el objeto $productos -->
  <?php if($productos->have_posts()) { ?>
    <div class="row text-center justify-content-center productos-relacionados">
      <div class="col-12">
        <h3 class="my-3 text-center">Producto relacionado</h3>
      </div>
      <?php while($productos->have_posts()) { ?>
        <?php $productos->the_post(); ?>
        <?php if(get_the_ID() != $ID_producto_actual) { ?>
          <div class="col-4 my-3 text-center">
            <?php the_post_thumbnail('thumbnail'); ?>
            <h4>
              <a href="<?php the_permalink(); ?>">
                <?php the_title(); ?>
              </a>
            </h4>
          </div>
        <?php } ?>
      <?php } ?>
    </div>
  <?php } ?>

      <?php } ?>
    <?php } ?>
</main>

<?php get_footer(); ?>```

Porque hacemos tantas etiquetas de php?? si todo es codigo php? Gracias!

Hola. Noté que en los productos relacionados también aparece el producto que se está visualizando en ese momento, creo que no debería mostrarse el mismo producto como relacionado de sí mismo.

Para solucionarlo utilice el hook get_the_ID(), el cual lo almacené en la variable $ID_producto_actual; para obtener el ID del producto que se está visualizando actualmente.

Despu√©s dentro del while del loop de los productos relacionados; mediante un if pregunto si el ID del producto que se est√° visualizando es diferente que el ID de todos los productos del post type productos, si es diferente sigue ejecut√°ndose el c√≥digo, si el ID es igual sale y contin√ļa con los siguientes productos.

Aquí el código:

  <!-- Productos Relacionados -->
  <?php
    $ID_producto_actual = get_the_ID();
    $args = array(
      'post_type'       => 'producto',
      'posts_per_page'  => 6,
      'order'           => 'ASC',
      'orderby'         => 'title'
    );
    // En la siguiente variable se define el contenido
    // que vamos a solicitar a la base de datos, a través
    // del array de argumentos previamente definidos.
    // Ahora la variable $productos es un objeto con la configuración
    // necesaria para solicitar contenido.
    $productos = new WP_Query($args);
  ?>
  <!-- Ejecutar el loop con el objeto $productos -->
  <?php if($productos->have_posts()) { ?>
    <div class="row justify-content-center productos-relacionados">
      <div class="col-12">
        <h3 class="my-3 text-center">Productos relacionados</h3>
      </div>
      <?php while($productos->have_posts()) { ?>
        <?php $productos->the_post(); ?>
        <?php if(get_the_ID() != $ID_producto_actual) { ?>
          <div class="col-2 my-3 text-center">
            <?php the_post_thumbnail('thumbnail'); ?>
            <h4>
              <a href="<?php the_permalink(); ?>">
                <?php the_title(); ?>
              </a>
            </h4>
          </div>
        <?php } ?>
      <?php } ?>
    </div>
  <?php } ?>

Espero les sea √ļtil. Saludos!!!

Comparto mi código, que resume lo que se hizo en la clase y las adecuaciones propuestas.

<?php get_header(); ?>
<main class="container">
    <h1><?php the_title(); ?></h1>

    <?php if(have_posts()){
            while(have_posts()){ the_post();
    ?>

    <div class="row my-5">
        <div class="col-md-6 col-12">
            <?php the_post_thumbnail('large')?>
        </div>
        <div class="col-md-6 col-12">
            <?php the_content();?>
        </div>
    </div>
    <?php }
        } ?>
        <?php $ID_producto_actual = get_the_ID(); ?>
        <?php $args = array(
            'post_type' => 'producto',
            'posts_per_page' => -1,
            'post__not_in'   => array($ID_producto_actual),
            'order'     => 'ASC',
            'orderby' => 'title'
        );
        $productos = new WP_Query($args); ?>
        <?php if ($productos->have_posts()) { ?>
        <div class="row text-center justify-content-center productos-relacionados">
            <div class="col-12">
                <h3>Productos relacionados</h3>
            </div>
            <?php while($productos->have_posts()) { ?>
                <?php $productos->the_post(); ?>
                <div class="col-md-2 col-12 my-3 text-center">
                    <figure><?php the_post_thumbnail('thumbnail'); ?></figure>
                    <h4 class='my-2'>
                        <a href="<?php the_permalink();?>">
                            <?php the_title(); ?>
                        </a>
                    </h4>
                </div>
            <?php } ?>
        </div>
        <?php } ?>
</main>
<?php get_footer(); ?>```

Se le pueden pasar unos cuantos argumentos al construcctor de WP_Query

No es una mala pr√°ctica poner un loop dentro de otro loop? ademas ni siquiera se us√≥ la funci√≥n wp_reset_query creo que puede terminar dando resultados extra√Īos en un template m√°s complejo

que bueno poder mostrar los productos relacionados, hasta ahora nada nuevo en este curso vs el de curso practico de wp

Cuando se trata de elegir qu√© plantillas usar para cada p√°gina, lo primero que har√° WordPress es verificar qu√© tema est√°s usando. Cada tema incluye su propio conjunto de archivos de plantilla que tendr√° prioridad sobre todos los dem√°s. Eso es parte de lo que llamamos la ¬ęjerarqu√≠a de plantillas¬Ľ (en ingl√©s, WordPress Hierarchy) de WordPress en acci√≥n, que es algo que vamos a explorar en la siguiente secci√≥n.

Si intentas cargar la página de una hipotética categoría de hosting, por ejemplo, esto es lo que sucede en segundo plano:

  • WordPress buscar√° un archivo de plantilla llamado category-hosting.php en el directorio de tu tema actual.

  • Si no hay un archivo category-hosting.php, WordPress buscar√° uno que use la ID de la categor√≠a en su lugar, como category-2.php.

  • Si WordPress no encuentra ninguna de esas opciones, buscar√° un archivo gen√©rico category.php en su lugar.

  • Si no encuentra un archivo llamado category.php, WordPress volver√° a intentar y buscar√° la plantilla archive.php.

  • Finalmente, si todo lo dem√°s falla, la plataforma cargar√° el archivo index.php de tu tema y lo usar√° como la plantilla de la p√°gina.

Aquí les dejo mi nota personal con todos los argumentos que he utilizado, capas encuentras el que necesitas para tu proyecto:

$args = [ //array con los par√°metros de Wordpress
	'post_type' => 'post', // nompre del tipo de post 	'post_mime_type' => '', // si el post_type es attachment, en este campo se puede filtrar un tipo de imagen por su mimetype	// Caso multiple array('post', 'page')
	'posts_per_page' => 5, // Cantidad de post que va a mostrar
	'offset' => 0, // De los primeros cuantos va a omitir
	'category' => '', // elegir categoría por id
	'category_name' => '', // elegir categoria por nombre
    'tax_query' => [ // Elegir por termino de una categoria
        'relation' => 'or', // solo requerido si es m√ļltiple        
        [
            'taxonomy' => 'my_custom_taxonomy',
            'terms' => 7,
            'include_children' => false // Remove if you need posts from term 7 child terms
        ],
        [
            'taxonomy' => 'my_custom_taxonomy_2',
            'terms' => 8,
            'include_children' => false // Remove if you need posts from term 7 child terms
        ],        
    ],
	'date_query' => [
		'column' => 'post_date',
		'after' => '2012-04-01',
		'before' => '2012-04-30' 
	], // Filtro por entre fechas de publicación del posts
	'orderby' => 'menu_order', // ordenar segun algo https://developer.wordpress.org/reference/classes/wp_query/#order-orderby-parameters
	'order' => 'desc', // ordenar de forma desc o asc
	'include' => '', // incluir por id cualquier post que no cumplan con el filtro
	'exclude' => '996, 665', // excluir por id
	'meta_key' => '', // filtra por el campo personalizado
	'meta_value' => '', // filtra por el campo personalizado
	'post_parent' => '', // id del post padre
	'author' => '', // filtrar por el id del autor
	'author_name' => '', // filtrar por el nombre del autor
	'post_statusf' => 'publish', // solo las que est√°n publicadas
	'suppress_filters' => true // activa los filtros de correcciones que hace Wordpress de forma autom√°tica
];

$myposts = get_posts( $args ); // Agarra toda la informacion de los post

Buenos d√≠as, ¬Ņc√≥mo logro que mis otras p√°ginas lean las entradas (categor√≠as)? No logro que las lea

Lucio, estoy pegada en un loop de mis productos y llevo un par de horas buscando el bug ¬Ņme puedes ayudar?

<?php get_header(); ?>
<main class="container">
<h1>Este producto es: <?php the_title(); ?></h1>

    <?php if(have_posts()){
            while(have_posts()){ the_post(); ?>

    <div class="row my-5">
        <div class="col-md-6 col-12">
            <?php the_post_thumbnail('large')?>
        </div>
        <div class="col-md-6 col-12">
            <?php the_content();?>
        </div>
    </div>

    <?php $args = array(
        'post_type' => 'producto',
        'posts_per_page' => 6,
        'order' => 'ASC',
        'orderby' => 'title'
    );
    $productos = new WP_Query($args); ?>
    <?php if($productos->have_posts()){ ?>
        <div class="row justify-content-productos-relacionados">
            <?php while ($productos->have_posts()){ ?>
                <?php $productos->the_posts(); ?>
                <div class="col-2 my-3">
                <?php the_post_thumbnail('thumbnail'); ?>
                </div> 
            <?php } //Cierre while have_post ?>
        </div> 
    <?php } //Cierre del if have_post ?>

    <?php //Cierre del while 
        }
     } //Cierre del if ?>
</main>
<?php get_footer(); ?>```

Todo perfectamente claro. Gracias

Para evitar que se muestre el producto que se est√° visualizando, lo hice de esta forma m√°s simple:

<?php $ID_producto_actual = get_the_ID(); ?> // A√Īad√≠ esta linea
                <?php $args = array(
                    'post_type'         => 'producto',
                    'posts_per_page'    => 6,
                    'post__not_in'      => array($ID_producto_actual), // Y aquí un array
                    'order'             => 'ASC',
                    'orderby'           => 'title'
                );

Excelente clase!!