Bonnenouvelle.fr Agence web WordPress
https://bonnenouvelle.fr/Creer-ses-boutons-illustres.html

Modernisez vos boutons

Nouveau ! Créez vous-même vos boutons, blocs et pied de page et illustrez-les avec des pictogrammes à personnaliser selon les couleurs de votre site.

Ces boutons et blocs peuvent aussi être intégrés dans un article

Mode d’emploi pour créer ses boutons illustrés

Deux outils pour choisir un code couleur

  1. Roue chromatique sur l’espace privé > Squelettes > Couleurs du site
  2. Module Colorzilla à ajouter Firefox ou Chrome
  1. Aller sur l’espace privé > Squelettes > Votre colonne de gauche ou de droite
  2. Copier-coller le code du bouton ou bloc ci-dessous
  3. Personnalisez-le
  4. Enregistrer l’article
  5. Aller sur le site public > Recalculer la page

Changer l’url du lien d’un bouton

  • url=article7 : lien vers l’article 7
  • url=auteur4 : lien vers l’auteur 4
  • url=rubrique7 : lien vers la rubrique 7
  • url=http://bonnenouvelle.fr : lien externe
  • url=spip.php ?page=deuxcolonnes : lien vers un modèle de page

Titre de l’image : comments

Copier-coller le code ci-dessous
Personnaliser le titre, les couleurs et l’image
  • titrelien=Contacter un prêtre
  • couleurpolice=#FFFFFF
  • titreimg=fa-comments
  • couleurimg=#FFFFFF
  • couleurbordure=#00338D (facultatif)
  • couleurfond=#39C7F6 (facultatif)
Choisir d’autres pictos

- Aller sur http://fortawesome.github.io/Font-Awesome/icons, moteur de recherche en anglais
- Faire un clic droit sur le picto choisi > Copier le texte du lien


Boutons pour sites paroissiaux

Classés par titre de bouton

Titre de l’image : comments

Titre de l’image : comments-o

Titre de l’image : envelope-o

Titre de l’image : hand-o-right

Titre de l’image : user-plus

Titre de l’image : calendar-o

Titre de l’image : facebook

Titre de l’image : heart-o

Titre de l’image : clock-o

Titre de l’image : file-pdf-o

Titre de l’image : file-check

Titre de l’image : bell-o

Titre de l’image : compress


Blocs pour sites paroissiaux

Personnaliser le titre, les couleurs et l’image
  • titrelien=Edito
  • rubrique=181, numéro de la rubrique, affiche le dernier article publié de la rubrique
  • couleurpolice=#009EE3
  • titreimg=fa-rss
  • couleurimg=#009EE3
  • couleurbordure=#009EE3
  • couleurfond=#89E1FB (facultatif)

Bloc edito_n avec l’image : rss

Copier-coller le code

Bloc edito_n avec l’image : microphone

Bloc edito_n avec l’image : video-camera

Titre de l’image : paper-plane-o

Bloc newsletter_n avec l’image : paper-plane-o


Boutons pour sites d’écoles

Titre de l’image : check

Titre de l’image : cutlery

Titre de l’image : file-pdf-o

Blocs pour sites d’écoles

Bloc edito_n avec l’image : rss


Options

Titre de l’image : power-off

Titre de l’image : user

Titre de l’image : check

Titre de l’image : plus


Menus de pied de page

  • La couleur des textes et images en pied de page sont celles du site, cf > Squelettes > Couleurs du site
  • Mettre la balise avec le nom de l’image avant le texte : Adresse <span class="fa fa-thumb-tack fa-1x"></span>
  • Balise avec un lien sur l’image : [<span class="fa fa-youtube fa-1x">->http://bonnenouvelle.tv]</span>

Modifier les pieds de page

  1. Aller sur l’espace privé
  2. > invisible
  3. > Modifier l’article "Votre menu de pied de page ou de newsletter" ou
  4. > Squelettes > Votre site bonnnenouvelle.fr
    NB : lien vers les mentions légales obligatoire sur toutes les pages du site et les e-mailings, merci de laisser le lien vers Bonnenouvelle.fr
  • fa-2x double la taille du picto
  • pas possible d’afficher ces pictogrammes dans un e-mailing

Haut E-mail Contacts/Horaires Annuaire Evénements Nouveaux Mentions légales RSS Espace privé Site Bonnenouvelle.fr

Copier-coller le code

Votre nom rue Code postal Ville Tél. : 04 83 16 07 20 Bonnenouvelle Toulon Accès

Pied de page mobile

Contacts Légal Privé Bonnenouvelle.fr

Réagir à cet articleRéagir à cet article

Un message, un commentaire ?

modération a priori

Attention, votre message n’apparaîtra qu’après avoir été relu et approuvé.

Qui êtes-vous ?
Ajoutez votre commentaire ici

Ce champ accepte les raccourcis SPIP {{gras}} {italique} -*liste [texte->url] <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.



Le blog

Documents joints

 
Bonnenouvelle.fr site de paroisse, communauté, école