Modificaciones en Twenty Sixteen

Finalmente, me he puesto en serio y estoy comenzando a hacer algunas modificaciones en la plantilla Twenty Sixteen de WordPress.

En vez de modificar el PHP como explicaba en este post, en esta ocasión simplemente he añadido nuevo código al archivo de CSS personalizado (Aparencia>Editar CSS).

/*
Quitar blancos en la cabecera - Albert Sampietro 18-09-2019
*/
masthead {
padding-top: 10px;
padding-bottom: 50px;
}

/*
Quitar columna izquierda de metadata y ponerla al final del post - Albert Sampietro 18-09-2019
*/
@media screen and (min-width: 61.5625em) {
body:not(.search-results) article:not(.type-page) .entry-footer
{
float: none;
margin-top: 1.5em;
width: 100%;
}
.single .byline, .full-size-link,
body.group-blog:not(.search-results) .byline,
body:not(.search-results) .entry-format,
body:not(.search-results) .cat-links,
body:not(.search-results) .tags-links,
body:not(.search-results) article:not(.sticky) .posted-on,
body:not(.search-results) article:not(.type-page) .comments-link,
body:not(.search-results) article:not(.type-page) .entry-footer .edit-link
{
display: inline;
}
body:not(.search-results) article:not(.type-page) .entry-footer > span:not(:last-child):after
{
display: inline;
}
body:not(.search-results) article:not(.type-page) .entry-content
{
float: none;
width: 100%;
}
body:not(.search-results) article:not(.type-page) .entry-footer .avatar
{
display: inline;
margin: auto 0.3em 1em auto;
width: 27px;
}}

Los dos cambios que he insertado son la eliminación de blancos antes y después del título del blog y mover la información de metadata (autor, fecha, comentarios,…) de la columna izquierda del post al final.

Google Sheets en WordPress

Por fin he cambiado el sistema de publicación del listado y estadísticas de países visitados, carreras disputadas y libros leídos de mi blog personal que hasta este momento eran texto plano editado a mano.

He traspasado todos los datos en forma tabulada a Google Sheets y de ahí he generado con la opción «Publish to the web» el código embebido que he pegado en la página de wordpress.

La diferencia entre el código que ofrece Google y lo que últimamente he publicado es básicamente este conjunto de atributos: Width y Heigth para definir el tamaño del iframe y Frameborder para quitar el borde que viene por defecto. En este caso, además, he modificado el atributo Range que no pertenece al iframe sino al código que genera Google Sheets.

<figure><figure><figure><iframe src="https://docs.google.com/spreadsheets/d/e/2PACX-1vQhJB-4sS4wAbWYxRn6e1qrAxshUUWyUF8jeMwdsbKzi8sRlyhcblJNTHDggyGxLI6O65UdK4jy8gC4b7/pubhtml?gid=237186781&single=true&widget=true&headers=false&range=A1:E500" width="1000" height="8000" frameborder=0></iframe></figure></figure></figure>

Al final, este ha sido el código que he insertado como HTML en la entrada de WordPress y que nos da mucha más flexibilidad que la normal función de tablas o de texto formateado que viene estándar con la plataforma.

SSL en WordPress

Por fin me he decidido a poner un certificado SSL en mi blog personal y que deje de salir el desagradable «No es seguro» en Chrome junto a la URL.

La tarea ha sido bastante sencilla y ha sido suficiente con instalar un certificado, en mi caso el de PositiveSSL y después descargar y activar el plugin Really Simple SSL. Y ya está: automáticamente ahora la URL cambia a HTTPS desde HTTP.

¿Cuándo navega la gente por Internet?

En Gadgets para Correr tengo un par de miles de visitas al día y gracias a Google Analytics resulta bastante fácil extraer patrones de navegación. Para los usuarios en España estas son las principales características:

  1. Los usuarios navegan principalmente desde el trabajo. Los días festivos o fines de semana hay una fuerte caída de tráfico.
  2. Las horas puntas son alrededor de las 11h-12h, una vez llevas ya un buen rato trabajando y después, alrededor de las 15h cuando llegas de comer.
  3. Fuera de las bandas anteriores, también hay un pico importante entre las 21h y las 23h pero no llega a igualar el tráfico total que existe de 9h a 18h.

