David G. Smyth (SmythSys)

Fontawesome es una página web con una serie de iconos, gratuitos y de pago, que usan muchas páginas. La manera más usual de usar estos iconos es por html. Sólo tienes que ir a la páginas de iconos, pinchar en que te muestre el código y te lo da. Por ejemplo el del icono del mouse sería:

<i class="fas fa-mouse"></i>

Sin embargo, hay ocasiones que queremos añadir estos iconos sobre elementos html que ya están hechos y no podemos modificar (como plantillas o plugins). Para eso podemos usar este truco de CSS que vamos a mostraros hoy. Vamos a usar lo que os enseñamos en este artículo de poner contenido por CSS.

Poner iconos de Fontawesome por CSS.

Lo que vamos a hacer es usar este Cheat Sheet que proporciona el propi FontAwesesome. Como veis cada icono viene con un código.

En la clase o ID que vayamos a modificar (llamémosle ejemplo) vamos a poner o un elemento before o after (voy a usar un before). Os hemos puesto el icono del ratón en este ejemplo :

.ejemplo::before {
content: "\f8cc";
font-family: " Font Awesome 5 Free ";
}

Observad que el código del icono va entre comillas y precedido de un \. Y que hay que usar la familia de fuentes adecuada.

Obviamente podemos poner todo el resto de elementos de altura que queramos. Recordar que es como una fuente así que modificamos el tamaño y color como una fuente.

Os lo mostramos en un ejemplo en el vídeo:

Este caso lo tuvimos hace unos días. Es una tontería, pero te puede hacer perder un tiempo innecesario.

Teníamos una web en Nginx donde queríamos redirigir todos los http (puerto 80) a https (puerto 443).

Esto es bastante sencillo, sólo hay que poner la línea:

return 301 https://$host$request_uri;

O, si quieres sólo una página en concreto: return 301 https://tudominio.com$request_uri;

El problema es que, cuando activábamos esto, aunque Nginx en el test decía que todo bien, al reiniciar nos daba el error de “Too many redirects“.

Solución.

La solución es sencilla, seguramente tienes puesto http y https en el mismo bloque de Nginx, y está intentando redirigir ambas peticiones.Es decir las peticiones al 80 se redirigen al 443, y estas se vuelven a redirigir. Tendrás algo como:

server {
  listen 80;
  listen [::]:80;
  server_name tudominio.com;
  listen 443 ssl;
  listen [::]:443 ssl;
....................................
}

Lo que tienes que hacer es dividir esto en dos bloques, para que sólo se redirijan las peticiones al puerto 80.

server {
  listen 80;
  listen [::]:80;
  server_name tudominio.com;
  return 301 https://$host$request_uri
}
server {
  listen 443 ssl;
  listen [::]:443 ssl;
  server_name tudominio.com;
....................................
}