Post Top Ad

Your Ad Spot

sábado, 25 de julio de 2020

Cómo editar una página de inicio de WordPress (de manera fácil y efectiva)

¿Desea crear una página de inicio personalizada para su sitio de WordPress?
Por defecto, WordPress muestra las publicaciones de tu blog en la página de inicio. Pero es posible que desee que la página de inicio de su sitio web muestre algo un poco diferente, como una página de destino que destaque sus productos, servicios, etc.
En este artículo, le mostraremos cómo editar y personalizar fácilmente su página de inicio de WordPress.
Editar la página de inicio de WordPress

¿Qué es la página de inicio de WordPress?

Su página de inicio de WordPress es la "portada" de su sitio web. Es la primera página que aparece cuando el usuario visita su nombre de dominio . Por ejemplo, si escribe en www.wpbeginner.comsu navegador, la página en la que aterriza es la página de inicio de nuestro sitio web:
La página de inicio de WPBeginner

¿Por qué editar la página de inicio de WordPress?

Si ha decidido crear un blog , entonces tiene mucho sentido mostrar sus publicaciones en la página de inicio.
Pero, ¿qué sucede si está utilizando WordPress para crear un sitio web para una pequeña empresa o incluso para administrar una tienda en línea ? Entonces, es probable que tenga productos o promociones que desee resaltar en su página de inicio.
Aquí hay un ejemplo de página de inicio del sitio web de negocios, de OptinMonster . Es el mejor complemento emergente de WordPress que existe. Su sitio tiene un gran blog, pero ese no es el foco de su página de inicio. En cambio, tienen un llamado a la acción realmente claro.
La página de inicio de OptinMonster
¿Te gustaría crear una página de inicio como esa? Quizás ya haya intentado establecer una página personalizada como página de inicio en WordPress, pero está luchando para que se vea bien.
Si ese es el caso, entonces estás en el lugar correcto.
Vamos a guiarlo paso a paso para configurar una página de inicio y personalizarla para que se ajuste a sus necesidades. De esa manera, puede causar una buena primera impresión y alentar a sus visitantes a tomar las medidas más importantes para la misión de su sitio.
Eso podría significar comprarle un producto digital , registrarse para unirse a su sitio de membresía o donar a su campaña de recaudación de fondos .
Vamos a cubrir algunos métodos diferentes que puede usar para crear su página de inicio personalizada de WordPress.
Puede usar estos enlaces rápidos para saltar directamente a las diferentes partes del tutorial:
  • Configurar su página de inicio en WordPress
  • Uso de las opciones integradas de su tema para editar su página de inicio
  • Uso del editor de bloques para editar su página de inicio de WordPress
  • Uso de Beaver Builder para editar su página de inicio de WordPress
  • Usando Divi para editar su página de inicio de WordPress

Configurar su página de inicio en WordPress

Por defecto, WordPress muestra las publicaciones de tu blog en la página de inicio. Sin embargo, la mayoría de los sitios web comerciales e incluso la mayoría de los blogs usan una página de inicio personalizada y crean una página de blog separada para mostrar sus publicaciones de blog.
Veamos cómo configurar una página de inicio y una página de blog separadas en WordPress.
Primero, debe crear su página yendo a Páginas »Agregar nuevo . Ponle título a Inicio, o como quieras llamarlo, y luego publica la página.
Crear una página de inicio en blanco
Consejo profesional: ¿ya tiene visitantes en su sitio? Entonces es posible que desee poner su sitio en modo de mantenimiento mientras configura su página de inicio. Alternativamente, puede configurar un sitio de preparación donde puede crear su página de inicio.
Ahora, repitamos el proceso para crear una página donde mostrarías las publicaciones de tu blog. Simplemente vaya a Páginas »Agregar nuevo y asigne un nombre a su nueva página Blog. Después de eso, puede seguir adelante y publicar la página en blanco.
Página del blog
Una vez que sus páginas estén listas, digamos a WordPress que comience a usar estas páginas.
Puede hacer esto yendo a Configuración » Página de lectura en el área de administración de WordPress. A continuación, debe seleccionar la opción 'Una página estática' en la sección 'Se muestra su página de inicio'. Después de eso, continúe y seleccione sus páginas de inicio y blog.
Configura tu página de inicio
No olvides hacer clic en el botón "Guardar cambios" para guardar tu configuración.
Consejo: El enlace de su página de inicio es simplemente su nombre de dominio, a menos que haya instalado WordPress en un subdirectorio .
Sin embargo, su página de inicio todavía está vacía. Veamos algunas de las formas de editar fácilmente su página de inicio en WordPress.

