Como te dije en un tutorial anterior, WordPress ofrece un nuevo tema predeterminado. Este tema, diseñado para sitios web corporativos, marca una notable desviación de los temas predeterminados de WordPress que en el pasado fueron diseñados para blogs y refleja la transición más importante de WordPress de una plataforma de blogs a una plataforma versátil.

Si planea probar Twenty Seventeen, comprenderá algo rápidamente: este tema predeterminado de WordPress es diferente de sus predecesores. Los temas predeterminados anteriores imponían una configuración mínima que resultó en un blog funcional. Bueno, ese no es el caso de Twenty Seventeen.

Por supuesto, puedes usarlo como tema de blog, pero te recuerdo que no fue diseñado específicamente para esto. En realidad, fue diseñado para crear sitios web corporativos utilizando una página de inicio con secciones, que puede distinguir fácilmente al ver su demostración.

Descubrir también Cómo instalar un plugin en WordPress

El resultado de este cambio de enfoque es que configurar Twenty Seventeen lleva un poco más de tiempo que los temas de WordPress predeterminados anteriores.

En este tutorial, exploraremos Twenty Seventeen, veremos lo que tiene para ofrecer y lo guiaré a través de la configuración de este tema de WordPress para que pueda crear fácilmente una página de inicio para su sitio web. negocio.

Pero antes, si nunca has instalado WordPress, descubre ¿Cómo instalar un blog de WordPress pasos 7 et ¿Cómo encontrar, instalar y activar un tema de WordPress en tu blog 

Luego de vuelta a por qué estamos aquí.

Resumen de veinte diecisiete

Presentación veinte diecisiete

El uso de un página de destino - Página de destino - servir como página de inicio para sitios web corporativos se ha puesto de moda. Con Twenty Seventeen, es fácil crear una página de destino para un sitio web empresarial.

Para tener una idea de sus posibilidades, eche un vistazo a la demostración oficial del tema de WordPress Diecisiete veinte. De buenas a primeras, notarás el encabezado del video. Desplácese hacia abajo un poco y aparecerá el diseño seccional de la página. Cada sección está separada por una llamativa imagen de fondo de paralaje que ocupa todo el ancho y alto de la ventana.

La navegación es simple con una barra de navegación superior adhesiva y una sola fuente " Franklin libre Que se utiliza en todo el tema.

Le aconsejamos consultar Cómo agregar un menú de navegación personalizado en WordPress

Cuando se configura correctamente, Twenty Seventeen muestra una aspecto profesional moderno, basado en selecciones de fuentes legibles y un fuerte uso de imágenes llamativas equilibradas por el uso de espacios en blanco generosos.

¿Cómo crear una página de inicio con Twenty Seventeen?

Yendo en la misma dirección que Matt Mullenweg, cuando habló de la importancia del personalizador, por lo que no es sorprendente que la mayoría de las tareas realizadas en " Diecisiete veinte Están en el personalizador.

Personalización de Wordpress 47

Además de las funciones estándar como el menú y la configuración, con los widgets del Personalizador puede definir una imagen de encabezado o un video, usar diferentes esquemas de color y afectar el contenido de las secciones de su página.

Descubrir también Cómo personalizar el CSS de tu sitio web de WordPress

WordPress 4.7 también introduce una nueva función llamada "atajo de edición visible": aparecen como iconos azules como en la imagen anterior. Al hacer clic en uno de estos accesos directos, se abrirá el campo que le permitirá modificar la sección en el Personalizador. 

Esto hace que sea bastante fácil cambiar las características de Twenty Seventeen como la imagen del encabezado, el eslogan y el título y el contenido que aparece en cada sección de una página. Solo tiene que encontrar el contenido que desea editar, luego hacer clic en el "acceso directo de edición visible" y personalizar el contenido en cuestión.

Ve más allá descubriendo Cómo agregar desplazamiento infinito a un blog de WordPress

WordPress también viene con una nueva función de Personalizador llamada " CSS adicional ". Ya hemos hablado sobre esta característica antes. Esta es una característica específica de WordPress y no " Diecisiete veinte ".

Para mostrarle cómo configurar Diecisiete veinte »Instalaré el tema como si lo usara para mi sitio web personal.

Paso uno: crea una página para cada sección

Crea una página para cada sección

Lo primero que debe hacer es crear algunas páginas:

  • Crea una página que será tu página de inicio estática.
  • Cree una página que muestre publicaciones de blog.

Cómo poner su sitio web de WordPress en modo de mantenimiento ? haga clic en este enlace

Cree hasta cuatro páginas adicionales para contener el contenido que se mostrará en las secciones de la página de inicio. Crea tres nuevas páginas adicionales si planeas usar tu blog o como una de las secciones de la página de inicio.

consultar Cómo hacer columnas en WordPress sin complementos

En el caso de mi ejemplo, creé una página de inicio, una página de blog, una página acerca de, una página de servicios y la página de contacto.

Paso 2: agregue una imagen a la página principal

Para obtener el efecto de paralaje en las imágenes, debe agregar una imagen de portada grande para cada página, que será parte de las secciones de la primera página. Probablemente no desee agregar una imagen destacada a la página de inicio que creó en el paso anterior, pero puede agregar una imagen destacada a todas las demás páginas.

