Saltar al contenido principal
Elementor

Cree un sitio web completo con los kits de Elementor y el generador de temas




La meta: Cree un sitio web completo que utilice un kit de plantillas de agencia digital Elementor y el tema Hello



El sitio web tendrá la siguiente estructura de páginas:

  • Hogar
  • Sobre nosotros
  • Servicios
  • Redes sociales
  • Clientela
  • Archivar con publicaciones individuales
  • Contáctenos
  • Encabezado y pié de página
  • 404 página


PASO UNO: Elija un tema

  1. Ir Apariencia> Temas
  2. Hacer clic Agregar nuevo
  3. Buscar Hola Elementor
  4. Hacer clic Instalar en pc
  5. Hacer clic Activar

PASO DOS: Crear páginas

  1. Ir Páginas> Todas las páginas
  2. Desplácese sobre el título de la página de muestra y haga clic en el enlace Papelera para eliminar la página de muestra que viene con la instalación predeterminada de WordPress.
  3. Hacer clic Agregar nuevo
  4. Asigne un nombre a la nueva página; en este caso, «Inicio»
  5. Haga clic en el Editar con Elementor botón
  6. Haga clic en el Cog de configuración de página en la esquina inferior izquierda de la Panel de widgets
  7. Cambiar el Diseño de página a «Elementor Full Width». Observe que el encabezado está incompleto. Trabajará en esto en un paso posterior.
  8. Haga clic en el Agregar icono de carpeta de plantilla para abrir el Biblioteca de plantillas.
  9. En el cuadro de búsqueda de la biblioteca de plantillas, busque «Inicio Agencia Digital”.
  10. Hacer clic Insertar para cargar la plantilla en la página.
  11. Haga clic en el Publicar botón.
  12. Haga clic en «Echar un vistazo”Para ver la página publicada.

Repita estos pasos para cada página nueva, asegurándose de agregar las páginas Acerca de, Servicios, Redes sociales, Clientes y Contáctenos.

Propina: Cree nuevas páginas presionando CMD-E en una Mac o CTRL-E en Windows para abrir el Finder, luego escriba «Agregar» y seleccione «Nueva página» en los resultados de la búsqueda. De esta manera, puede continuar creando nuevas páginas directamente desde el Editor de Elementor, sin tener que regresar al dashboard.

Nota: Observe que aún no ha creado la página de noticias. Esto se debe a que no es una página estática como las demás. Es una página de archivo con contenido dinámico y pronto creará esta página.


PASO TRES: Dígale a WordPress qué página usar como página de inicio

  1. Desde el panel de WordPress, vaya a Configuración> Lectura y cambia la opción «Se muestra su página de inicio:» a «Una página estática”, Y luego seleccione la página de inicio que creó en los pasos anteriores de la lista desplegable de la página de inicio.
  2. Haga clic en el Guardar cambios botón.
  3. Ir Páginas> Todas las páginas y verifique que la página de inicio que creó ahora dice «Portada» al lado.

PASO CUATRO: Inserte un encabezado usando el generador de temas de Elementor

  1. Presione CMD-E (Mac) o CTRL-E (Windows) para abrir el Finder y busque y seleccione «Theme Builder»
  2. Haga clic en el Agregar nuevo botón
  3. Seleccione «Encabezamiento”Del menú desplegable Tipo de plantilla
  4. Asigne un nombre a su plantilla, como Encabezado del sitio
  5. Cuando la biblioteca abra las plantillas de encabezado, busque «Agencia digital«
  6. Coloca el cursor sobre el encabezado de Agencia digital y haz clic en el Insertar enlace.

Nota: Dado que este es un sitio nuevo, aún no hemos creado un menú. Es por eso que verá un widget de menú vacío en la plantilla de encabezado que acaba de insertar. Crearemos nuestro menú de WordPress a continuación.


PASO CINCO: Cree el menú

  1. Presione CMD-E (Mac) o CTRL-E (Windows) para abrir el Finder y busque y seleccione «Menús» para navegar rápidamente a la sección de menús de WordPress.
  2. Debajo Estructura del menú, escriba un nombre para su menú, como «Menú principal»
  3. Haga clic en el Crear menú botón
  4. Debajo Agregar elementos de menú> Páginas, coloque marcas de verificación junto a cada una de las páginas que creó y haga clic en el Agregar al menú botón.
  5. Reordenarlos como desee arrastrándolos hacia arriba o hacia abajo.
  6. Anida los elementos como páginas secundarias debajo de las páginas principales arrastrando el elemento secundario ligeramente hacia la derecha y justo debajo de la página principal. Haga esto para las redes sociales, arrastrándolo justo debajo de Servicios y ligeramente hacia la derecha.
  7. Haga clic en el Menú Guardar botón.
  8. Presione CMD-E (Mac) o CTRL-E (Windows) para abrir el Finder y busque y seleccione «Theme Builder» para editar su encabezado con Elementor
  9. Hacer clic Publicar botón.
  10. Haga clic en el Agregar condición botón
  11. Escoger Incluir> Todo el sitio como la condición y haga clic en el Guardar cerrar botón.
  12. Observe que el menú ahora se muestra en el encabezado.

PASO SEIS: Inserte un pie de página con el generador de temas de Elementor

  1. Presione CMD-E (Mac) o CTRL-E (Windows) para abrir el Finder y busque y seleccione «Theme Builder»
  2. Haga clic en el Agregar nuevo botón
  3. Seleccione «Pie de página”Del menú desplegable Tipo de plantilla
  4. Asigne un nombre a su plantilla, como Pie de página del sitio
  5. Cuando la biblioteca abra las plantillas de pie de página, busque «Agencia digital«
  6. Coloca el cursor sobre el pie de página de la agencia digital y haz clic en el Insertar enlace.
  7. Tenga en cuenta que, aunque verá el encabezado en el editor, solo el pie de página será editable aquí.
  8. Haga clic en el Publicar botón.
  9. Haga clic en el Agregar condición botón
  10. Escoger Incluir> Todo el sitio como la condición y haga clic en el Guardar cerrar botón

