Note
Cette documentation est en cours de redaction. Pour toutes questions n’hésitez pas à nous envoyer un email sur community@risefor.org ou à ouvrir un ticket directement sur git
2. Personnaliser votre instance
Nous avons conçu Risefor pour que vous puissiez changer facilement le logo, la charte graphique ainsi que la page d’acceuil afin de pouvoir vous l’approprier.
Respects des mentions « Risefor »
Risefor est un outil sous license Creative Commons Attribution-NonCommercial-ShareAlike 2.5 (copy left).
Nous vous demandons donc de bien préserver les mentions de « Risefor » sur vos instances
Changer les couleurs
La gestion des couleurs se trouve dans le dossier scss que vous pouvez retrouvez dans les sources (/src/scss/)
Toutes les couleurs sont déclarés dans le fichiers variables.scss, accessible ici scss/src/variables.scss
Vous pouvez y trouver des variables nommées, par exemple, $main-color suivi du code hex. Il vous suffit de modifier les couleurs et de recompiler.
Avertissement
La couleur du bouton secondaire est géré par la variable $third-cta-color. Nous allons revoir ce fonctionnement à un moment.
⚠️ Après avoir fait vos modifications, n’oubliez pas de recompiler le scss afin de mettre à jour le ficher css.
Si besoin, voici la commande
sass src/scss/index.scss static/css/united4earth.css
Note
Vous pouvez ajouter le flag --watch pour mettre à jour en continue
Changer le logo
Pour personnaliser le logo il vous suffi de :
1. Ajouter votre logo dans le dossier suivant :
united4earth/static/img/Logos/
2. Ouvrir le fichier suivant :
united4earth/templates/united4earth/header.html
Cherchez la ligne suivante:
<img class="navbar-item width-160px" id="logo" src="{% static 'img/Logos/risefor-logo_black-tagline.png' %}" alt="Logo Risefor">
Modifier le contenu
risefor-logo_black-tagline.pngprésent dans l’étape précédente par le nom de votre logo.Si vous êtes en production (
DEBUG = False), recompiler les fichiers static
python3 manage.py collectstatic
Et voilà ! Vous devriez voir votre logo :)
Si vous voulez changer la taille du logo, vous pouvez changer le nombre de pixel de largeur au niveau de la class width-160px visible dans l’étape 3.
Par exemple, pour un logo à 90px de largeur, la class serait width-90px
Personaliser la page d’acceuil
Pour personnaliser la page d’acceuil il vous suffit de changer le contenu dans le fichier suivant:
united4earth/templates/united4earth/home.html
Si vous êtes en production (DEBUG = False), il faudra recompiler les fichiers static pour faire apparaitre vos changements.
Si besoin, voici la commande
python3 manage.py collectstatic
Poussez vos modifications sur git
Fini avec vos modifications ? Il ne vous reste plus qu’à les pousser sur git !
Si besoin, voici la commande
git push
Rendez-vous dans la section deploiement serveur pour la prochaine étape !