Cómo personalizar el tema WordPress GRATIS Veinte diecisiete

Veinte diecisiete fueron entregados como el nuevo WordPress 4.7 predeterminado. Este tema orientado al negocio marca una eliminación digna de los temas implícitos centrados en el pasado y refleja la transición más amplia de WordPress de una plataforma de blogs a una plataforma adecuada para todo tipo de sitios web. Si tiene la intención de probar veinte diecisiete, se dará cuenta rápidamente de algo: este tema no se parece a sus predecesores en absoluto. Los temas implícitos anteriores solo requirieron una configuración mínima y fueron diseñados para ser temas de blog funcionales inmediatamente desde el cuadro. Este no es el caso con veinte diecisiete.
Claro, puede usarlo como un tema de blogs, pero no fue diseñado o destinado a eso. Está realmente diseñado para crear sitios web de negocios utilizando una página inicial al estilo de una página de destino basada en secciones, que puede discernir rápidamente analizando el sitio web oficial de demostración. El resultado de este cambio de enfoque es que la configuración de veinte diecisiete requiere algo más que los temas predeterminados anteriores. En esta publicación, exploraremos veinte diecisiete, ver qué ofrecer y guiarlo configurando el tema, para que pueda configurar una página de negocios profesional con veinte diecisiete.
Te presentamos veinte diecisiete

El tema implícito de WordPress veintiete años.
El uso de una página de destino para servir como página inicial para sitios web de negocios ha tomado la web con fuerza. Y veinte diecisiete facilitan la construcción de una página de destino atractiva para negocios con WordPress predeterminado. Para comprender las posibilidades, eche un vistazo a la demostración oficial de veinte diecisiete. Inmediatamente notará el encabezado de video. Desplácese un poco hacia abajo y el diseño seccional de la página se volverá obvio. Cada sección está separada de una increíble imagen de fondo de paralaje que ocupa todo el ancho y la altura de la ventana de observación. El nacimiento se simplifica con una barra de navegación superior. Y una sola fuente, Libre Franklin, se usa a lo largo del tema en una variedad de pesos, brillo y estilos. Una vez configurado correctamente, veinte diecisiete presenta un profesional moderno, basado en selecciones de fuentes que también se pueden leer sobre el fuerte uso de elementos visuales llamativos mediante el uso generoso del espacio en blanco. Cómo crear secciones de página iniciales en veinte diecisiete teniendo en cuenta cuánto acento tiene Matt Mullenweg en Customizer en la historia reciente, no será sorprendente que gran parte de veinte diecisiete trabajos de configuración tenga lugar en Customizer.
Un vistazo a las opciones de menú disponibles en Customizer con veinte diecisiete WordPress.

Además de las características estándar, como la configuración del menú y el widget, desde la personalización, puede configurar una imagen de encabezado o un video, puede cambiar a un esquema de color diferente y puede atribuir contenido a las secciones de la primera página. WordPress 4.7 también presenta una nueva característica llamada Visible Short Editing Commands: aparecen como iconos azules en la imagen de arriba. Al hacer clic en cualquiera de estos atajos, se abrirá el menú de personalización, donde esa parte del sitio se puede personalizar. Esto facilita la edición de muchas de las características en veinte diecisiete, como la imagen del encabezado, el sitio del eslogan- al título y el título y el contenido que aparece en cada sección de página. Encuentre el contenido que desea editar, haga clic en el orden de edición visible y personalice de acuerdo con el contenido de su corazón. WordPress 4.7 también se entrega con una nueva función de personalización, que encontrará en la opción de menú de personalización CSS adicional. Hemos escrito sobre la nueva función CSS adicional, por lo que lo mencionamos nuevamente aquí y enfatizamos que es una característica básica y no una característica específica veinte diecisiete.
Para demostrar cómo se configuran veinte diecisiete, configuraré el tema como si lo usara para mi sitio personal. Movemos directamente a eso. Paso 1: Cree una página para cada sección de página inicial
Cree las páginas que desea mostrar en las secciones de la primera página.
Lo primero que debe hacer es crear algunas páginas:

