{"id":233323,"date":"2023-02-11T20:27:00","date_gmt":"2023-02-11T17:27:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=233323"},"modified":"2022-11-10T20:29:09","modified_gmt":"2022-11-10T17:29:09","slug":"tutorial-de-tema-de-wordpress-para-principiantes-parte-5-acceder-a-la-informacion-de-la-publicacion","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/es\/tutorial-de-tema-de-wordpress-para-principiantes-parte-5-acceder-a-la-informacion-de-la-publicacion\/","title":{"rendered":"Tutorial de tema de WordPress para principiantes \u2013 Parte 5: Acceder a la informaci\u00f3n de la publicaci\u00f3n"},"content":{"rendered":"\n<p>Esta lecci\u00f3n del tutorial del tema de WordPress para principiantes tratar\u00e1 sobre c\u00f3mo podemos acceder y generar informaci\u00f3n como su enlace, t\u00edtulo y m\u00e1s de cada publicaci\u00f3n cuando se encuentra dentro del ciclo de publicaci\u00f3n. Hacemos esto con etiquetas de plantilla. En el proceso, tambi\u00e9n agregaremos las plantillas de vista \u00fanica a nuestro tema.<\/p>\n<p>En el <a href=\"http:\/\/awhitepixel.com\/blog\/wordpress-theme-tutorial-for-beginners-part-4-accessing-posts-with-the-loop\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">paso anterior<\/a>, agregamos el post loop que incluye la <code>the_post()<\/code>funci\u00f3n. Esta funci\u00f3n configura variables globales y se asegura de que podamos usar llamadas de funci\u00f3n simples e intuitivas, llamadas <a href=\"https:\/\/codex.wordpress.org\/Template_Tags\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">etiquetas de plantilla<\/a>, mientras estamos dentro del <code>while<\/code>bucle.<\/p>\n<h2>Etiquetas de plantilla m\u00e1s comunes para usar en el ciclo de publicaci\u00f3n<\/h2>\n<p>Esta es una lista de las etiquetas de plantilla m\u00e1s comunes que le gustar\u00eda usar para acceder a la informaci\u00f3n de una publicaci\u00f3n:<\/p>\n<ul>\n<li><code>the_title()<\/code>hace eco del t\u00edtulo de la publicaci\u00f3n.<\/li>\n<li><code>the_permalink()<\/code>genera el enlace permanente\/URL de la publicaci\u00f3n.<\/li>\n<li><code>the_content()<\/code>genera el contenido de la publicaci\u00f3n (del editor)<\/li>\n<li><code>the_excerpt()<\/code>hace eco del extracto de la publicaci\u00f3n. Si el campo de extracto est\u00e1 vac\u00edo, se repetir\u00e1n las primeras 55 palabras del contenido de la publicaci\u00f3n junto con &quot;&#8230;&quot;<\/li>\n<li><code>the_ID()<\/code>genera el ID de la publicaci\u00f3n.<\/li>\n<li><code>the_category()<\/code>hace eco de todas las categor\u00edas asociadas.<\/li>\n<li><code>the_tags()<\/code>genera todas las etiquetas asociadas.<\/li>\n<li><code>the_date()<\/code>hace eco de la fecha de publicaci\u00f3n de la publicaci\u00f3n.<\/li>\n<li><code>the_time()<\/code>genera la hora de publicaci\u00f3n de la publicaci\u00f3n.<\/li>\n<li><code>the_author()<\/code>hace eco del nombre para mostrar del autor de la publicaci\u00f3n<\/li>\n<li><code>the_post_thumbnail()<\/code>genera la imagen destacada de la publicaci\u00f3n. Aprenderemos c\u00f3mo agregar soporte para miniaturas destacadas m\u00e1s adelante en este tutorial.<\/li>\n<\/ul>\n<p>Hay muchos m\u00e1s. Si est\u00e1 interesado, eche un vistazo a la <a href=\"https:\/\/codex.wordpress.org\/Template_Tags\/#Post_tags\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">documentaci\u00f3n de WordPress Codex de todas las etiquetas de publicaci\u00f3n<\/a>. Eche un vistazo fuera del encabezado &quot;etiquetas de publicaci\u00f3n&quot; tambi\u00e9n para obtener m\u00e1s informaci\u00f3n: est\u00e1n un poco dispersas en esta p\u00e1gina.<\/p>\n<p>Empecemos a implementar algunas de estas etiquetas en nuestro <code>index.php<\/code>. Tambi\u00e9n agregar\u00e9 algo de HTML muy b\u00e1sico solo para formatear mejor la salida. \u00a1Te animo a que agregues tu propio HTML! Agregue divs, spans, secciones, encabezados, etc. con las clases que desee.<\/p>\n<h2>Desarrollando el bucle en index.php<\/h2>\n<p>Dentro del ciclo en nuestro <code>index.php<\/code>me gustar\u00eda agregar un enlace que vaya al enlace permanente de la publicaci\u00f3n. Dentro del enlace me gustar\u00eda hacer eco del t\u00edtulo de la publicaci\u00f3n. Luego tambi\u00e9n me gustar\u00eda hacer eco del extracto de la publicaci\u00f3n y sus categor\u00edas.<\/p>\n<pre><code>&lt;?php get_header(); ?&gt;\n&lt;?php \nif (have_posts()) {\n    while (have_posts()): the_post();\n        &lt;article &lt;?php post_class(); ?&gt;&gt;\n            &lt;h2&gt;\n                &lt;a href=\"&lt;?php the_permalink(); ?&gt;\" title=\"&lt;?php the_title(); ?&gt;\"&gt;&lt;?php the_title(); ?&gt;&lt;\/a&gt;\n            &lt;\/h2&gt;\n            &lt;?php the_excerpt(); ?&gt;\n            &lt;?php the_category(); ?&gt;\n        &lt;\/article&gt;\n    endwhile;\n    the_posts_pagination();\n} else {\n    ?&gt;&lt;p&gt;No posts, sorry.&lt;\/p&gt;&lt;?php\n}\n?&gt;\n&lt;?php get_sidebar(); ?&gt;\n&lt;?php get_footer(); ?&gt;<\/code><\/pre>\n<p>Lo que hace el c\u00f3digo anterior es;<\/p>\n<ul>\n<li>La l\u00ednea #5 agrega la <code>&lt;article&gt;<\/code>etiqueta HTML con una llamada <code>post_class()<\/code>que genera clases de publicaci\u00f3n \u00fatiles, tal como <code>body_class()<\/code>lo usamos en un <a href=\"http:\/\/awhitepixel.com\/blog\/wordpress-theme-tutorial-for-beginners-part-3-dynamic-content\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">paso anterior<\/a>.<\/li>\n<li>En la l\u00ednea #6-8 agregamos una <code>&lt;h2&gt;<\/code>etiqueta para el t\u00edtulo, con un enlace que va al enlace permanente de la publicaci\u00f3n (vista \u00fanica).<\/li>\n<li>La l\u00ednea #9 hace eco del extracto de la publicaci\u00f3n.<\/li>\n<li>Y en la l\u00ednea #10 hacemos eco de las categor\u00edas de la publicaci\u00f3n. Debido a que no paso ning\u00fan argumento a esta llamada, el valor predeterminado es una <code>&lt;ul&gt;<\/code>lista.<\/li>\n<\/ul>\n<p>Esto da como resultado el siguiente resultado al actualizar la p\u00e1gina principal:<\/p>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-153917-61e51609c0d16.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-153917-61e51609c0d16.png\" alt=\"Tutorial de tema de WordPress para principiantes \u2013 Parte 5: Acceder a la informaci\u00f3n de la publicaci\u00f3n\" ><\/a><\/p>\n<p>\u00a1Estamos llegando a alguna parte! Le animo a que consulte la documentaci\u00f3n de cada funci\u00f3n de etiqueta para los par\u00e1metros que aceptan. \u00a1Puedes modificar bastante la salida! Y decida usted mismo qu\u00e9 etiquetas de plantilla usar.<\/p>\n<p>Intenta hacer clic en el enlace de una publicaci\u00f3n y ver\u00e1s que llegas a esa \u00fanica p\u00e1gina de publicaci\u00f3n. Ahora puede ver que el ciclo solo muestra esa publicaci\u00f3n. Sin embargo, debido a que actualmente solo tenemos una plantilla, <code>index.php<\/code>su vista \u00fanica tambi\u00e9n usa esta plantilla. As\u00ed que la vista \u00fanica no tiene mucho sentido. \u00a1No necesitamos que se vincule a s\u00ed mismo, y queremos ver el contenido completo de la publicaci\u00f3n! Arreglemos esto creando nuestra segunda plantilla en nuestro tema.<\/p>\n<h2>Creaci\u00f3n de plantillas de vista \u00fanica<\/h2>\n<p>Si recuerdas en la <a href=\"http:\/\/awhitepixel.com\/blog\/wordpress-theme-tutorial-for-beginners-part-1-introduction\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">lecci\u00f3n 1<\/a> del tutorial de temas de WordPress para principiantes, vimos la jerarqu\u00eda de plantillas. Cuando estamos en una sola publicaci\u00f3n o p\u00e1gina, WordPress busca <code>single.php<\/code>publicaciones y <code>page.php<\/code>p\u00e1ginas. Si no se encuentra uno de estos, WordPress recurre al <code>singular.php<\/code>que se comparte independientemente del tipo de publicaci\u00f3n. Sin embargo, los temas generalmente se implementan debido <code>single.php<\/code>a <code>page.php<\/code>las diferencias entre publicaciones y p\u00e1ginas. Las p\u00e1ginas no tienen categor\u00edas ni etiquetas, y dado que las p\u00e1ginas generalmente se usan para contenido est\u00e1tico, normalmente no muestran la fecha de publicaci\u00f3n ni los comentarios. Sin embargo, esto depende completamente de usted.<\/p>\n<p>Crearemos <code>single.php<\/code>y <code>page.php<\/code>para nuestro tema. Comencemos con las publicaciones primero.<\/p>\n<h3>Plantilla de publicaci\u00f3n \u00fanica<\/h3>\n<p>En la carpeta de su tema, haga una copia <code>index.php<\/code>y c\u00e1mbiele el nombre a <code>single.php<\/code>. En <code>single.php<\/code>eliminaremos el enlace permanente (que se vincula a s\u00ed mismo) e intercambiaremos el extracto con el contenido completo de la publicaci\u00f3n. Y finalmente no necesitamos navegaci\u00f3n de archivo aqu\u00ed.<\/p>\n<pre><code>&lt;?php get_header(); ?&gt;\n&lt;?php \nif (have_posts()) {\n    while (have_posts()): the_post();\n        &lt;article &lt;?php post_class(); ?&gt;&gt;\n            &lt;h2&gt;&lt;php the_title(); ?&gt;&lt;\/h2&gt;\n            &lt;?php the_content(); ?&gt;\n            &lt;?php the_category(); ?&gt;\n        &lt;\/article&gt;\n    endwhile;\n} else {\n    ?&gt;&lt;p&gt;No posts, sorry.&lt;\/p&gt;&lt;?php\n}\n?&gt;\n&lt;?php get_sidebar(); ?&gt;\n&lt;?php get_footer(); ?&gt;<\/code><\/pre>\n<p>Agreguemos m\u00e1s informaci\u00f3n \u00fatil; como la fecha de la publicaci\u00f3n y el nombre del autor. Nuevamente, lo animo a agregar etiquetas HTML para crear una estructura HTML mucho m\u00e1s agradable.<\/p>\n<pre><code>&lt;?php get_header(); ?&gt;\n&lt;?php \nif (have_posts()) {\n    while (have_posts()): the_post();\n        &lt;article &lt;?php post_class(); ?&gt;&gt;\n            &lt;h2&gt;&lt;php the_title(); ?&gt;&lt;\/h2&gt;\n            &lt;?php the_content(); ?&gt;\n            &lt;?php the_category(); ?&gt;\n            &lt;p&gt;Posted: &lt;?php the_date(); ?&gt; at &lt;?php the_time(); ?&gt;&lt;\/p&gt;\n            &lt;p&gt;Author: &lt;?php the_author(); ?&gt;&lt;\/p&gt;\n        &lt;\/article&gt;\n    endwhile;\n} else {\n    ?&gt;&lt;p&gt;No posts, sorry.&lt;\/p&gt;&lt;?php\n}\n?&gt;\n&lt;?php get_sidebar(); ?&gt;\n&lt;?php get_footer(); ?&gt;<\/code><\/pre>\n<p>Las funciones <code>the_time()<\/code>y <code>the_date()<\/code>mostrar\u00e1n la fecha y la hora en el formato que haya definido en el panel de administraci\u00f3n &gt; Configuraci\u00f3n. Sin embargo, puede anular esto proporcionando un formato de fecha diferente como par\u00e1metro para estos m\u00e9todos.<\/p>\n<p>La funci\u00f3n <code>the_author()<\/code>repite el &quot;nombre para mostrar&quot; del autor. Si el usuario no ha proporcionado ning\u00fan otro nombre en su perfil, se repetir\u00e1 el nombre de usuario.<\/p>\n<p>Le <strong>recomiendo encarecidamente<\/strong> que nunca imprima los nombres de usuario, ya que esto puede representar una amenaza para la seguridad. Siempre aseg\u00farese de que los autores hayan proporcionado un nombre propio, o no use <code>the_author()<\/code>.<\/p>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-153917-61e5160aa02dd.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-153917-61e5160aa02dd.png\" alt=\"Tutorial de tema de WordPress para principiantes \u2013 Parte 5: Acceder a la informaci\u00f3n de la publicaci\u00f3n\" ><\/a><\/p>\n<p>As\u00ed me queda una sola publicaci\u00f3n ahora. \u00a1Impresionante! Hagamos la plantilla de una sola p\u00e1gina.<\/p>\n<h3>Plantilla de una sola p\u00e1gina<\/h3>\n<p>Haz una copia de tu <code>single.php<\/code>y c\u00e1mbiale el nombre a <code>page.php<\/code>. Todo lo que hice <code>page.php<\/code>fue eliminar todo lo que no estaba relacionado con las p\u00e1ginas. Hacer eco de las categor\u00edas de las p\u00e1ginas no funcionar\u00e1, y tambi\u00e9n elimin\u00e9 la fecha, la hora y el autor. Esto es lo que obtenemos en <code>page.php<\/code>:<\/p>\n<pre><code>&lt;?php get_header(); ?&gt;\n&lt;?php \nif (have_posts()) {\n    while (have_posts()): the_post();\n        &lt;article &lt;?php post_class(); ?&gt;&gt;\n            &lt;h2&gt;&lt;php the_title(); ?&gt;&lt;\/h2&gt;\n            &lt;?php the_content(); ?&gt;\n        &lt;\/article&gt;\n    endwhile;\n} else {\n    ?&gt;&lt;p&gt;No posts, sorry.&lt;\/p&gt;&lt;?php\n}\n?&gt;\n&lt;?php get_sidebar(); ?&gt;\n&lt;?php get_footer(); ?&gt;<\/code><\/pre>\n<p>\u00a1Finalmente estamos comenzando a llegar a alguna parte con nuestras plantillas! Sin embargo, no puedo repetir esto lo suficiente; Os animo a modificar las plantillas y los par\u00e1metros a las funciones a vuestro gusto. Especialmente agregando m\u00e1s contenedores HTML para que sea m\u00e1s f\u00e1cil dise\u00f1arlo m\u00e1s tarde.<\/p>\n<p>En el siguiente paso, nos alejamos un poco de las plantillas y profundizamos en la codificaci\u00f3n de back-end de los temas de WordPress.<\/p>\n<h2>Documentaci\u00f3n sobre los m\u00e9todos utilizados<\/h2>\n<ul>\n<li><a href=\"https:\/\/codex.wordpress.org\/Function_Reference\/post_class\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">post_clase<\/a><\/li>\n<li><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/the_permalink\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">el_permalink<\/a><\/li>\n<li><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/the_title\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">el t\u00edtulo<\/a><\/li>\n<li><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/the_excerpt\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">el extracto<\/a><\/li>\n<li><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/the_category\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">la categor\u00eda<\/a><\/li>\n<li><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/the_content\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">el contenido<\/a><\/li>\n<li><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/the_date\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">la fecha<\/a><\/li>\n<li><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/the_time\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">el tiempo<\/a><\/li>\n<li><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/the_author\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">el autor<\/a><\/li>\n<\/ul>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">Fuente de grabaci\u00f3n:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/awhitepixel.com\" class=\"external external_icon\">awhitepixel.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Esta lecci\u00f3n tratar\u00e1 sobre c\u00f3mo podemos acceder y generar informaci\u00f3n de cada publicaci\u00f3n cuando estamos dentro del ciclo de WordPress usando etiquetas de plantilla.<\/p>\n","protected":false},"author":1,"featured_media":223885,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[924,892,892,831,1110,800,800,831,924,840,840,861,861],"tags":[1172],"class_list":["post-233323","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-asignaturas","category-codigo","category-guia-para-principiantes","category-n-a","category-php-2","category-tutoriales","category-wordpress-2","tag-affiai-es"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/posts\/233323","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/comments?post=233323"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/posts\/233323\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/media\/223885"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/media?parent=233323"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/categories?post=233323"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/tags?post=233323"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}