Anime.xml v2.4.21 - Creative update

Anime.xml - Creative update

En esta entrada voy a explicar en profundidad los cambios y mejoras que trae la versión más reciente de la plantilla anime. El nombre de esta actualización es "Creative Update", ya que el objetivo principal era mejorar la personalización de la plantilla.


Árbol de contenido


Mejoras menores

La barra azul que siempre estaba en el header (y que cambiaba de color segun la configuracion) ahora solo se encuentra en el footer. Se agregaron animaciones y se mejoraron las tonalidades de los textos.


También se corrigieron los fallos gráfico que Algunos navegadores (principalmente Chrome) presentaban en las animaciones, lo cual provocaba un un pequeño desenfoque o movimientos extraños de pixeles.


El problema que existía con el menú multinivel en móviles fue corregido, entre otros detalles pequeños.


Spoiler

La capacidad de crear spoilers ahora viene incluido directamente en el core de la plantilla (whale.js), El contenido del spoiler puede ser texto puro o cualquier etiqueta html, lo que les permite incluso crear spoilers con imágenes o videos:


spoiler-creative-update

Widgets por defecto

Los widgets que reestructuraba por defecto para mis plantillas eran: Búsqueda, Perfil y etiquetas. El widget de Perfil queda fuera a partir de ahora, y es reemplazado por el widget "Recomendado".


widget-recomendados

A partir de ahora, todas las plantillas contarán con un diseño independiente para búsqueda, como es el caso de esta actualización para la plantilla Anime:


pagina-busqueda

Búsqueda por etiquetas

Al igual que la sección "Búsqueda", si se realiza por etiquetas también contará con una variación, en donde según la etiqueta buscada, aparecerá destacada en alguna parte, en el caso de la plantilla Anime, reemplaza el título del widget por el de la etiqueta buscada:


pagina-etiquetas

Easy customize

A inicios del 2017 implemente algo que bauticé como "easy customize". Se trata de la capacidad de cambiar el aspecto de la plantilla modificando un solo color, de tal forma que la plantilla se auto-configuraba según el color elegido.


En esta actualización, he habilitado la pestaña "fondo", lo que te permitirá elegir un fondo oficial de blogger y la plantilla se configurará automáticamente con los colores adecuados para los fondos elegido:


fondo-blogger-oficial

Y no solo eso, tambien puedes subir tu propio fondo desde la misma herramienta y configurarlo a tu gusto, así mismo, puedes elegir entre una gama de configuraciones de colores distintos:


fondo-blogger

Absolute customizer

Absolute customizer no solo te permitirá cambiar cada color existente en la plantilla, sino que también su Layout, la plantilla tomará tus cambios y los asimilará en todas sus versiones (pc, landscape, tablet, móvil, etc), todo esto sin tocar código, aquí algunos ejemplos de lo que serás capaz de hacer en cuestión de minutos:



Sistema de comentarios

Anteriormente, cuando cambiabas el sistema de comentarios, ya sea por disqus o facebook, el contador quedaba en "0" siempre, desde ahora esto está corregido. Dependiendo del sistema elegido, el contador empieza a contar los comentarios de cualquiera de los 3 sistemas disponibles.


numero-comentarios

Reacciones new

Ahora se pueden activar las reacciones nativas de Blogger, anteriormente siempre lo pase por alto, debido al casi nulo nivel de personalización que tienen, ya que se trata de un iframe, pero de todas formas ahora estará disponible.


reacciones

Módulos de skins

Para aumentar aun más la personalización, la plantilla ahora integra la posibilidad de cambiar entre distintos skins, ya sea para las entradas o para los comentarios. Respecto a los skins, cada plantilla tendrá su propio estilo de comentarios y alguna variaciones en el diseño de la entrada, por ejemplo, este es el skin de los comentarios en la plantilla anime:


comentarios skins anime

Dentro de la plantilla encontraras el archivo threadedComments.anime.css, pues bien, si cambias "anime" por "default", el resultado será el siguiente:


skins default comments

