Anteriormente vimos cómo configurar la página de inicio y la página de entradas en WordPress, pero, ¿Es posible mostrar tanto una página estática y las entradas recientes en el inicio de WordPress?, en este artículo aprenderás cómo realizar esto.
1- Generalidades
En este artículo usaremos el tema Twenty Seventeen, sin embargo el proceso es similar para otros temas. La idea principal es usar el archivo home.php del tema y en este archivo, por código, colocar la página estática antes de las entradas.
2- Configuración de entradas recientes
Primero necesitas configurar tu sitio para mostrar las últimas entradas, desde: Ajustes > Lectura, tal como se ve en la siguiente imagen.

3- Creación o modificación del archivo home.php
De acuerdo a la Jerarquía de Archivos de un Theme WordPress, necesitas ubicar si tu tema tiene un archivo home.php, en caso no lo tenga tienes que crearlo y colocar el mismo código que tiene el archivo index.php, este último es precisamente el caso del theme Twenty Seventeen. Puedes crear el archivo home.php como parte de un Child Theme.
4- Código que muestra una página estática
En el archivo home.php, ubica el contenedor principal y coloca el siguiente código:
En el código anterior:
- Primero verificamos si estamos en el home y también en la página uno, la comprobación de paginación es debido a que queremos mostrar la página estática sólo en la primera página.
- La variable $idPage, es la variable que almacena el ID de la página que queremos mostrar en el inicio, en el código anterior es 2.
- Obtenemos la página con ID = 2 y obtenemos el título y el contenido, para la variable de contenido aplicamos una función que ejecuta los hooks asignados al contenido.
- La variable $str lo que hace es crear la plantilla en la que se mostrará tanto la variable de título como de contenido.
- Finalmente imprimimos la variable $str
¿Aún con dudas?, en el siguiente video se explica cómo aplicar este código en el theme de ejemplo Twenty Seventeen.
Excelente articulo, podrías agregar mas temas dentro de este articulo como por ejemplo:
– Como añadir pagina estática sin bajar el sidebar.
– Como seleccionar el archivo correcto dentro de tu hosting, ejemplo banahosting. Lo digo porque he encontrado muchos index.php en la carpeta raíz, en la carpeta wp-conten asii… Eso si solo encontré un home.php
Ojala puedas hacer un video sobre estos temas. Gracias!
Hola, gracias por las sugerencias, Lo que no me queda claro es la primera sugerencia, ¿podrías enviar un ejemplo?, de ser posible me lo puedes enviar al formulario de contacto. https://decodecms.com/contacto/
Saludos.
excelente amigo me ayudaste mucho, gracias.
Muchas gracias por este tutorial. Lo he aplicado a mi web y pude poner en el home una página estática mas las entradas con la paginación correspondiente. Lo único es que yo tengo el theme Astra, que es gratuito y en la página home el texto me quedo más ancho que en las entradas y las otras páginas, es como que ocupa todo el ancho de la pantalla. Por ahora lo dejo así, pero me gustaría saber si es posible que el contenido se adapte a la plantilla que tengo. Si quieres te mando mi página para que la veas, es la de mi correo. Saludos cordiales.
Hola, prueba agregar el siguiente código CSS:
Puedes agregar este código al final de tu archivo style.css de tu child-theme.
Muchas gracias capo. Me sirvió el código. Funciono perfecto. Ahora tengo otro problema. Yo tengo configurado para que los títulos de las paginas y entradas sean H1. Pero en la home me la coloca en H3 y me desarma esa parte SEO. Ahora voy a ponerme a investigar (creo que los títulos de tu código funcionan con la plantilla que has utilizado tu). No se como capturar los títulos de mi plantilla. Si tenes una idea seria de mucha ayuda. De todos modos me voy a poner a investigar así trato de corregirlo. Saludos cordiales.
Ya pude arreglar los del H3. Es que tu código esta con H3 y era cambiar a H1 para solucionarlo. Que tonto por no decir una grosería. Muchas gracias por la ayuda. Saludos cordiales.
ok :). Saludos.
Yo no consigo hacerlo funcionar en este tema https://es.wordpress.org/themes/esotera/
¿Me podrian ayudar? pero mi home no tiene paginación, son todas las entradas y quisiera poner el texto abajo de ellas, no arriba como explica Jhon en este video. Gracias de antemano. Saludos
Hola, es muy raro que no tenga paginación, prueba quitando la condicional, $paged == 1, y verifica, para hacer que se muestre al final simplemente podrías poner este código al final del archivo home.php
Hola Jhon, gracias por el video. Tengo una pregunta, se pueden las entradas en mi pagina de entradas tambien, al igual que el la pagina de inicio?
Hola, si, teóricamente, sólo habría que poner el código en la página de archivos, es decir tienes que detectar qué archivo .php carga tu theme cuando se ve la página de entradas.
Hola.
He probado a realizar el tutorial y por alguna razón en me he funcionado.
He hecho lo siguiente:
1. He creado un tema hijo con uno de los plugins de wp.
2. He cambiado en apariencia al citado tema child
3. He tomado el archivo index.php y lo he copiado en la raiz del hijo. Lo he renombrado como home.php
4. He mirado en Id de la página que voy a usar como portada en la home, en mi caso era la 28.
5. He insertado el trozo de código en el archivo home.php recién creado. Justo debajo de la línea donde pone: get_header(); ?>
6. A dicho código le ha puesto la apertura y cierre de php: al final.
7. He ido a ajustes->lectura y he seleccionado una página estática para la home.
8. Me voy a la raíz del dominio y sólo me aparece la página estática, pero no las entradas.
Lo hecho con el twenty-twentyone de wp y tamibién con el Orbital Themes.
Tengo la sospecha que no estoy usando el archivo home.php del tema hijo, porque lo he cambiado de nombre y no pasa nada. Ni error ni nada.
Creo que he pegado el código en el lugar erróneo, pero…¿cómo puedo saber en el archivo donde tengo que pegarlo sin equivocarme?
Muchas gracias por la ayuda.
Hola, en el punto 7 . He ido a ajustes->lectura y he seleccionado una página estática para la home., debe seleccionar: “Tus últimas entradas”, ya que al incio se mostrará la página con el código que pusiste y luego el bucle con las últimas entradas.
Hola a Todos! Muchas gracias por este gran aporte. Estoy intentando agregar el codigo en mi web. Incluso he probado de tantas formas, que al final solo he dejado el codigo y siempre aparece la ultima entrada solamente. Quizas falta alguno de los pasos porque el unico que estoy aciendo es remplazar el idpage = 2 por el numero post=xxx de mi pagina. ¿que estoy aciendo mal?
¡Hola otra vez! a quien le pueda servir. Es impresionante lo simple que fue saber de dónde venía el problema y tenía días tratando de resolver eso. jejejjejejejje! La cuestión es que estoy tratando de usar una página basada en el Builder de mi web. Al desactivar el plugins de elementor ha funcionado. ¿Existe algún código para detener la función del elementor en esta página?
Hola, podrías probar no usar el constructor en tu página de inicio. Lamentablemente los constructores tienen sus propias reglas.
¿Existe alguna regla para desactivar las funciones de este plugin ?
LISTOOOO! Simplemente Genial. Estoy feliz de haber logrado este punto.
Es mi primera vez trabajando con códigos y me encanta. Muchas gracias.
Voy a compartir esto porque Este blog me ayudó muchísimo. De mi parte solo tuve que agregar el orden get. Después del código. apply_filters(‘
EJ:
Con esto deja de poner solo el título de la página y el resto la última entrada.
En vez de eso ahora agrega toda la la página que agrego el id.. Muchas gracias. Por este importante aporte.
Hola Antonio, que bueno que lo solucionaste, gracias igualmente por el aporte.
Saludos.