WordPress 4.7 llegó y tenemos el nuevo tema Twenty Seventeen , es el primer theme por defecto que no está enfocado a un blog, sino a un negocio. En este artículo aprenderás cómo configurarlo de manera sencilla y personalizarlo a tu gusto.
1- Generalidades
Luego de actualizar WordPress, al menos a la versión 4.7, puedes observar el nuevo tema en el menú de Apariencia > Temas.
Si activas el tema y luego ingresas en personalizar lo primero que notarás son unos íconos para editar diferentes secciones del sitio, estos iconos de edición son en realidad accesos directos a las opciones de configuración de la izquierda, esto es propio de la nueva versión de WordPress.
Por ejemplo si quieres cambiar el nombre del sitio con el ícono de edición, te dirigirá a la opción de Identidad del Sitio.
2- Personalizar Colores
Si ingresas a la opción de colores verás que puedes cambiar el aspecto del theme, Claro y Oscuro, sin embargo hay una opción de color personalizado para definir el color del link, esta última opción funciona actualmente sólo con la apariencia clara.
3- Cabeceras Multimedia
El tema Twenty Seventeen tiene un área para colocar contenido multimedia, tienes las siguientes opciones
- Una imagen estática, se mostrará en todo el ancho de pantalla en la página de inicio, en otras páginas se muestra sólo una parte.
- Imágenes aleatorias, similar a la opción anterior, pero en este caso debes subir más de una imagen y además marcar el botón de Cabeceras subidas al azar.
- Video de Cabecera, esa es una de las opciones más interesantes, se mostrará un video de fondo, te recomiendo usar videos en bucle para fondos, puedes subir tu propio video o usar videos de YouTube.
4- Opciones de Menús
El tema cuenta con dos ubicaciones de menú y dos menús creados por defecto para cada ubicación.
Menú Principal: Es el menú que aparece en la parte superior, debajo de la imagen de cabecera definida anteriormente.
Menú de enlaces Redes Sociales: Las redes sociales que aparecen en la parte inferior son definidas a través de ítems de menú, tal como se aprecia en la siguiente imagen.
Te preguntarás entonces, ¿Cómo aparece el ícono de redes sociales cuando creo el ítem de menú?
La plantilla tiene una funcionalidad que permite detectar el dominio de la url del ítem de menú, por ejemplo si en el ítem de menú colocas youtube.com, entonces aparecerá mágicamente el ícono de YouTube, esta funcionalidad se define en el archivo \wp-content\themes\twentyseventeen\inc\icon-functions.php.
5- Opciones de Widgets
El theme viene con tres posiciones para Widgets, Tal como se ve en la imagen adjunta:
- Barra Lateral: Sólo se muestra cuando estamos en la opción del ítem de menú blog.
- Pie 1 y Pie 2: Se muestra siempre y se muestran como columnas en la parte inferior, una al lado de la otra.
6- Opción de Portada Estática
Aquí podemos definir si en el inicio del tema se mostrará las últimas entradas del blog o se mostrará, como viene por defecto, la página de inicio como página estática, te recomiendo dejar esta última opción que tiene mejor diseño.
En esta pantalla se define la página de inicio y una página de blog, ambas deben tener una imagen destacada.
En esta pantalla hay una novedad a partir de WordPress 4.7, se añaden unos links para crear una página directamente desde esta pantalla.
7- Opciones del Tema
Y ya casi para finalizar tenemos las opciones del tema, en esta parte se define:
Diseño de página: para mostrar el título de la página y el contenido en columnas, o dejarlo por defecto todo en una columna.
Contenido de las secciones: Define qué páginas se mostrarán en el inicio y en qué orden, y claro cada una de ellas con su imagen destacada. Recuerda que la imagen destacada se asigna desde la edición de la página.
8- Opción de CSS Adicional
Finalmente llegamos a una de las opciones más flexibles y novedosas del tema, es como decir, si todo lo demás falla prueba esto, evidentemente para usar esta opción hay que conocer algo de CSS, te recomiendo el artículo Usar Firebug para modificar un Theme, en donde se usa CSS para las modificaciones.
Con esta opción tus modificaciones permanecerán a salvo en caso actualices tu tema y te puedes ahorrar incluso hacer un child theme.
9- Cambiar link Creado con WordPress
Como bonus, verás que el tema tiene un link de «Creado con WordPress» en el footer, puedes cambiar este enlace en el siguiente archivo:
wp-content/themes/twentyseventeen/template-parts/footer/site-info.php
También puedes revisar el artículo Agregar una Nueva Posición de Menú usando Twenty Seventeen, en donde se reemplaza este link de copyright por un menú.
Ver comentarios (91)
La primera duda, veo que muchos dicen que es un tema más para páginas empresariales..es mala idea usarlo entonces como blog? o directamente no es recomendable..o quedaría muy mal hacerlo?..en segundo lugar lo estoy probando justamente para empezar un blog y ver como funciona..a la hora de poner las entradas o los post me doy cuenta que va poniendo las últimas entradas en la página de inicio pero de forma resumida..y lo único que quiero es que se vea una sola entrada o sea la última..pero configuro para que sólo se vea una y no lo hace..será que así viene el tema?..Saludos!!
Hola, no le veo problema en que puedas usar este theme para un blog, con algunas configuraciones podría adecuarse a lo que buscas. Con respecto a mostrar sólo la última entrada, he visto que cambiando en : Ajustes > Lectura > Número máximo de entradas a mostrar en el sitio = 1 , funciona correctamente.
Hola tengo una gran duda. He estado tratando de crear una web en wordpress.com en modo gratuito, es decir www . miweb . wordpress . com me entiendes?, pero a la hora de buscar este tema twenty seventeen, no lo encuentro. Recuerdo q cuando usaba mis versiones de pago, dentro de mi panel luego de actualizar a 4.7 si efectivamente aparecía ese tema como opción, entonces mi duda es: ¿Sólo aparece cuando usamos WordPress de pgo?
Gracias por tu respuesta
Si, es posible que aún no lo tengan disponible, si tienes tu sitio en WordPress.com te limitarán mucho, es mejor que evalúes contratar un servicio de hosting y usar los instaladores de WordPress.org
Hola no me aparece la opción para poner 1 sola columna, alguién más le pasó?
A mi tampoco me aparece si alguien sabe el motivo se lo agradeceré en el alma
Hola Tienes que ir a la opción de Personalización, Portada Estática y cambiar a una página estática, al guardar con eso te aparecerá las Opciones del Theme.
Hola, buenas,
A ver si me puedes echar una mano o decirme qué es lo que tengo que cambiar exactamente.... porque yo ahora mismo estoy un poco perdido,
Lo que quiero es expandir un poco más las entradas y la columna lateral pegarla más a la derecha. Es decir, si por poner un ejemplo el cuadro de las entradas son de 555px pasarlo a 720px; y la columna lateral/menú derecha desplazarlo en esa proporción hacia el lateral para que no quede tan pegado.
En mi web lo hacía antes en tweenty ten y tweenty forteen directamente desde el menú "Editor", y cada vez que actualizaba el tema tenía que ir actualizando de nuevo los cambios y ya que aquí dan la opción del CSS hacerlo desde ahí si es posible, o a las malas desde el editor...
No sé si podrías echarme un cable o darme algo de info,
Muchas gracias!!
Hola
Puedes probar con el siguiente código CSS, cambiando los porcentajes de acuerdo al ancho que deseas:
Buenas de nuevo,
Funciona bien, en tanto cambia los anchos en las entradas, así que genial, pero el problema es que se solapan entre sí la columna central con la lateral. Es decir, mantiene el espaciado en los laterales y lo único que hace es reducir el hueco del centro, ¿se podría para que el margen lateral se redujera en ambas partes y así mantener el espaciado?
Muchas gracias!!
Hola
Has usado 68% y 26%?, date cuenta que según la estructura No debe sumar 100%, el % que falta es el espacio.
Saludos.
Buenas,
Sí, cierto, había usado otros porcentajes sin considerar el espaciado. Pero sigue sin convencerme mucho como queda, porque sigo viendo "pequeño" la columna del texto y si juego a aumentar esta, se me queda pequeña la columna. Entonces, ¿cómo se puede aumentar el tamaño del fondo editable. Es decir, si el 100% se corresponde con 620px dónde puedo cambiar para que sean 860px? Y así tengo más margen para poder jugar con los porcentajes.
Muchas gracias, saludos.
Muchas gracias!!!! Entre los dos me sirve para lo que quiero, :-)
Muchas gracias por lo detalles, buen articulo, sabes porque si colocas url de un vídeo de youtube no se escucha la música?
Muchas gracias, Jhon, por tu post. A ver si puedes ayudarme. Cuando comencé la edición del tema, me equivoqué y trasladé el Menú Redes Sociales al Menú secundario. Ahora no puedo editarlo. ¿Me puedes decir cómo puedo recuperarlo?
Y otra pregunta: Si lo configuro con página estática, ¿puedo hacer que la última página que aparezca sean las últimas entradas del blog?
Muchas gracias anticipadas, Jhon. Feliz día
Como puedo hacer para que la barra de menús me aparezca arriba del todo?
Hola tengo la misma duda que tú! encontraste la solución?