Uso de las opciones integradas de su tema para editar su página de inicio

Algunos de los mejores temas de WordPress crearán un diseño de página de inicio para que pueda editarlo fácilmente.
Puede encontrar estas opciones visitando la página Apariencia »Personalizar en su panel de WordPress. Esto lanzará el personalizador de temas de WordPress con una vista previa en vivo de su tema.
Usando el personalizador de temas de WordPress
El Personalizador de temas tiene diferentes opciones para diferentes temas. Su vista previa y las opciones disponibles pueden verse diferentes según el tema que esté utilizando.
La página de inicio predeterminada del tema Hestia en el personalizador de temas
Para editar cualquier parte de la página de inicio, simplemente haga clic en el ícono del lápiz azul al lado. Aquí, estamos editando la imagen, el texto y el botón en la parte superior de la página de inicio.
Edición de la sección superior de la página de inicio en Hestia
Nota: Tan pronto como realice modificaciones, se mostrarán en la vista previa de su sitio. Esos cambios no estarán disponibles en su sitio hasta que los publique.
Si desea eliminar una sección de la página de inicio, solo tiene que hacer clic en el icono del ojo azul en la esquina superior izquierda de esa sección.
También puede eliminar secciones y volver a agregarlas utilizando la pestaña 'Secciones de la portada' del personalizador.
Eliminar una sección de la página de inicio predeterminada de Hestia
Una vez que esté satisfecho con su página de inicio, haga clic en el botón Publicar para activarla.
Haga clic en el botón Publicar en el personalizador para activar su página de inicio
Así es como se ve nuestra página de inicio, en vivo en el sitio web:
La página de inicio terminada en vivo en el sitio web
Usar las opciones integradas de su tema es la forma más rápida de configurar su página de inicio. Sin embargo, algunos temas pueden no tener muchas opciones, o puede que no esté satisfecho con el aspecto de su página de inicio.
No se preocupe, hay muchas otras formas de editar su página de inicio y darle el aspecto que desea.

Uso del editor de bloques para editar su página de inicio de WordPress

