Recopilación de enlaces Nuevas funciones Css. Carousels en Css. Optimización de imágenes y cambios en los estilos definidos en los navegadores. GSAP liberado. Gitlab permite "deploys" de versiones. Dar estilos al atributo "alt" y cuando no cargan imágenes.
Recopilación de enlaces estilos para legend
, consenso para el uso de etiquetas Html, redirecciones en eleventy, Gtmetrix, como reportar bugs, quitar la Css asociada a Gutenberg en wordpress.
Recopilación de enlaces. find-in-page
, microformatos, Html en 2025, Shortcodes
en eleventy, asegurar wordpress.
Recopilación de enlaces. find-in-page
, microformatos, Html en 2025, Shortcodes
en eleventy, asegurar wordpress.
Llegan mejoras en attr() que facilitarán el uso de las animaciones Css entre páginas y el uso de popover.
La propiedad CSS text-wrap
controla como fluye el texto dentro del contenedor.
El selector padre.
Recopilación de enlaces. Llega popover()
, usabilidad de <input type="range">
, Responsively app y pruebas con @starting-style
.
Recopilación de enlaces. Wordpress y Gutenberg. Implementación de nuevas características en navegadores. Aligerar el DOM. Css anchor positioning. Validar el responsive
correctamente. La comunidad Indieweb.
Cuarto post
sobre de la renovación de esta web.
Tercer post
sobre de la renovación de esta web.
Recopilación de enlaces. Imágenes responsive, Git, defensores de la accesibilidad y uso del atributo `alt=""`.
Segundo post
sobre de la renovación de esta web
Primer post sobre la renovación de la web
Toma de contacto y enlaces relacionados
Mostrar y ocultar contenido con css grid.
Compartir contenido entre diferentes wordpress en una instalación multisite
Snippets, variables, condiciones, loops, includes ...
Eleventy para lorienbar, recopilación de link sobre eleventy, gulp, netlify y Decap Cms
Recopilación de snippets en Nunjucks, variables, condicionales, loops, includes, filtros y links relacionados.
Recopilación de novedades en html y css de las que vale la pena estar al tanto. font-size-adjust
, nth-of-type(of)
, color-mix()
, media queries range syntax
, light-dark()
, field-sizing
, @scope, Container queries, :modal
, @layer
, Css nesting, Scroll driven animations, text-wrap:balance
, text-box-trim
& text-box-edge
, view transitions.
Migrando este site de Wordpress a Middleman
He adaptado un mixin del artículo de css-tricks para poder usar rem
o em
según necesite.
Provocar saltos de linea cuando se introduce contenido mediante pseudoelementos.
Recopilación de links relacionados con Middleman, tutoriales y recursos.
Haz includes en middleman con partials.
Estilos diferentes con Css y el atributo lang
La característica que hace que use middleman commo generador de sites estáticos, es su capacidad de generar páginas y contenidos a partir de archivos json.
Muestra el atributo de un elemento con css mediante pseudoelementos.
Para por ejemplo cargar funciones a "cascoporro".
Muestra las descripciones de los items del menú.
Loops básicos en Wordpress.
Ejemplos de condicionales en php.
Privilegios de usuario para la bases de datos.
Mejora el tiempo de carga de la web.
Para crear un Theme es necesario añadir y editar este snippet al principio del archivo style.css
Proceso para recortar imágenes con Vista Previa en MacOsX
Dar estilos a los placeholders en los campos de los formularios.
En raras ocasiones no arranca mySql en mamp.
Varias imágenes de fondo con css.
Mi método para ordenar el código Css.
Corta las imágenes que se suben a media a un tamaño concreto para su uso en plantillas.
Al finalizar los tests del site hay que asegurarse de hacer algunos cambios antes de publicar un proyecto en Wordpress.
Para forzar el vaciado de la caché al subir una actualización.
Diferentes maneras de hacer includes
en las plantillas de wordpress.
Mover archivos desde el terminal tiene ciertas ventajas, como excluir carpetas o vaciar archivos.
Workflow. Inicio de un proyecto.
Diferentes layouts con Css grid
Links a plugins y recursos que uso en Sketch
Mixins en scss para dar fallback a navegadores que no soportan flexbox
Alternativa a css sticky, cuando display: sticky
falla.
Colección de herramientas online que uso habitualmente.
Mixins scss que uso habitualmente en mis proyectos.
Como modificar al texto de un botón al hacer click con jQuery
Recopilación de links sobre cursos, tutoriales o guias que, en algún momento, he encontrado útiles.
Añadir un subtitulo mediante css aprovechando el atributo title y los pseudoelementos
Recopilación de recursos y links de Sublime Text
Añadir el atributo checked a un checkbox haciendo click en el label via jquery
Como aumentar el ancho de una columna al hacer hover
reduciendo el ancho de las adyacentes.
Generar colores aleatorios con sass al compilar.
Uso de mixins de scss, mediaqueries y jQuery para cambiar la apariencia de un menú en tres estados diferentes, movil, escritorio y al hacer scroll.
Añadir placeholders con jQuery, podemos hacer las diferentes versiones en idiomas usando la etiqueta html
con el atributo lang
Loops con php estático para simular diferentes comportamientos dinámicos.
Animaciones hechas con css, concatenándolas con .delay
.
Cuatro métodos para mostar y ocultar información, por ejemplo un menú.
Pruebas con checkbox
para mostrar ocultar contenido en formularios.
Separando información en formularios para facilitar su uso, usando el mínimo código posible.
Reset que uso habitualmente. Su función es resetear todos los valores a 0 para acercarse lo máximo posible al diseño presentado y que sea lo más parecido posible entre navegadores.
Crea Shortcodes para usar en el gestor de wordpress. En el ejemplo se crea un párrafo con la clase .message
.
Imagenes destacadas en Wordpress (Featured image).
Boxizing
o como dejar de hacer malabarismos para crear columnas con html y css.
Seleccionar elementos, en CSS, de un formulario por tipo.
Ruta desde una plantilla de Wordpress a un archivo ubicado en el Theme.