PASO SIETE: Cree la plantilla de la página del archivo de noticias

  1. Presione CMD-E (Mac) o CTRL-E (Windows) para abrir el Finder y busque y seleccione «Theme Builder»
  2. Haga clic en el Agregar nuevo botón
  3. Seleccione «Archivo”Del menú desplegable Tipo de plantilla
  4. Asigne un nombre a su plantilla, como Archivo de noticias
  5. Cuando la biblioteca abra las plantillas de archivo, busque «Agencia digital«
  6. Coloca el cursor sobre la plantilla de archivo de la agencia digital y haz clic en el Insertar enlace.
  7. Haga clic en el Publicar botón
  8. Haga clic en el Agregar condición botón
  9. Escoger Incluir> Todos los archivos como la condición y haga clic en el Guardar cerrar botón

Nota: Dado que este es un sitio nuevo, solo tenemos la publicación predeterminada «Hola mundo». Deberá crear nuevas publicaciones, en una categoría llamada «Noticias”(Para este ejemplo, use sus propias categorías según sea necesario) y configúrelas para usar esta plantilla. Haremos eso a continuación.


PASO OCHO: Cree publicaciones nuevas en una categoría de noticias

  1. Ir Publicaciones> Todas las publicaciones
  2. Coloca el cursor sobre el título Hola mundo y haz clic en el Basura enlace para eliminar la publicación de Hello World que viene con la instalación predeterminada de WordPress
  3. Hacer clic Agregar nuevo
  4. Ponle un nombre y crea tu publicación como lo harías normalmente.
  5. Agregue una imagen destacada y un extracto si lo desea.
  6. En Categoría, haga clic en Añadir nueva categoriay darle un nombre, como Noticias
  7. Haga clic en el Publicar botón
  8. Repita los pasos 3 a 7 para cada publicación que necesita agregar a la categoría Noticias.
  9. Presione CMD-E (Mac) o CTRL-E (Windows) para abrir el Finder y buscar «Noticias» (o como sea que llame a su categoría). Hacer clic la categoría que aparece en los resultados de la búsqueda para ver la página de categorías. Verifique que sus nuevas publicaciones se muestren correctamente en la página Archivo de noticias.
  10. Haga clic en el título de cualquier publicación de la página Archivo de noticias.
  11. Tenga en cuenta que el estilo no es ideal. Esto se debe a que necesita crear un Plantilla de publicación única, que harás a continuación.

PASO NUEVE: Cree una plantilla de publicación única

  1. Presione CMD-E (Mac) o CTRL-E (Windows) para abrir el Finder y busque y seleccione «Theme Builder»
  2. Haga clic en la Add nuevo botón
  3. Seleccione «Soltero”Del menú desplegable Tipo de plantilla
  4. Seleccione «Enviar”Del menú desplegable Tipo de publicación
  5. Asigne un nombre a su plantilla, como Publicaciones individuales
  6. Cuando la biblioteca abra las plantillas de publicación única, busque «Agencia digitaly «
  7. Coloca el cursor sobre la plantilla de publicación única de Agencia Digital y haz clic en el Insertar enlace.
  8. Haga clic en el Publicar botón
  9. Haga clic en el Agregar condición botón
  10. Escoger Incluir> en Categoría> Noticias (o cualquiera que sea el nombre de su categoría) como condición y haga clic en el Guardar cerrar botón
  11. Hacer clic Echar un vistazo para ver la publicación utilizando el diseño de plantilla de publicación única.

PASO DIEZ: Agregue la página del archivo de noticias al menú

  1. Presione CMD-E (Mac) o CTRL-E (Windows) para abrir el Finder y busque “Menús” para volver a su Menú y editarlo.
  2. Debajo «Agregar elementos de menú> Categorías”, Coloque una marca de verificación junto a la categoría Noticias (o la categoría que haya creado) y haga clic en Agregar al menú
  3. Arrastre el nuevo elemento del menú a donde desee.
  4. Hacer clic Menú Guardar

PASO ONCE: Crear página 404

  1. Presione CMD-E (Mac) o CTRL-E (Windows) para abrir el Finder y busque y seleccione «Theme Builder»
  2. Haga clic en el Agregar nuevo botón
  3. Seleccione «Soltero”Del menú desplegable Tipo de plantilla
  4. Seleccione «404 Página”Del menú desplegable Tipo de publicación
  5. Asigne un nombre a su plantilla, como 404
  6. Cuando la biblioteca abra las plantillas 404, busque «Agencia digital«
  7. Coloca el cursor sobre la plantilla 404 de Agencia Digital y haz clic en el Insertar enlace
  8. Haga clic en el Publicar botón
  9. Haga clic en el Agregar condición botón
  10. Escoger Incluir> página 404 como la condición y haga clic en el Guardar cerrar botón
  11. Escriba la URL de una página que no existe en su sitio en su navegador para ver la nueva página 404 en acción.

PASO DOCE: Edite el contenido para satisfacer sus necesidades

¡Eso es! Ha creado un sitio web completamente nuevo con el kit de temas Agencia digital de Elementor. Ahora que tiene una estructura de sitio web completa, está listo para editar el contenido de las páginas para incluir toda su propia información.

R Marketing Digital