Cree una página para servir como una página de inicio estática.
Cree una página para servir como un blog o página de publicación. Cree hasta cuatro páginas adicionales para contener el contenido que se mostrará en su página inicial; haga tres páginas adicionales si tiene la intención de usar el blog o la página de publicación como una entre las secciones de la página inicial.
En el caso de mi sitio de ejemplo, creé una página inicial, una página de blog, una página sobre una página de servicio y una página de contacto.
Paso 2: Agregue una imagen recomendada a cada página para obtener el efecto de imagen Paralax, debe agregar una imagen grande presentada a cada página que formará parte de las secciones de la primera página. Probablemente no quiera agregar una imagen presentada en la página de inicio que creó en el paso anterior, pero querrá agregar una imagen presentada en cualquier otra página.
Establezca una imagen recomendada para cada página.
La demostración de veinte diecisiete usa 2000 píxeles de ancho y 1200 píxeles de alto. Las imágenes que están cerca de este tamaño funcionan muy bien. No use imágenes pequeñas o los resultados serán muy débiles.
En mi caso, obtuve imágenes gratuitas de Stocksnap y las cambié a todas al ancho de 2000 píxeles y a unos 1200 píxeles, 10 por ciento. Paso 3: Asigne una página principal estática y una página de publicación

Seleccione la opción para mostrar una página principal estática.
Ahora es el momento de comenzar la personalización. Inicie el personalizador: vaya a la apariencia> Personalización en el área de administración o haga clic en Personalizar en la barra de administración al ver la interfaz del sitio. Seleccione el elemento del menú estático de la página principal y haga los siguientes ajustes de configuración: en la pantalla de la página principal, seleccione el botón de radio para una página estática.
En el menú desplegable previo a la página, seleccione la página de inicio de su sitio.

En el menú Drop -down de la página Publicaciones, seleccione las publicaciones o la página de blog.
No olvide presionar guardar y publicar y luego pasar al siguiente paso. Paso 4: Asigne páginas a cada sección de la primera página para asignar las diversas páginas que ha creado previamente en las secciones de la primera página, seleccione las opciones del elemento del menú desde el personalizador. Luego use menús desplegables para asignar cada página a la sección relevante de la primera página donde desea aparecer.
Paso 5: Cree el menú de navegación principal, puede crear su menú de navegación, ya sea seleccionando las opciones de menú en el menú personalizado o accediendo a la apariencia>
Menús en el área de administración. Bajo ninguna circunstancia, crear menús de WordPress no ha cambiado en WordPress 4.7, así que cree un menú exactamente como lo hizo en el pasado y asignarlo a la ubicación del menú superior. Paso 6: Agregue un encabezado de video luego, reemplace ese encabezado Ho-Hum con un video. Acceda a la sección relevante de la aduana haciendo clic en el pedido de edición visible apropiado o la ubicación del elemento del menú de medios de encabezado. Cargue o seleccione el video que desea usar. Alternativamente, también puede proporcionar la URL de un video de YouTube que se mostrará en el encabezado, si lo desea. Si sube un video, tenga en cuenta que las instrucciones del tema recomiendan un video de 2000 en 1200 píxeles. He seleccionado un video gratuito para usar para mi sitio. En 1920 en 1080 píxeles, ni siquiera estaba en las dimensiones recomendadas, pero aún se ve bonita. ¡En este momento, su página de inicio estática con secciones en la primera página está completa! Crédito adicional: crear una navegación dinámica en la página Una característica que está particularmente ausente de veinte diecisiete es el soporte construido para navegar por las secciones de la primera página. Ciertamente estaría bien si su navegación lo llevara directamente a las secciones relevantes de la página inicial. Afortunadamente, esta es una omisión que podemos remediar rápidamente. Lo primero que debe hacer es crear un menú para enviar a los atributos de identificación y no a diferentes páginas de su sitio. Para hacer esto, cree enlaces de menú personalizados que se vean así: cree enlaces de menú personalizados usando IDS.
Al crear IDS, simplemente use los títulos de página de cada página que se muestran como una sección de primera página, pero convierta el título en minúsculas y reemplace cualquier espacio con guiones. Si ha instalado WordPress en un subdirector, una práctica común para los sitios desarrollados en un entorno de desarrollo local, deberá incluir el subdirector en su enlace, por ejemplo, para este proyecto, la URL del desarrollo de mi sitio es http: // Localhost/WP4Point7. Esto significa que WordPress está instalado en un subdirector: …/WP4Point7. Para que los enlaces funcionen correctamente, debo incluir el Director UNSE en la URL de la siguiente manera: /WP4Point7 /#Acerca de. Si no trabaja con una instalación de Undertower, puede omitir el subdirector y usar la estructura presentada en la imagen de arriba. Con la navegación a su lugar, debe agregar ID a cada sección de la primera página. Puedes hacer esto de una de dos maneras. La solución más simple es agregar las ID directamente a los títulos de la página utilizando el editor de páginas de WordPress.
Observe que para agregar la identificación envié el título en un elemento de tramo.La identificación en sí es solo el título de la página minúscula, con cualquier espacio de título reemplazado por guiones, esto significa que las IDS coincidirán con los ID que hemos agregado a los enlaces del menú de navegación personalizados.Además, agregué un atributo de estilo y 96 píxeles de relleno superior.Al hacer clic en los enlaces, este valor de finalización empuja el contenido hacia abajo para que se pueda ver debajo de la barra de navegación pegajosa.Para ser honesto, este enfoque es un poco de hack y realmente no me importa.Lo que preferiría es agregar el elemento SPAN, ID y relleno usando JQuey.De esta manera, no arruino los títulos de las páginas en el editor, pero aún así obtengo el mismo resultado final.Aquí hay un pequeño código con el que vine, que produce los resultados deseados: el esencial JPEN365/1FE6F1942945696F2C1DB88DCDE6B812 se carga