Imagen destacada wordpress

La demo de « Diecisiete veinte Utiliza imágenes cuyas dimensiones son 2000 píxeles de ancho por 1200 píxeles de alto. Se recomiendan imágenes que se acerquen a estos tamaños. Entiende que no debe usar imágenes pequeñas.

Descubra los Complementos de 5 WordPress Page Builder - generador de páginas

Encontrará muchas imágenes gratuitas en " StockSnap Y la mayoría tiene buenas dimensiones.

Paso 3: Asignar páginas de inicio y página de blog

Página de inicio de wordpress estático

Ahora es el momento de comenzar a personalizar. Inicie el Personalizador, luego vaya a "  Apariencia> Personalizar En el tablero de instrumentos.

Seleccione la opcion página de inicio estática Y haga los siguientes ajustes:

  • Configure lo que muestra la página de inicio, seleccione el botón de opción para una página estática.
  • En el menú de la página de inicio, seleccione la página de inicio del sitio web.
  • En el menú Página de elementos, seleccione la página que mostrará los artículos.

No olvides guardar tus cambios.

Paso 4: asigne las otras páginas a las secciones de la página de inicio

Veinte diecisiete sección temática

Ahora puede asignar las diferentes páginas que ha creado previamente a las secciones en " Opciones de tema ". Use los menús desplegables para asignar cada página a cada sección de acuerdo con la relevancia que les asigne.

Paso 5: crea tu menú de navegación principal

Puede crear su menú de navegación directamente desde la interfaz del Personalizador o desde su panel de control. En ambos casos, la creación de los menús en WordPress no ha cambiado.

Paso 6: agrega un encabezado de video

Veinte diecisiete vídeos de cabecera

A continuación, reemplazaremos la imagen del encabezado con un video. Vaya a la sección correspondiente en el Personalizador haciendo clic en el "Acceso directo de edición visible" o busque " Encabezado de medios ".

Descarga o selecciona el video que deseas usar. Alternativamente, también puede proporcionar la URL de un video de YouTube para mostrar en el encabezado si lo desea.

Nuevamente, asegúrate, para necesidades de calidad, de elegir un video con grandes dimensiones.

Veinte diecisiete demostración

En este punto, todo debería funcionar normalmente. Más adelante le ofreceremos más tutoriales sobre la personalización de este nuevo tema de WordPress.

Descubre también algunos complementos premium de WordPress  

Puede usar otros complementos de WordPress para darle un aspecto moderno y optimizar el agarre de su blog o sitio web.

Aquí le ofrecemos algunos complementos premium de WordPress que lo ayudarán a hacerlo.

1. Mesa de restaurante WordPress reserva

Restaurant Table Booking Manager es un complemento que le permite administrar la reserva de las mesas de su restaurante en línea.

Reserva de mesa de restaurante Wordpress

Da la oportunidad a sus clientes leales de reservar una mesa directamente desde su blog de WordPress. Ofrece herramientas de gestión de disponibilidad, que le impedirán cometer errores.

También puede usar el calendario generado automáticamente para realizar un mejor seguimiento de las diferentes reservas.

Descargar | Demo | alojamiento web

2. ShareBang

ShareBang es un revolucionario plugin de WordPress para compartir en redes sociales. Ofrece una experiencia completa y elegante que lo ayudará a aumentar el tráfico y mejorar las ventas y la visibilidad de sus productos, páginas y blog.

Sharebang ultimate social share botones para wordpress 1

Es compatible con + 42 de las principales redes sociales, incluidas las aplicaciones móviles, como WhatsApp, Facebook, Telegram, Skype, Line, Viber y más. Viene con más de 21 posiciones dedicadas a botones para compartir en redes sociales, un diseño totalmente personalizable, actualizaciones automáticas y periódicas, integración con Mailchimp, Mailster y más ...

Todas las funciones anteriores y muchas más son extremadamente fáciles de usar, por último, para ayudarlo a obtener más suscriptores y generar más tráfico. Simplemente únase a la próxima generación de complementos de botón para compartir en redes sociales.

Descargar | Demo | alojamiento web

3. Octabook

Octabook es un complemento de WordPress muy fácil de usar y una herramienta de reserva de citas instantánea para casi todos los tipos de servicios y proveedores de servicios que desean ofrecer. Reservas en línea de un sitio web.Octabook

Ofrece varias características que incluyen: soporte para localización múltiple, configuración de servicio, fijación dinámica de precios, notificaciones, soporte de campos personalizables para formularios, personalización de apariencia, Soporte de Google Calendar, el panel intuitivo, la exportación de datos en formato csv y mucho más.

Descargar | Demo | alojamiento web

Recursos recomendados

Conozca otros recursos recomendados para ayudarlo a construir y administrar su sitio web.

Conclusión

Listo ! Eso es todo por este tutorial. Esperamos que te ayude crear una tienda en línea privado. No dude en comparte con tus amigos en tus redes sociales favoritas

Sin embargo, también podrá consultar nuestra Recursos, si necesita más elementos para llevar a cabo sus proyectos de creación de sitios de Internet, consulte nuestra guía sobre Creación de blog de WordPress.

Si tienes sugerencias o comentarios, déjalos en nuestra sección comentarios.

...