¿Qué sucede si necesita crear su página de inicio desde cero? El editor de bloques de WordPress es una forma sencilla de hacerlo.
Para usar el editor de bloques, simplemente vaya a la pantalla Páginas y edite la página de inicio que creó anteriormente.
Agregar una nueva página en WordPress
Ahora, puede comenzar a crear el contenido para su página.
Consejo profesional: si no ha usado mucho el editor de bloques, lea nuestros consejos de expertos para dominar el editor de contenido de WordPress . Explicamos todo claramente usando muchas capturas de pantalla para mostrarle cómo funciona.
En esta parte del tutorial, utilizaremos algunos bloques simples para crear una página de inicio básica.
Primero, agregaremos un mensaje de bienvenida a la página. Puede hacerlo simplemente haciendo clic en la página para comenzar a escribir. WordPress creará automáticamente un bloque de párrafo para usted.
Agregar texto en el editor de bloques
Si desea agrandar el texto, es fácil hacerlo en la configuración de bloque en el lado derecho. Simplemente use el menú desplegable 'Tamaño preestablecido' en 'Configuración de texto'.
También puede cambiar el color de su texto debajo de esto, en la sección 'Configuración de color'.
Cambiar el tamaño del texto en el editor de bloques
A continuación, agregaremos una imagen a la página. Puede hacerlo haciendo clic en el símbolo (+) y luego seleccionando el bloque Imagen. Lo encontrará en la sección Bloques comunes, o puede buscarlo usando la barra de búsqueda.
Agregar un bloque de imagen a tu página de inicio
Puede elegir una imagen de su biblioteca de medios o cargar una nueva.
Importante: use solo imágenes que sean de dominio público o con licencia CC0 , o que haya creado usted mismo. También debe optimizar sus imágenes para la web .
A continuación, hemos agregado otro bloque de párrafo, con el texto Mira nuestras últimas publicaciones aquí .
Luego agregamos un bloque 'Últimas publicaciones', que hemos configurado para mostrar el extracto de la publicación y las imágenes destacadas, así como los títulos de las publicaciones. Puede encontrar más información sobre el bloque Últimas publicaciones en nuestro tutorial sobre cómo mostrar publicaciones recientes en WordPress .
Agregar una lista de sus últimas publicaciones a la página de inicio
Puede agregar tantos bloques como desee a su página de inicio. Es posible que también desee utilizar una plantilla de "ancho completo" o "sin barras laterales" para su página, si su tema tiene una. Puede hacerlo en la configuración del documento para su página.
Estamos usando el tema Astra en este ejemplo:
Eliminar la barra lateral de la página de inicio
Una vez que esté satisfecho con su página de inicio, haga clic en el botón 'Publicar' en la parte superior derecha de la pantalla.
Publique su página de inicio una vez que esté listo
Así es como se ve nuestra página de inicio terminada:
La página de inicio creada con el editor de bloques, en vivo en el sitio
¿Qué pasa si quieres ir más allá con tu página de inicio? Una opción es probar algunos de estos mejores complementos de bloques para WordPress para agregar nuevas funcionalidades, como un formulario de contacto, testimonios, reseñas y más.
Otra gran opción es utilizar un generador de páginas más potente para WordPress para crear algo que se vea magnífico y profesional.
En la siguiente parte de este tutorial, cubriremos dos creadores de páginas diferentes: Beaver Builder y Divi by Elegant Themes .

Uso de Beaver Builder para editar su página de inicio de WordPress