Lo que hace ese código es localizar el título de cada sección y luego envolver el título en un intervalo con el estilo necesario. Además, el código crea un valor de identificación al hacerse cargo del título de la sección, su conversión en minúsculas y luego reemplazar espacios con guiones. Entonces, si tuviera una sección con el título de mi blog (como en la imagen de arriba), este código agregaría el siguiente atributo id = ‘my-blog’: id = ‘my-blog’. Este formato de identificación coincide con la misma sintaxis que recomendé para sus enlaces de menú de navegación personalizados. Para cargar ese código en su sitio, puede agregarlo a uno de los dos lugares diferentes: un archivo JavaScript que forma parte de un segundo veinte diecisiete o complementos que cobra JavaScript personalizado. Personalmente, fui en el segundo camino y utilicé el complemento personalizado CSS y JavaScript descritos en el artículo cómo transformar cualquier modificación del tema de WordPress en un complemento simple. Sin embargo, puede usar tan fácilmente un complemento como CSS y JS personalizados simples para agregar jQuey. Con la jQuery cargada y el nuevo menú de navegación creado, así es como ahora funciona la navegación principal de mi sitio. Ahora, veinte diecisiete está configurado como una página de destino, y la navegación principal funciona como una página de navegación entre las secciones de la página inicial. Si desea llevar las cosas algunos pasos más allá, puede considerar las siguientes mejoras adicionales:
Agregue redireccionamientos, por lo que cualquiera que llegue a una de las páginas que se muestren como secciones de página de inicio se redirigirá a la sección relevante en la página inicial. Por ejemplo, redirige la página http://example.com/contact a la sección en la primera página http://example.com/#contact. Si ha optado por usar jQuery para activar la navegación entre las secciones de la página principal, Use etiquetas acondicionadas para cargar el código solo en la página inicial.

Si su sitio incluirá páginas adicionales que no son secciones de la página de inicio, agrégalas al menú de navegación y coloque todos los enlaces de las secciones de la primera página en un menú desplegable, como se muestra en la imagen a continuación.
Agregue los enlaces del panel a un menú desplegable si desea crear otras páginas con el menú de navegación.

Conclusión Veinte diecisiete señales Una nueva generación de temas de WordPress, al menos en términos de temas predeterminados. Está claro que los desarrolladores de WordPress detrás de veinte diecisiete se han comprometido a empujar a WordPress más lejos de sus raíces de blogs en el mundo de los sitios comerciales y comerciales electrónicos. Veinte diecisiete ofrecen un diseño hermoso y moderno basado en la portada. Sin embargo, la configuración requiere un esfuerzo mayor de lo que solicitaron los temas estándar anteriores. Como ha visto en esta publicación, el esfuerzo vale la pena y el resultado es un sitio web comercial mucho más profesional y atractivo, que los temas implícitos anteriores soñarían con crear.
¿Qué opinas sobre el nuevo WordPress predeterminado, veinte diecisiete? ¡Háganos saber en la sección de comentarios!
Etiquetas:
VeinticeissevedEenwordPress 4.7