En cuanto a la cantidad de skins, existe uno por cada plantilla que he diseñado, de esa forma, si tienes la plantilla Anime pero te gustan los comentarios de Leyre, podrás cambiarlo de la misma forma, y no solo eso, cada skin tiene su versión oscura, para ello solo necesitas agregar "-dark" a cualquier skin, esto será explicado a profundidad en un video.


Optimizacion

Con todo lo que incluye esta actualización, es normal pensar que ahora la plantilla es más pesada y tiene mas codigo, pero aunque cueste creerlo, esta version es mas liviana y mas rapida que la actual, gracias a que ahora renderiza menos código. La organización también es mejor, ya que en lugar de repetir codigo, lo he vuelto reutilizable.


pagespeed

Esta tan bien optimizada, que incluso puede competir con un diseño AMP, logrando un tiempo de carga récord, en dispositivos con velocidad 3G, tal y como se puede apreciar en el resultado del test que deje en el video de presentación.


test 3g

Nuevos post relacionados

Los post relacionados que se usaban anteriormente pertenecían al blog emiliocobos.net, el cual a su vez, se trataba de una mejora de los originales compartidos por vagabundia. Son muy buenas opciones, sin embargo requieren de múltiples consultas, concretamente 1 por cada etiqueta lo cual si deseamos un mayor rendimiento, es lo que debemos evitar.


Ahora la plantilla utilizará un nuevo sistema de post relacionados, desarrollado en zkreations, programado desde cero por mi amigo y miembro del staff José Gregorio Materán. Estos nuevos post relacionados requieren de una única consulta, y parte del código se extrae de los datos de blogger directamente, convirtiéndolos en los mejores post relacionados para blogger.


Estos post relacionados serán también explicados y compartidos en un nuevo aporte publicado aquí zkreations, sin duda alguna, será un aporte más de nuestra parte para toda la comunidad de Blogger.


Avisos

La plantilla mostrará avisos si algún elemento no funciona correctamente debido la falta de configuración, por ejemplo, los post relacionados necesitan que el blog sea público, si el blog esta en privado aparecerá el siguiente mensaje:


aviso blog privado

Otro elemento necesario para que los post relacionados puedan ser extraídos son las etiquetas, por lo tanto, si una entrada carece de etiquetas, la plantilla mostrará el siguiente mensaje:


aviso entrada sin etiquetas

He tomado como ejemplo los post relacionados, pero la plantilla tiene más mensajes, que brindan información acerca de la causa o problema por el cual el elemento no se muestra, con el fin de facilitar la solución de problemas.


Skins

Las plantillas pagas perderán los skins y serán reemplazados con versiones alternativas de la misma, esto debido a que gracias a "Absolute customizer", la plantilla posee todo lo necesario para crear el skin, pero con el fin de ahorrar tiempo, en la descarga encontraran distintas versiones.


Anime-purchased.xml serian los estilos "default", pero también encontrarás Anime-purchased.dark.xml, Anime-purchased.navi.xml, etc. Al instalar cualquier version alternativa, la plantilla estara configurada con ese skin, el cual podrás editar a gusto desde el "Diseñador de plantillas" de blogger.


Adsense

He retirado los anuncios "in-feed" e "in-article" de la plantilla y la documentación, ya que no era fácil de configurar.Por otra parte mejore la integración de los anuncios adaptables, mejorando la ubicación dentro y fuera de los artículos. Los anuncios del tipo texto heredarán la configuración de colores, tomados del diseñador de plantillas.


Datos estructurados

Se resolvió el problema que ocurría cuando eliminabas información de los artículos desde la configuración (fecha, autor, imagen), lo que provocaba que los datos estructurados no se volvieran a validar. También se corrigió la fecha de actualización (diferente a la fecha de publicación) y los datos tipo "Organization".


Versiones

Debido a la complejidad de estas nuevas plantillas y su claro nivel de superioridad a mis versiones actuales, el precio de la versión paga subirá en $1.50 + impuestos de paypal, sin embargo si ya tienes comprada la plantilla al precio actual ($4.79), podrás descargar la actualización sin costo adicional.


Respecto a la versión gratuita, todas estas mejoras también se incluyen alli, asi que no hay problema, la versión paga tendrá algunas comodidades, pero todo lo podrás hacer también en la gratuita.


Gracias por leer (ノ◕ヮ◕)ノ.