¿Cómo crear una página de destino con Elementor en WordPress? | Jawad Abdani | Skillshare

Velocidad de reproducción


1.0x


  • 0.5x
  • 0.75x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 1.75x
  • 2x

¿Cómo crear una página de destino con Elementor en WordPress?

teacher avatar Jawad Abdani, Certified WordPress Developer (Top 2%)

Ve esta clase y miles más

Obtenga acceso ilimitado a todas las clases
Clases enseñadas por líderes de la industria y profesionales activos
Los temas incluyen ilustración, diseño, fotografía y más

Ve esta clase y miles más

Obtenga acceso ilimitado a todas las clases
Clases enseñadas por líderes de la industria y profesionales activos
Los temas incluyen ilustración, diseño, fotografía y más

Lecciones en esta clase

    • 1.

      ¿Qué aprenderemos en este curso?

      1:00

    • 2.

      ¿Cómo configurar un sitio web?

      1:22

    • 3.

      Configuración del tema de WordPress

      1:52

    • 4.

      Configuración de complementos de WordPress

      1:57

    • 5.

      ¿Qué es Elementor y cómo usarlo?

      7:51

    • 6.

      Crear una nueva página

      1:16

    • 7.

      Desarrollo del ENCABEZADO y el PIE de página

      5:39

    • 8.

      Desarrollo de la sección HÉROE/BANNER

      5:41

    • 9.

      Desarrollo del RESTO de la página de DESTINO

      9:13

    • 10.

      Agregar ANIMACIONES a la PÁGINA DE DESTINO

      3:38

    • 11.

      ¿Qué hacer ahora?

      1:18

  • --
  • Nivel principiante
  • Nivel intermedio
  • Nivel avanzado
  • Todos los niveles

Generado por la comunidad

El nivel se determina según la opinión de la mayoría de los estudiantes que han dejado reseñas en esta clase. La recomendación del profesor o de la profesora se muestra hasta que se recopilen al menos 5 reseñas de estudiantes.

152

Estudiantes

1

Proyectos

Acerca de esta clase

En este breve curso, aprenderemos a crear una página de destino con Elementor Page Builder en WordPress. 

Cuando vayas a anunciar tu sitio web o productos, se requiere una página de aterrizaje para llamar la atención de los clientes. Así que este video te ayudará a aprender a crearlo sin tener ningún conocimiento de programación

En este curso, usaremos Elementor para crear nuestra página de destino. Ahora, ¿por qué usar Elementor? 

Bueno, hay algunas razones: 

  1. Elementor ofrece un poderoso editor VISUAL de arrastrar y soltar. Significa más control sobre tu contenido. Para asegurarte de que cada uno de tu página de aterrizaje sea JUST PERFECTO.
  2. También tiene una gran plantilla de CANVAS que podemos usar para ocultar todo lo que viene de forma predeterminada en una página de WordPress. Podemos crear totalmente todo en la página de destino con ELEMENTOR.
  3. ELEMENTOR también proporciona muchos elementos de marketing que podemos usar para optimizar nuestra página de destino. Reduce muchos complementos de terceros.

Para ver más tutoriales como este, sigue mi perfil de skillshare. 

Conoce a tu profesor(a)

Teacher Profile Image

Jawad Abdani

Certified WordPress Developer (Top 2%)

Profesor(a)

 

Thank you so much for visiting my profile! 

I am a CERTIFIED WordPress developer (Ranked in the Top 2% of WP Developers all over the world) having around 7 years of experience. I am also running a digital agency and proudly serving my clientele all around the globe. 

I'd love to share what I have learned so far in my life, from website development to starting a digital agency.

Follow me on SkillShare to get all the courses I'll post here. 

Thanks! 

Ver perfil completo

Level: All Levels

Valoración de la clase

¿Se cumplieron las expectativas?
    ¡Superadas!
  • 0%
  • 0%
  • Un poco
  • 0%
  • No realmente
  • 0%

¿Por qué unirse a Skillshare?

Mira las galardonadas Skillshare Originals

Cada clase tiene lecciones cortas y proyectos prácticos

Tu membresía apoya a los profesores de Skillshare

Aprende desde cualquier lugar

Ve clases sobre la marcha con la aplicación de Skillshare. Progresa en línea o descarga las clases para verlas en el avión, el metro o donde sea que aprendas mejor.

Transcripciones