Es interesante observar como durante agosto, mucha gente continua utilizando Internet desde el trabajo pero con mucha más intensidad, especialmente en días señalados como el 13 y 14 de agosto (el 15, festivo, no hay casi tráfico). Imagino que no debe haber mucho trabajo durante esos días y se navega más.

Sería interesante comparar estos hábitos en España con los existentes en otros países para calcular el % de tiempo que pasamos «navegando» en horas de trabajo.

Como traducir una plantilla de WordPress

En la galería de plantillas de WordPress hay miles de opciones pero muy pocas tienen soporte para español. Sin embargo, crear nuestro propio fichero de traducciones es muy sencillo:

  1. Descárgate el archivo «NOMBRE_DE_PLANTILLA.POT» en el directorio de idiomas de la plantilla que nos hayamos descargado (normalmente en «wp-contents>themes>NOMBRE_DE_PLANTILLA>languages>»).
  2. Necesitaremos una aplicación de traducción que nos instalaremos en nuestro ordenador local: Poedit.
  3. Abrimos con el Poedit el archivo .POT y creamos un nuevo archivo para español. Automáticamente se creará un archivo «es_ES.po».
  4. Tenemos ahora que traducir con Poedit todas las frases que aparecen en la aplicación o las que creamos que vamos a utilizar.
  5. Una vez que hayamos terminado tenemos que generar el archivo «es_ES.mo» yendo a «Archivo>Compilar en MO…» en el menú superior.
  6. Esto nos generará el archivo compilado MO que ya podremos subir de nuevo al directorio «wp-contents>themes>NOMBRE_DE_PLANTILLA>languages>».
  7. Por último solo queda activar el nuevo idioma yendo al menú de WordPress en «Ajustes>Generales» y seleccionar el idioma Español.

Y listo. Nuesto blog ya estará en español.

Quitar blancos en Style Outlet

Me estoy preparando para volver con Gadgets para Correr y la primera tarea que me he planteado es la de cambiar la plantilla de WordPress. Después de mucho buscar la elegida ha sido Style Outlet por varias razones (buscador, sencillez, posts completos en página principal y sidebar claro) aunque había algo que no me gustaba: demasiado espacio en blanco entre el header y el título del post en la home page.

Después de volverme loco intentado reducirlos, con la ayuda de Laura lo he conseguido finalmente.

Básicamente hay que modificar el «Style.css» yendo dentro de WordPress a Appearance>Editor y pulsando sobre el theme file «Stylesheet» en el menú de la derecha, buscar una línea donde pone «.home.blog .site-content {» y cambiar el valor de «padding-top: 100px;}» para poner la cantidad exacta de blancos que queramos. En mi caso lo he dejado a 10px.

Archivo CSS de Style Outlet
Archivo CSS de Style Outlet

De esta forma, las dos líneas de código CSS quedan así:

.home.blog .site-content {
padding-top: 10px;}

Solo nos falta pues guardar el archivo pulsando sobre el botón azul «Update file» y ya está listo.

Enviar audio y video a Chromecast

Imagina que necesitas reproducir un DVD que tienes en tu PC directamente en la televisión ,a través de Chromecast, o enviar un archivo de vídeo local o simplemente compartir el escritorio de tu ordenador.

Después de buscar por Internet, la solución es mucho más sencilla que la mayoría de resultados que puedes encontrar en Google. Estas son las instrucciones:

  1. Abre Chrome en el el ordenador.
  2. Pulsa sobre el icono de Chromecast en la parte superior derecha de la pantalla.
  3. Se abrirá un pequeño cuadro de diálogo azul.
  4. Pulsamos en «Enviar a» y pulsamos sobre «Enviar escritorio».
  5. Finalmente, seleccionamos el Chromecast al que enviaremos y ya está.

Cuadro de diálogo de Chromecast
Cuadro de diálogo de Chromecast

Es una buena solución, también, para ver fotografías que guardamos en el ordenador, directamente en el televisor.

Geocaching

Ayer por la noche, después de cenar, decidimos ir de caza en busca de algún caché por la zona de la Sagrada Familia… y lo encontramos. Concretamente fue el GC52N0E.

GC52N0E
GC52N0E

Para ir en busca de cachés o geocachés es necesario que te des de alta en Geocaching.com (puedes cambiar el idioma de la página al final de esta) y que te descargues en tu teléfono alguna de las aplicaciones de localización como por ejemplo c:geo (es la que utilizo yo en Android).