AA-Gestion WP et Exemple

Titre plein page avec divider

Corp de texte avec titre sans divider

Cette page contient le module qui sont utilisé sur nos page AE avec les bon paramètre et peuvent donc servir d’exemple pour l’ecriture de vos page. Plus bas on d’écrit également les font, couleur et différent paramètre utile de wordpress.

Content avec titre et image intégré

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.


Ici une box pour mettre en avant quelque choses, du genre avancement du programme ou l’age des pingouin géant.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Note sur les parametres de page et de wordpress

Mise en forme :

Les couleurs :

  • bleu AE #263340
  • jaune AE : #eea200

Les fonts :

  • Corps de texte : helvetica
  • Titre : Verdana
  • Police Logo : Berlin sans FB

les icons devant le titre

Il suffit d’ajouter dans les cases « icon » le texte « fa-book » (icon book) pour l’icon souhaité.
Le fa-icon se trouve ici :
https://fontawesome.com/v4.7.0/icons/

Gestion des dimensions :

Il ne faut pas chercher a changer les tailles des images ou modules en eux meme, mais plutot penser a la taille des module contenant l’image.
On choisira toujours « fullpage ou Fullwitdh » pour les images, par contre on placera les modules image/slider etc… dans des box qui occupe la taille que l’on souhaite.
le thème fonctionne par taille des box et redimensionne les objet les contenant a la taille des box choisit.

les modules utilisé et leur paramètres :

  • Content : pour les texte
  • Content : pour les titres (choisir title with divider)
  • Box icon : encart a droite avec fond gris
    -> choisir « icon feft », « icon circle », « icon en blanc », « fond jaune AE », pas de titre (en général)
  • Image Frame : pour les images unique dans le bandeau latérale de droite par exemple
    choisir fullpage pour l’image qui s’adaptera de toute facon a la taille de la box dans laquel on la met.
  • Galery ( pour les bandeau d’image en ligne, par exemple les logo sur les pages sciences)
    Astuce : utiliser galery pour gérer le positionnement des images (en choisissant galery 3 colonne et en mettant une image blanche au début par exemple)
  • Slider image : (comme sur la page flotte AE)
    -Slider =>  nivo slider, Choisir la dimension (pers 400×400), apres avoir ajouter chaque image, il faut cliquer sur chaque image choisir « slider link », et choisir « fullpage lightbox » (pour que l’image s’affiche en grand dans un diaporama)
  • Bouton d’action (choisir donation/action ad), ne remplir que les lignes du bas qui s’appelle (bouton type, bouton text, bouton link), le bouton ne s’affichera que si un lien est renseigner dans bouton link, penser a changer les couleurs (text en blanc, fond du bouton en jaune AE)

Réglage de WordPress :

Pour le captcha :

Captcha de google (reCaptcha admin page) regler grace au plugin contact form

reCAPTCHA (v3)

Pour les redirection :

Écrire dans le fichier .htacces les redirection avec la forme suivante : (toute les lignes doivent placé au dessus de tout le reste (de #begin wordpress donc)
Tuto et générateur de plan de redirection ici :
https://www.yakaferci.com/redirection/

Modification du thème (attention pas touche sauf expert !!!!)

Modification réalisé des CSS pour la mise en forme du site
(en cas de mise a jour du theme, aller d’abord dans apparence puis greenature, ne rien toucher, mais faire « save change » pour que les paramètres soit appliqué, aller ensuite dans les CSS pour faire les modifs)

Feuille de style : style.css

ligne 108 : padding a zéro passer a 8 (pour header espace bas)

ligne 251 : modifier les padding a 24, 33, 10, 0 (pour header espace au dessus et au dessous du menu)

ligne 277 : Pour gerer l’espace entre le titre et le sommet de la page dans le header.
valeur par defaut : 190, changement a 150

ligne 265 : valeur par defaut : padding 85px 0px 80px, le dernier chiffre gère l’esapace entre le titre et le bas du bandeau du header. changement a 60px

ligne 270 : taille police titre page,
Valeur par default : font size 45px, changement a 25px

ligne 447 : Espacement autour des boutons actions
Valeur par defaut : padding 50px, 40px, 37px, changement a 5px, 4px, 4px

Feuille de style style.custom.css : (stylesheet/style.custom.css)

ligne 53 : couleur du divider (border-color)
changement de border-color a #eea200

ligne 111 : fond header des tableaux (cf calendrier)
Changement du backgroud color a #eea200

ligne 50 : couleur du texte des pages
Defaut : #808080, changement a #263340

ligne 23 : gestion de la couleur et transparent du menu du haut.
le denier chiffre gère la transparence. passe de 0,80 a 0,90

ligne 175 : Couleur fond zone mail/objet/entrée des formulaires
defaut : back-groud color : f7f7f7 changer pour e5e5e5 (sinon pas visible sur le homepage)

You are donating to : Greennature Foundation

How much would you like to donate?
$10 $20 $30
Would you like to make regular donations? I would like to make donation(s)
How many times would you like this to recur? (including this payment) *
Name *
Last Name *
Email *
Phone
Address
Additional Note
paypalstripe
Loading...