Beaver Builder es un complemento popular de creación de páginas, y es una excelente manera de crear su página de inicio.
Primero, deberá descargar, instalar y activar el complemento Beaver Builder . Para obtener más detalles, consulte nuestra guía paso a paso sobre cómo instalar un complemento de WordPress .
A continuación, puede comenzar a editar su página de inicio. Simplemente vaya al menú Páginas en WordPress y haga clic para editar la página de inicio que creamos anteriormente.
En el editor de bloques, es una buena idea cambiar a una página en blanco o sin plantilla de barras laterales en Documento »Atributos de página» Plantilla .
Estamos usando OceanWP para esta parte del tutorial. Viene con una plantilla 'Página de destino' que crea un lienzo en blanco que puede editar con el generador de páginas.
Cambiar la plantilla de página en WordPress
Una vez que haya configurado su plantilla de página, puede hacer clic en el botón 'Iniciar Beaver Builder ' en el centro de la pantalla para comenzar a usar Beaver Builder.
Inicie Beaver Builder haciendo clic en el botón
Serás llevado al editor Beaver Builder. La forma más rápida de diseñar su página de inicio es utilizando una de las plantillas preconstruidas de Beaver Builder. Haga clic en el ícono + en la esquina superior derecha, si aún no está seleccionado, luego haga clic en la etiqueta Plantillas.
Elegir entre las plantillas de Beaver Builder
Vamos a utilizar esta plantilla de 'Agencia' para nuestro sitio.
Selección de la plantilla 'Agencia' de Beaver Builder
Nota: Las plantillas no están disponibles en la versión lite de Beaver Builder.
Puedes editar lo que quieras sobre tu plantilla. Simplemente haga clic en lo que quiera cambiar. Aparecerá una pequeña ventana donde puedes hacer ediciones. Aquí, estamos editando el título de nuestra página de inicio (el texto grande en la parte superior).
Edición del texto del encabezado en Beaver Builder
Ahora hemos cambiado el título de la página y el texto en el botón debajo:
El texto modificado en Beaver Builder
Si desea agregar nuevos elementos a su página, puede hacerlo agregando un nuevo módulo o una fila completamente nueva. El contenido en Beaver Builder se organiza en filas que se dividen en columnas.
Para agregar una fila o módulo, haga clic en el ícono + en la parte superior de la pantalla. Después de eso, arrastre y suelte la fila o módulo elegido en el lugar. Aquí, estamos agregando una nueva fila de 1 columna a nuestra página:
El texto modificado en Beaver Builder
Una vez que tenga una fila en su lugar, puede agregarle 1 o más módulos. Tenemos una fila de 1 columna, por lo que solo podemos agregar 1 módulo. Vamos a usar el módulo Encabezado arrastrándolo y soltándolo en su lugar:
Agregar un módulo de encabezado a Beaver Builder
Puede cambiar la fuente y su tamaño haciendo clic en la pestaña Estilo del módulo:
Cambiar la configuración de estilo para un módulo Beaver Builder
Si desea eliminar una fila o módulo de su página, simplemente coloque el cursor del mouse sobre ella y haga clic en la X que aparece hacia el lado izquierdo.
Aquí, los íconos grises le permiten editar o eliminar toda la fila y los íconos azules le permiten editar o eliminar un módulo individual:
Eliminar un módulo en Beaver Builder
Puede continuar agregando y cambiando las filas y módulos de su página tanto como desee. Una vez que esté satisfecho con su aspecto, haga clic en 'Listo' en la esquina superior derecha.
El botón Listo en Beaver Builder
Luego puede elegir guardar o publicar su página.
Guarde o publique su página en Beaver Builder
Así es como se ve nuestra página en vivo en nuestro sitio:
La página de inicio de Beaver Builder en vivo en el sitio

Usando Divi para editar su página de inicio de WordPress

