Manejo de archivos estáticos en Django
Para poder emplear archivos estáticos en el proyecto, configuramos la siguiente variable:
customlogin\customlogin\settings.py
STATIC_URL = "static/"
Más información en:
https://docs.djangoproject.com/en/dev/howto/static-files/
Instalar Bootstrap y Fontawesome
En esta sección principalmente vamos a querer personalizar algunos templates y conocer sus comportamientos; una de las claves de esta personalización es que tenga un buen diseño, y es por eso que volveremos a emplear Bootstrap.
Comencemos instalando Bootstrap; al ser CodeIgniter un framework sin ninguna vinculación con Node, debemos de usar las CDN de Bootstrap la cual podemos obtener desde la página oficial:
Presionas sobre "Download" y luego nuevamente sobre "Download" en el siguiente apartado:
Bootstrap, al ser un framework web del lado del cliente, usa CSS y JavaScript para poder utilizar cualquier componente o funcionalidad de Bootstrap; una vez descargado el comprimido anterior y generada la carpeta (la cual, para simplificar el proceso, renombramos como bootstrap) necesitamos los siguientes archivos:
account/static/
<link rel="stylesheet" href="{% static 'bootstrap\css\bootstrap.min.css' %}">
<link rel="stylesheet" href="{% static 'fontawesome\css\all.min.css' %}">Que vamos a copiar dentro de la carpeta static del proyecto:
Figura 17-2: Bootstrap y Fontawesome instalados en el proyecto
Tambien instalamos la dependencias de popper que puedes obtener desde la misma página de Bootstrap; instalamos Fontawesome para la iconografía:
<link rel="stylesheet" href="{% static 'fontawesome\css\all.min.css' %}">Recuerda descargar los archivos fuentes para web de manera gratuita de:
Con Fontawesome tenemos acceso a múltiples iconos en SVG ya listos para emplear.
También existe un paquete específico para Django en el caso de que lo prefieras configurar de esa manera:
https://fontawesome.com/docs/web/use-with/python-django
- Andrés Cruz
Desarrollo con Laravel, Django, Flask, CodeIgniter, HTML5, CSS3, MySQL, JavaScript, Vue, Android, iOS, Flutter