Páginas hechas con kumbia: geotronics.es y mtgsearch.it

Hola !!

En este post quiero enseñaros lo que he sido capaz de hacer hasta ahora con KumbiaPHP, os presento un par de páginas webs monolíticas, pero que gracias a la ayuda del framework me ha resultado fácil y rápido.

1) Geotronics es una WEB de GPSs industriales para obra y agricultura.
El diseño corre de la mano de Dadú estudio. Geotronics es una WEB 2.0 y como tal expone su contenido de eventos, ofertas e información de productos para que los usuarios y clientes puedan compartir su opinión.
La WEB actualiza su contenido con un CMS también logrado con KumbiaPHP y Bootstrap para el acabado.
Subida de archivos, gestión de usuarios, control en árbol de todas las secciones con pestañas y formularios vistosos que agilizan la actualización de todo.

GEOTRONICS SCREENSHOT

2) MTGSEARCH es una WEB del juego coleccionable llamado Magic: The Gathering o Magic: el encuentro.
Los usuarios aquí están informados de todo lo relacionado con este mundillo y todo gracias al uso de KumbiaPHP y MaterializeCSS para el acabado.
Buscadores rápidos, zona privada bien segura, acceso a las secciones a una velocidad sorprendente, manejo ágil de la base de datos.
En resumen, es todo lo que Google quiere para posicionarte bien; que la WEB sea rápida con diseño responsive para que se vea bien en todas las pantallas y el contenido sea usable.

MTGSEARCH SCREENSHOT

Saludos !!

Enlazar bloques de HTML con CSS

Hola Kumbieros !

Vengo a contaros un truco CSS que aprendí relativamente poco y aunque no es algo explícito de nuestro framework PHP, sí es algo a tener en cuenta a la hora de aplicar buenas prácticas a nuestro código.

Se trata de evitar situaciones en las que rompemos la estructura de nuestro código HTML, evitando hacer cosas como esta:

<a href="/blog/2016/12/01/enlazar-bloques-de-html-con-css">
<div>
<p>"DIV" Y OTRAS ETIQUETAS PESADAS DENTRO DE "A", NO PARECE LA FORMA MÁS CORRECTA</p>
</div>
</a>

Para evitar esto propongo crear una clase CSS con las siguiente propiedas:

<style>
/* ENLAZAR BLOQUES */
.box-link { overflow:hidden; position:relative; }
.box-link a { height:100%; left:0; position:absolute; top:0; width:100%;
</style>

Con la clase box-link le damos solidez a la caja que va a ser enlazada.
Y después le decimos al enlace que ocupe todo el alto y ancho de la caja.

Nuestro ejemplo quedaría ahora de la siguiente manera:

<div class="box-link">
<p>AHORA ESTA CAJA ES UN ENLACE</p>
<a href="/blog/2016/12/01/enlazar-bloques-de-html-con-css"></a>
</div>

Espero que les sea útil.

Gracias por leerme.