Divi es otro plugin de generador de páginas de WordPress popular. Viene con un tema de WordPress y un complemento de generador de páginas con docenas de hermosas plantillas.
Puede usar el generador de páginas Divi con cualquier tema. Para este tutorial lo usaremos con el tema Divi.
Primero, deberá descargar, instalar y activar el tema Divi de Elegant Themes . Esto incluye el constructor Divi, por lo que no necesita instalarlo por separado.
Nota: Deberá ingresar su nombre de usuario y clave API en Divi »Opciones de tema» Actualizaciones en su panel de WordPress. De lo contrario, no podrá acceder a los paquetes de diseño.
Si necesita ayuda para instalar el complemento, eche un vistazo a nuestra guía paso a paso sobre cómo instalar un complemento de WordPress .
Una vez que tenga el tema Divi y el generador de páginas en funcionamiento, puede configurar su página de inicio. Primero, vaya al menú Páginas en su panel de WordPress y luego edite la Página de inicio que creamos anteriormente.
Antes de comenzar a editar su página de inicio, es una buena idea cambiar a la plantilla de página en blanco en Documento »Atributos de página» Plantilla . De esa manera, su página de inicio no tendrá una barra lateral, título, menú o cualquier otro elemento predeterminado.
Seleccionar la plantilla de página en blanco en el tema Divi
A continuación, puede hacer clic en el botón 'Usar The Divi Builder' en la parte superior de la pantalla.
Haga clic en el botón morado en la parte superior de la pantalla para comenzar a usar Divi Builder
Ahora, deberá hacer clic en el botón 'Usar Divi Builder' en el centro de la pantalla.
Haga clic en el botón Usar Divi Builder en el centro de la pantalla
Es posible que vea un mensaje en la parte superior de la pantalla que le pregunta si desea abandonar el sitio. Haga clic en 'Salir' para ingresar al generador Divi.
El mensaje le pregunta si desea abandonar su sitio (haga clic en Salir para abrir el generador de Divi)
A continuación, verá una variedad de opciones que puede usar para crear su página. Sugerimos utilizar un diseño prefabricado como base para su página de inicio. Esto hace que sea realmente rápido y fácil configurar su página de inicio.
Elija la opción de diseño prefabricado en Divi
Divi tiene una impresionante gama de diferentes diseños para elegir. Hay 163 paquetes de diseño diferentes, y cada uno de ellos tiene varios diseños de página diferentes, incluidas las páginas de inicio.
Puede buscar a través de estos escribiendo un término de búsqueda, o puede marcar las casillas para ver solo los diseños que se ajustan a ciertas categorías.
Solo algunos de los paquetes de diseño disponibles en Divi
Vamos a utilizar el paquete de diseño 'Blog de viajes' para crear nuestra página de inicio. Primero, haga clic en el paquete que desea usar:
El paquete de diseño de Travel Blog en Divi
A continuación, verá una descripción del paquete de diseño, además de los diferentes diseños de página disponibles. Probablemente desee utilizar la página de inicio o la página de destino para su página de inicio. Vamos a elegir la opción de Inicio.
Una vez que haya elegido su diseño, haga clic en el botón 'Usar este diseño'.
Elija el diseño que desea usar en Divi
Divi importará automáticamente el diseño por usted. Luego lo verá en vivo en su página, exactamente como aparecerá en su sitio. Para editar cualquier parte de él, simplemente haga clic en él.
Al igual que Beaver Builder, Divi usa un sistema de filas (divididas en columnas) y módulos para crear su página. Con los módulos de texto, puede hacer clic en el texto y escribir lo que quiera directamente en la pantalla.
Aquí, hemos cambiado el encabezado y el texto debajo:
Editar el texto del encabezado usando Divi
Con otros módulos, puede colocar el cursor del mouse sobre ellos y hacer clic en el icono de Configuración del módulo para editarlos. Aquí, estamos editando uno de los contadores de números:
Cambiar la configuración de un módulo en el constructor Divi
Puede eliminar módulos y filas de la misma manera usando el icono de la papelera.
Es probable que desee utilizar sus propias imágenes en su página de inicio. Puede cambiarlos editando la configuración del módulo.
Tenga en cuenta que la imagen en la parte superior se establece como fondo para un módulo de encabezado de ancho completo, por lo que deberá cambiarla en Contenido »Fondo para ese módulo:
Edición de la imagen de fondo del módulo de encabezado de ancho completo
Una vez que esté satisfecho con los cambios que ha realizado en su página, puede hacer clic en 'Guardar borrador o' Publicar 'en la parte inferior de la pantalla.
Los botones Guardar borrador y Publicar en Divi
Consejo: Si no puede ver esos botones, haga clic en el botón púrpura "..." para abrirlos.
Este botón le permite expandir los controles Divi en la parte inferior de la pantalla
Así es como se ve nuestra página en vivo en el sitio web:
La página de inicio del sitio web terminado
¡Eso es! Ha creado una página de inicio de gran apariencia en WordPress y la configuró con éxito.
Esperamos que este tutorial te haya ayudado a aprender cómo editar una página de inicio de WordPress. También puede consultar nuestra guía sobre los complementos imprescindibles de WordPress y nuestros consejos sobre cómo mejorar el SEO de WordPress .
Si te gustó este artículo, suscríbete a nuestro canal de YouTube para ver videos tutoriales de WordPress. También nos puede encontrar en Twitter y Facebook .

No hay comentarios.:

Publicar un comentario

Dejanos tu comentario para seguir mejorando!

outbrain

Páginas