1. ¿Qué vamos a aprender en este curso?: Hola chicos, Bienvenidos a este curso de conferencias. Ahora bien, si no me conoces, mi nombre es Muhammad en lugar de dinero y soy un desarrollador de WordPress con siete años de experiencia. También estoy queriendo una agencia digital y sirviendo orgullosamente a mi clientela en todo el mundo. En este breve curso, vamos a aprender cómo podemos crear una página única. Usaremos el constructor de páginas elementales para crear una página de destino. Ahora, también podríamos usar otras cosas, pero el propósito de usar Elementor es, es muy fácil y rápido construir una landing page usando Elementor. Con su hermoso creador de páginas de arrastrar y soltar, puede crear fácilmente los diseños que necesita. Puedes ajustar las columnas, posiciones de sección, tamaños de fuente y todo eso con simples clics. Entonces el pitch que crearemos contendrá un logo clicable, iconos sociales. Eso podría darnos un conjunto de iconos en el encabezado, manera pegadiza con una llamada a la acción clicable. También crearemos otras secciones a lo largo de la meta. Al final, agregaremos algunas animaciones agradables para que se vea más bella y atractiva. Entonces ahora espero verte por dentro. Vamos a sumergirnos en ello. 2. Cómo configurar un sitio web?: Así que enhorabuena por entrar en este curso. A medida que estés dentro, tendremos que ver cómo empezar. Entonces aquí tienes una pregunta para ti. Sí, podemos saltarnos esta parte. Si no, aquí tendremos que hacer algunas configuraciones. En primer lugar, tendremos que configurar un dominio y hosting. Y para eso, definitivamente tendremos que comprar un dominio y hospedar a las diferentes empresas. Te recomendaré que compres un dominio y hosting, ya que puedes considerar SiteGround, tal vez Bluehost, o tal vez Host Gator. Estos son los pocos nombres. Sé que hay buenas, pero puedes elegir cualquier otra pregunta también, cualquier otro dominio tan bien como quieras. Entonces después de haber configurado el dominio y el hosting, tienes que instalar un CMS de WordPress fresco en el nuevo sitio web que hemos configurado recientemente, asegura de guardar el nombre de usuario y contraseña. Usted configura. Ahora si quieres ver, si quieres ver cómo puedes configurar WordPress en o tal vez configurar dominio y hosting. Puedes ver diferentes cursos de otros cursos de Skillshare. Allí podrá ayudarte a configurar el dominio y alojar e instalar un nuevo CMS de WordPress sobre eso. Y una vez que hayas terminado de todo eso, tendremos que profundizar y comenzar a construir nuestra página de destino. 3. Cómo configurar el tema de WordPress: Así que ahora como tenemos la nueva instalación de WordPress tendremos que configurar los temas y plugins. Entonces, antes que nada, configuraremos el tema para eso. Tendrás que ir al WordPress como acabamos de instalar. Entonces este es un WordPress como acabamos de instalar. Y ahora tendremos que ir al tablero para eso. Iremos a reescribir WP admin después de la URL, y nos llevará al tablero. Por cierto, si no has iniciado sesión, tendrás que iniciar sesión en tu sitio web antes de sumergirte en este panel. Entonces para instalar, el equipo irá a apariencia y luego temas. Wordpress viene con algunas instalaciones, algunos temas predeterminados que están preinstalados. Y si lo estás, si has instalado el WordPress usando cualquier hosting o tal vez algunos instaladores de software, también tendrás algunos temas predeterminados de WordPress. Entonces en ese caso, tengo este equipo de escenario y ahora hay diferentes cosas que podemos usar Elementor. El mejor equipo, creo que para usar Elementor es Hello Elementor porque hay diferentes razones. Hola los resultados elementales son mayormente en blanco. El tema está mayormente en blanco y solo podemos usarlo con Elementor. Entonces iré a apariencia y luego temas, y luego agregaré nuevos aquí para instalar un tema. Y en el lado derecho, escribiré Hello Elementor. Y aquí voy a instalar esta escena. Lo mejor de este equipo es que es muy ligero como mencioné anteriormente. Así que el plug-in, el plug-in elemental y este equipo se convierten en una combinación perfecta. Entonces como hayas instalado el tema en el siguiente video, veremos cómo podemos instalar el complemento Elementor y comenzar. 4. Cómo configurar plugins de WordPress: Hasta el momento hemos configurado el dominio y el hosting. Hemos instalado WordPress fresco, hemos configurado el tema. Ahora hay un momento para instalar el plug-in Elementor. Y como mencioné, por qué estamos usando Elementor. Hay diferentes razones para usar Elementor son en primer lugar, viene con un editor UI UX muy agradable, por lo que podemos administrar fácilmente las columnas y el layout y todo eso. Y lo segundo es que es muy rápido y fácil construir landing pages usando Elementor porque viene con complementos muy fáciles, diferentes que pueden usar, como secciones, encabezados. El constructor de arrastrar y soltar, podemos cambiar fácilmente colores, texto, fuentes, márgenes y todo eso. Por lo que hay diferentes razones. Hay muchos beneficios para usar Elementor. Por lo tanto, podemos hacer que la Visa de préstamos entre pares sea receptiva, pero es lo suficientemente fácil como herramientas de respuesta. Así que ahora adelante e instala el plug-in Elementor en un sitio web. Para eso, tendremos que volver a ir al tablero de instrumentos. Y aquí está el tablero. Y ahora esta vez tenemos que ir a plugins y haces clic en Agregar Nuevo aquí. Y del lado derecho, buscarás el elemento dos. elimina el primer resultado que se muestra aquí. creador de sitios web lo instalará. Y dejarte conseguir este plugin. Y este fue un paso sencillo para instalar el plug-in Elementor aquí, creo que no necesitaremos los plug-ins para crear la página de préstamos. Así que simplemente nos quedaremos con este plug-in, pero tal vez más adelante si necesitamos otros plug-ins. Esa es la razón por la que estamos usando el plugin y cómo usar un plugin, ¿verdad? Así que ahora vamos a seguir adelante y comenzar a construir nuestra landing page en el siguiente video. 5. ¿Qué es el elemento y cómo usarlo?: Entonces, antes de comenzar a crear una página en ejecución, antes que nada, tendremos que ver cómo usar nuestros limitadores para que podamos ver la punta luego se rompe y todo eso. Eso nos pondrá fáciles. Facilízanos la creación de nuestra página de aprendizaje. Así que comencemos. Otra vez. Voy a tener que ir al gran agujero. Entonces aquí está el tablero. Y como han instalado el tema Hello Elementor y el plug-in elemental. Así es como se ve el tablero después. Así que vamos a crear nuestra página, nuestra primera página en realidad con Elementor para ver cómo funciona. Ahora mismo, estoy creando esta página. Porque después de eso crearemos nuestra página de destino real. Esta es una página de prueba para ver cómo funciona Elementor. Vamos a publicarlo en Publish. Y ahora veamos nuestra página. Y así es como se ve la página en el tema predeterminado de Hello Elementor y la página de aplicación en Elementor. Entonces, para editarlo, tendremos que ir de nuevo al dashboard. Para eso. Vayamos a WP admin porque cierro la página. Y aquí de nuevo, voy a ir a las páginas y dar clic en el botón Editar aquí. Y aquí, tendría que hacer clic en este Editar con Elementor porque el constructor actual que estás viendo actualmente se llama Gutenberg. Estamos usando Elementor page builder en este caso, así que haremos clic en editar con Elementor. Así que en realidad podemos abrir una página de arrastrar y soltar reclutará ambiental. Entonces así es como funciona y se ve Elementor page builder . En el lado izquierdo, encontrarás diferentes complementos que puedes usar para construir tu página de aprendizaje. Éstos son algunos de ellos, B6 y luego PRO, emisor, Pro, puedes usarlos también. Y en el lado derecho tienes una visión clara de tu página. Y aquí puedes dar click, editar las columnas y las columnas aquí haciendo clic en el icono más. Y aquí puedes, en el lado izquierdo, tienes incógnitas. Simplemente puedes arrastrar los complementos desde aquí hacia el lado derecho para usarlos. Por ejemplo, si tienes que usar un encabezado, tienes este encabezado aquí. Sólo tienes que arrastrarlo el lado derecho y te diriges está aquí. Simplemente puedes editar esto, tal vez digamos, o nuestro primer encabezado. Y eso no es todo. Se puede cambiar completamente la tipografía. Puedes cambiar los colores, el tamaño y todo eso. Para eso, simplemente tendrás que crear esta pestaña de estilo. Y tendrás todas las opciones que necesitarás agregar. Ya sabes, estás contratando por ejemplo el color del texto, puedes cambiar tu elemento de texto a quien quieras. Y epigrafía, tienes diferentes opciones. Puedes seleccionar cualquier fuente que quieras tener. Entonces vamos a dejar esta forma de onda que nunca vemos en ningún lado excepto él por algunos sitios web. Y aquí también podemos ajustar el tamaño. Y tenemos diferentes pesos. Simplemente puedes pegarte. Los pesos en la forma tendrán diferentes pesos. Cambiará el, podrás ver la audacia y ligereza de esta diversión y transformarla. Simplemente puedes hacer este texto mayúsculas o minúsculas o en mayúsculas y todo eso. Simplemente puedes cambiar el estilo de éste también. Digamos que si fuiste a tener cursiva, puedes usar eso, tener que hacer oblicuo, normal y todo eso. Simplemente puedes hacerlo desde aquí. Y entonces tenemos el fracaso declaratorio. Simplemente podemos agregar overline subyacente, línea a través o tal vez ninguno. Entonces tenemos la altura de línea, por ejemplo si tenemos, ya sabes, los textos en dos líneas diferentes, podemos ajustar los golpes de línea desde aquí. Así. La siguiente opción que tenemos es el espaciado entre letras. Simplemente podemos ajustar los encendedores aquí. Y ahora tenemos el espaciado entre palabras, así podemos usar simplemente, volvamos a moverlo a las líneas simples para que lo veas correctamente. Puedes ver cómo funciona el espaciado aquí. Esto es el espaciado funciona entre palabras y esto es básicamente trabaja conmigo letras. Entonces estas son todas las opciones que necesitarás tener. También tienes más opciones. Los textos son verdaderos? Puedes agregar un poco de agua a tus textos. Cambia el color también. Y tenemos la sombra del texto. Entonces tenemos el modo blend. Esto es algo que puedes llamar agregar. Una vez que sepamos lo que hace, puedes usarlo, pero tal vez podamos saltarnos esto. La industria sabía que este era el rubro. Y si quieres usar una imagen, puedes volver a los complementos haciendo clic en estos iconos de 9 nodos. Y veamos, aquí tendremos que usar imagen. Y voy a tener, voy a hacer clic en Nueva una imagen de demostración que he subido en la Mediateca. Así que desde aquí se pueden ajustar los tamaños de imagen. Podemos miniaturas medianas o cualquier persona que quieras. Y luego aquí tenemos alineaciones de la imagen, por ejemplo, si eres una imagen pequeña, necesitamos alinearlas a la izquierda. Puedes hacer ese centro ahora mismo. Y luego también tenemos una opción para agregar leyendas. Veamos si necesitamos agregar leyendas en la imagen. Tú también puedes hacer eso. Y tenemos la opción de agregar enlaces. Si quieres que se pueda hacer clic en la imagen, puedes usar estos enlaces para hacer que la imagen sea clicable a tal vez algún otro enlace o una página interna del sitio web. Y eso no es todo. También puedes personalizar la imagen con diferentes opciones. Tenemos el atributo aquí, por ejemplo, si necesitamos un ancho especificado para la imagen, podemos hacerlo. El siguiente ancho, el alto. Puedes ajustarlo como quieras. Y luego el objeto se ajusta, por ejemplo ahora mismo estás viendo que las imágenes estiran porque ajustamos la altura. Queremos que la imagen no se estire. Podemos hacer cubrir, contener, o necesitamos que se estire. Podemos volver a hacer el pleno, ¿verdad? Entonces aquí está la opacidad de la imagen. Filtros css. Nuevamente, esto es algo avanzado que podemos considerar tal vez en curso posterior. Y luego la Tribu Fronteriza sólida duplica las diferentes fronteras con las que definitivamente puedes jugar. Y entonces esto es una sombra de caja. Si quieres la sombra en la parte trasera de este video, lo siento, imagen. También puedes hacer eso. Entonces sí, esta era una imagen como esta. Puedes agregar cualquier elemento que quieras. Hay diferentes elementos como botones de video, un espaciador, divisor aquí, Google Maps, iconos y todo eso. Veamos también cómo funciona el video aquí. Y se puede ver los años predeterminados ya colocados. Simplemente puedes soltar tu enlace de video de YouTube aquí, o tal vez un enlace de video que quieras incrustar y el video se incrustará automáticamente. Verás lo fácil que es usar Elementor para crear las páginas. Y tal vez imaginen cómo podemos ayudar con NO lo rápido y fácil que podemos construir nuestra página de aprendizaje usando Elementor. Entonces, en el siguiente video, vamos a averiguar exactamente cómo podemos usarlo para crear emocionantes landing pages. Nos vemos en el siguiente video. 6. Cómo crear una nueva página: Ahora, tendremos que leer una página para nuestra página de aprendizaje donde realmente construiremos las secciones y todo eso. Entonces para eso, vamos a ir a las páginas aquí y agregaremos una nueva página. Estarás construyendo una landing page para un nuevo modelo, un nuevo modelo de auto. Entonces vamos a planear las cosas en consecuencia. Entonces para eso, voy a escribir aquí ABC. Muy bien, así que haciendo clic en Editar con Elementor. Se abrirá la página en el editor de Elementor. Entonces, antes que nada, limpiarás el diseño eliminando todas estas cosas adicionales. Entonces para hacer eso, iremos a ajustes en la parte inferior derecha. Y vamos a ir a ajustes en la parte inferior izquierda. Y seleccionaremos el diseño de página elementor canvas. Una vez que afirmamos elementor canvas, verás que se han eliminado todas las cosas adicionales. 7. Desarrollo de la CABINA y el PIE: Entonces ahora comenzaremos a construir nuestra landing page. En primer lugar, agregaremos nuestro encabezado y pie de página. Inicialmente. El encabezado que necesitamos es un encabezado de dos columnas. Por encima del lado izquierdo agregaremos un logo y en el lado derecho agregaremos algunos iconos sociales. Entonces, haciendo clic en este ícono más y agregando un diseño de dos columnas. En la primera columna, voy a añadir el elemento de imagen aquí para poder añadir el logo. Seleccioné algunas imágenes para usar en esta landing page. Entonces agarrándolos a todos aquí. Seleccione esta imagen para el logotipo. Como ves está apareciendo muy grande. Haremos algunas personalizaciones. Aquí. Vete tú. Esta vez. Iremos a la pestaña Estilos y agregarás algo de altura. Y como pueden ver, la imagen se está extendiendo. Seleccionaremos el ajuste del objeto como cubierta. Vamos a añadir un poco de ancho máximo, disminuir la altura movida. Y ahora tenemos que alinear esta imagen en el lado izquierdo. Entonces volveremos a la pestaña de contenido y seleccionaremos esta alineación izquierda. Desde aquí, se ve que el logo ha sido alineado a la izquierda. Y en el lado derecho irán y agregarán algunos íconos sociales. Aquí encontrarás el elemento para que los íconos sociales se apoderen de ese elemento aquí. Y por defecto, se trata de estos tres íconos irán también en Instagram. Para que Instagram también se agregue aquí. Ahora también tenemos que alinear el ícono social del lado derecho. Entonces para esto, seleccionaremos esto aquí mismo. Tenemos que alinear el logo y íconos sociales centrados verticalmente. Entonces para eso, entraremos y seleccionaremos esta sección desde aquí, desde el navegador. Y aquí en el lado izquierdo encontrarás es Vertical. Opción Alinear Vertical. Sólo tienes que entrar y seleccionar el medio, y verás que el encabezado está correctamente alineado. Agreguemos un poco de fondo claro a la cabecera. Para ello, tendremos que seleccionar la pestaña de estilo. Y aquí seleccionaremos un fondo claro, blanco, por lo que el fondo también está aplicando aquí. Como puedes ver, un hermoso encabezado está listo. Vamos a entrar y añadir un simple pie de página aquí. Para eso. También necesitamos, para eso. Nuevamente, es necesario hacer clic en este icono más. E inicialmente necesitamos un pie de página de una columna, creo. Entonces seleccionando esta columna aquí. Y voy a añadir a una imagen. Nuevamente para agregar el logo para la sección de pie de página. Este logo nuevamente, personalizándolo con la pestaña de estilo. Usando el alto. Sí, creo que eso es bueno. Y después de eso, teníamos a todos dirigiéndose hacia aquí. Dice Escritores. Centrando el encabezamiento aquí. Y seleccionaremos una fuente para. Seleccionará una fuente para toda la página de préstamos. Entonces voy a terminar seleccionando la fuente adecuada aquí y cambiando el color a negro. Haciendo el texto en mayúsculas y reduciendo el tamaño del mismo. Cambiando el contenido para ver 2022. ¿Correcto? Ahora voy a agregar la línea de copyright aquí. Añadiendo los elementos del editor de texto. Aquí, voy a escribir la línea de copyright, derecho, 2022. Todos los derechos reservados. Posteriormente. Solo estoy agregando una línea genérica aquí, alineando este centro también. Y cambiando de nuevo la fuente a Poppins. ¿Correcto? Entonces nuestro pie de página también está listo. 8. Desarrollo de la sección HÉRO/BANNER: Ahora, como tenemos lista nuestra foto, ahora, empieza a agregar las secciones de media para nuestra página de aprendizaje. Para eso, entraré y agregaré una sesión más haciendo clic en este ícono más aquí. Y como vamos a agregar el banner aquí, seleccionarás un diseño de una sola columna. Y vamos a mover esto haciendo clic en este icono. Y lo pondremos en la parte superior de la firma porque para el crédito será la última sección de la página web. Y ahora entra y da clic en esta sección. Y un lado izquierdo, verás las opciones de detección. Y entraremos y seleccionaremos la pestaña de estilo para agregar la imagen de fondo para mejor. Y para eso, voy a entrar y seleccionar este ícono clásico y subir una imagen aquí, seleccionaré una de las imágenes, una de las pocas imágenes que se cargarán antes. Entonces voy a seleccionar esta. Ciertos medios y veremos que la imagen ha sido subida. Para hacer algunas configuraciones. Voy a cambiar el tamaño de esta imagen para cubrir. Y configuraremos esto para establecer la posición al centro, al centro. Y le daremos una altura mínima a esta sección haciendo clic en esta pestaña de diseño. Ves esta sección de altura aquí, seleccionaremos min-altura y agregaremos tal vez séptimo grado, ¿verdad? Entonces tenemos una bonita sección aquí, un bonito fondo para nuestro banner. Aquí. Ves que esta columna aparece aquí. Necesitamos una columna en el lado derecho. Entonces para eso entraremos, seleccione la columna y haga clic en duplicar. Se generará otra columna que podamos ajustar. Así Menú más cerca del centro, verás que el icono va a cambiar, se cambiará el cursor del ratón y podremos hacer click en un clic en él y arrastrarlo a la derecha dos bordes tamaño. Seleccione la columna derecha al 40%. Ahora vamos a empezar a agregar elementos aquí. Entonces entraría y seleccionaría una partida. Y el nombre del rubro será auto nuevo lanzado, ¿verdad? Cambia el estilo de esta rúbrica. Por cierto, había seleccionado la fuente Poppins y el color negro para los encabezamientos, ¿verdad? Entonces entraré y pincharé en la topografía y cambiaremos el tamaño de esta fuente. También aumentará el camino a 900 tal vez. Y cambiaremos la transformación del texto a mayúsculas. Un tamaño pequeño. Y ves que está apareciendo un bonito título. Ahora. Voy a entrar y añadir el elemento editor de texto para añadir un poco de textos aquí. Vamos a usar este texto de marcador de posición por ahora. Porque ya sabes, puedes cambiarlo más tarde. Sólo voy a construirlo para ti. Entonces voy a darle estilo y cambiar el color del texto para que me guste escribir. Um, también voy a cambiar el tamaño de esta fuente a tal vez 18. Y ahora voy a añadir un botón. Hay un llamado a la acción, ¿verdad? Entonces voy a agregar un elemento de botón aquí y dar clic. Conoce más. Cambia el tamaño a mediano. E ir a la pestaña de estilo cambiará un poco la tipografía. Haciéndola mayúscula. Un poco atrevido. No es que merezcan cien. Sí, se ve bien. Y a lo mejor voy a quitar el radio fronterizo. Creo que está mostrando un poco de radio fronterizo. Entonces cuando n es cero. Y ahora puedes ver que bonita sección ha sido diseñada para intentar ajustar la imagen de fondo para esta sección, tal vez intentemos centro izquierda, o centro derecha no hace ninguna diferencia. Así que no lo hagas centro, centro otra vez. A lo mejor voy a disminuir el tamaño de la fuente, este encabezamiento. Y cambiaremos la columna eso también. Porque es tocar con el auto, ya sabes, no se ve bien. Ahora se ve bien. Entonces nuestra sección de pancartas también está lista aquí. 9. Cómo desarrollar el RESTO de la LANDING PAGE: Vamos a entrar y añadir una nueva sección. Nuevamente, haga clic en el icono más. Y ahora vamos a necesitar una sección, habrá dos columnas. Así que tomando aquí el diseño de dos columnas, nuevo, estamos irrumpiendo en la parte superior. Y ahora tenemos nuestra sección aquí. Voy a seleccionar, agregaré imagen en el lado izquierdo de esta columna. Selecciona uno de los pocos minutos que subí antes. Seleccionemos éste. Y ahora tenemos nuestra imagen aquí. Vamos a añadir un nuevo encabezado. Vamos a escribir sobre. Tal vez déjalo sobre. Y nuevamente, estile los rubros a 700. El sitio tiene que estar tal cual. Ponlo en mayúscula, ¿verdad? Cambiémosle el nombre a acerca de PBC. ¿Verdad? Voy a añadir un elemento más aquí, el editor de texto para añadir algunos textos. Vamos a salir de aquí. Y agregaremos un elemento más para el botón. Tal vez dupliquemos el botón que usamos para el banner. Para ello, tendrás que hacer clic derecho en el botón y hacer clic Duplicar y copiar ragged en la parte inferior de esta sesión. Entonces ahora tenemos que alinear verticalmente el contenido de esta sección. Para eso, haremos clic en la configuración de la columna haciendo clic en este seis iconos aquí, fixture Eigen aquí. Y lo haremos medio como lo hicimos con el encabezado. Ahora puedes ver que se ve bien. Vamos a añadir un relleno. Vamos a añadir un poco de relleno a la parte superior e inferior de esta sección. Para eso nuevamente, iremos a la pestaña Estilo. Y dos, perdón paso Edwin. Y vamos a añadir un poco de relleno aquí, tal vez 50. Vamos a desvincularlos porque también está agregando dependiendo del lado izquierdo, retire el lado derecho e izquierdo de la pintura. Tal vez aumentarlo a 70 desde arriba y 70 desde abajo, derecha. Por lo que ahora se puede ver una bonita sección está diseñada. Simplemente voy a duplicar esta sección para, porque a veces tenemos algunos iguales adicionales para mostrar en la landing page. Entonces duplicando esta sección aquí y revirtiéndola. Por lo que ahora la imagen estará en el lado derecho y la descripción estará en el lado derecho. Cambiemos la imagen. Estoy usando esta, quizá ésta por ahora. Vamos a llamarlo diseño. Y sin embargo, esta sección también está aquí. Y agreguemos un poco de trasfondo a esta sección para que sea un poco diferente al de Tuckman. Para eso, voy a este typedef. Creo, perdón si no la imagen sino a color, dándole un fondo claro. Tal vez. Esto se ve bien. Y ahora como tenemos las dos secciones para la información, la, vamos a crear una sección más donde agregaremos algunas características para el auto o tal vez cualquier producto que alguien agregue. Entonces nuevamente, agregando una sección más, y aquí en la sección de una sola columna, arrastrándola hasta el pie de página y agregando un encabezado aquí. Vamos a escribir. Vamos a teclear beneficios. Bien. Centralizar los textos que entran en ese va a entrar en la pestaña de estilo, este color. Y esta vez hago clic en este icono desde aquí y selecciono el color de acento. Cambiaremos el color del texto a blanco. Vamos a añadir un poco de relleno. De nuevo en LinkedIn, esto viene de arriba. Desde abajo. Y por debajo de eso, voy a añadir una sección más. Y vamos a duplicar este color para que sea tweet y el globo tweet. Y aquí voy a añadir, al hacer clic en este icono, agregaré un encabezado aquí, manuscrito uno. Y el tercero. Cambiemos de nuevo el estilo, haciendo que los seis sean blancos. La tipografía debe ser mayúscula. Los tamaños de fuente deberían ser un poco pequeños aquí. Y el peso de la fuente necesita ser cierto descanso, ¿verdad? Agregar un elemento más para editor de texto. Y esta vez también cambia el color del texto a blanco. Y se pone genial. Duplicando esto. Duplicar, arrastrando esto por el lado derecho. Lo mismo con este gen unidades para beneficiar al número dos, al número tres. Y tenemos una sesión aquí. Agreguemos un poco de relleno a la parte superior de estas tres columnas. Nuevamente, dessilenciarlos porque configurando dependiendo de la derecha, eso también. Desde Baltimore con el anuncio. Por lo que ahora esta sesión también está lista. Entra y vuelve a duplicar esta sección. Para agregar el último pedazo de información. Aquí escribiré tal vez hidratado la información de la llamada. En la parte inferior se verá porque es un marcador de posición de información ¿verdad? Después de la administración, noté que el pie de página también coincide con la sección superior. Entonces cambiaremos el color de fondo del pie de página y lo emparejaremos con el color de fondo del encabezado. Entonces entraremos y veremos qué será Macron. F9, F9, F9. Y aquí, también voy a cambiar el color de esta foto para agregar en algún relleno. Desvincula esto, y ya está casi listo. Ahora veamos cómo se ve nuestra nueva página. He abierto esta paciente, Anita, y veamos cómo se ve. Hemos completado una bonita landing page. Y luego discutimos que todo el contenido de esta página se puede agregar fácilmente. Entonces para eso solo puedes volver a acudir al editor. Y a medida que construyas la página, puedes simplemente hacer clic, agregarla a cualquiera de los blogs de contenido, y podrás editar cualquier cosa en esta página sin tener ningún conocimiento de programación. Tú en Ben. Sí. Hagámoslo audaz. Icono aquí y haga clic en Actualizar. Y ahora estoy refrescando nuevo esta página para ver cómo se ve. Y si, eso se le ha hecho. Entonces así es como creas UNA página. Y en el siguiente video discutiremos cómo puedes agregar algunos estudiantes geniales y agradables y de emisión invasión de tierras. 10. Cómo agregar ANIMACIONES a la LANDING PAGE: Oye, en este video veremos cómo podemos agregar algunas animaciones geniales y agradables a este sitio web, a la landing page en realidad. Entonces para eso, volveremos a ir al Elementor. Aquí tenemos nuestro editor abierto. Veamos, necesitamos agregar algo de animación a esto, al encabezado. Entonces para eso, iremos a la columna haciendo clic en este icono de columna aquí. Y en la pestaña avanzada, tendrás aquí una pestaña para efectos de movimiento que seleccionen y llenen tu vida. A lo mejor, porque voy a estar agregando animaciones simples aquí. Y vamos a hacer cuatro. Lado derecho. Aquí está viendo que hacer clic en el icono de la columna es un poco difícil porque se esconde detrás de las tres opciones. Entonces Elementor ha creado el navegador para nosotros. Abramos el navegador. Y aquí tenemos algoritmo sencillo donde podemos usar esto para agregar columnas en. Entonces la primera sesión fue ésta. Leamos la segunda columna de esta sección y abriremos los ajustes para que hagamos eso una vez más y los efectos de movimiento. Y vamos a estar agregando libertad, ¿verdad? Lo mismo estaremos haciendo con esta sección aquí, haciendo clic en el icono de columna, efectos avanzados y de movimiento. Y entonces voy a estar agregando tal vez desvanecerse aquí mismo. Al ver que esto va a ser seguir haciendo esto hasta el final. También puedes agregar algunas otras animaciones según tus relámpagos, pero a la vuelta. Pero me gustan las animaciones simples aquí. Entonces voy a estar agregando estos a la tierra y me fui. Y otra vez, bien. Lo mismo con este fenilo, izquierda y derecha. Y aquí voy a añadir tal vez alguna animación diferente. Digamos porque estas son secciones de tres columnas. Voy a estar agregando, encajar tal vez. Sí, se ve bien. Se desvanecen. En cementerios. Estamos a la izquierda y a la derecha. Y por último el pie de página. Quizá agreguemos fade in y mejor. Hay montones y montones de animaciones. Probemos algunos otros. Tal vez puedas probar estos e intentar subir tus proyectos en la sección de abajo, estaré encantado de verlos. Y otras personas que también respondan a tus proyectos. Será, va a ser algo increíble de practicar. Prueba diferentes animaciones y mira cómo sabes cuál te gusta. Voy a estar apegándome a mi animación de fracaso aquí. Bien, así que estoy actualizando este pH después de agregar todas las animaciones aquí. Y entraremos y volveremos a probar nuestro sitio web. Y verás que la animación empieza aquí. Con estas sencillas animaciones. La página se ve un poco más bonita y genial. Y empezará a conseguir atracciones de los clientes y todo eso. Así que hay muchos beneficios diferentes de las animaciones. Puedes probarlo, puedes probarlo y ver cómo funciona para ti. 11. ¿Qué hacer ahora?: Ya que hemos completado nuestro sitio web o página de destino. Entonces es tu turno ahora, vamos a crear algunas páginas de aterrizaje increíbles y tal vez publiquemos capturas de pantalla de un proyecto en la pestaña de proyectos a continuación. Y estaré feliz de verlos y estaremos encantados de brindarles comentarios en consecuencia. Entonces puedes comenzar esperando tu sitio web de WordPress, tal vez en host local o tal vez si tienes un servidor en vivo, puedes crear un sitio web de asientos o tal vez un subdominio temporal. Eso se puede hacer. El pelo. Puedes hacer eso ahí e instalar el equipo de WordPress. El equipo que se utilizará en este caballo fue Hello Elementor. El plug-in que utilizamos fue Elementor. Para que puedas instalar el tema y el plug-in y comenzar a tuitear la página de préstamos. Como ustedes saben. También puedes intentar cambiar algunos colores, cambiar las imágenes, encadenar animaciones, e intentar construir algo diferente, correcto, para practicar las cosas se mueven. Así que gracias por ver este curso. Voy a estar emocionado de ver los proyectos que publicarás. También asegúrate de seguir mi perfil de Skillshare como la publicación de videos más detalles, wordpress. Así que no olvides seguir el perfil de Skillshare. Recibirás todas las actualizaciones que están reportando en este perfil. Gracias. Cuídate. Adiós.