Cet article décrit la démarche à suivre pour mettre rapidement bgMAX en fonction.

Vous avez installé le module correspondant à votre version de Joomla! à l'aide du gestionnaire d'extension.

le module bgmax est activé et publié en position debug (ou une autre position située en fin de votre template si la position debug n'existe pas).

N'oubliez pas, sous Joomla 1.6, d'activer le module pour les pages souhaitées dans le "Menu d'assignement"

Il faut maintenant indiquer les bonnes informations dans les paramètres du module.

1.   Avant de choisir la photo de fond, il faut s'assurer que celle-ci sera visible !

Pour cela, vous disposez de 2 outils :

  • celui du chanceux, vérifiez si votre template est répertorié sur cette page
  • Firefox & Firebug, qui vont vous permettre d'explorer la structure de votre site.
    Consulter cette documentation très complète.

Donc, une fois que vous avez isolé le sélecteur qui englobe le contenu de votre site, il suffit de l'indiquer dans la zone "Sélecteur CSS contenu".

Certains templates utilisent des conteneurs différents les uns au dessous des autres pour chacune des grandes parties de la page (entête, contenu, pied). Il suffira dans ce cas de tous les indiquer en les séparant par des virgules (exemple: "#header, #contenu, #footer"). Si vous ne voulez pas appliquer les contraintes de largeur, couleur, opacité à tous les conteneurs, vous devez indiquer les règles dans le code complémentaire.   

bgmax config 4

Nous pouvons en profiter pour remplir les autres rubriques :

  • Couleur de fond : uniquement si vous désirez changer la couleur définie par le template
  • Opacité du fond : pour créer une transparence permettant de voir le fond au-dessous de votre contenu
  • Largeur du contenu : il faut bien entendu laisser de l'espace pour apercevoir l'image de fond. Selon la structure de votre template, cette valeur sera en pourcentage (60%) ou en largeur fixe (950px). Utilisez Firebug pour déterminer la valeur idéale!
  • Alignement du contenu : à votre convenance.

2. Maintenant l'environnement est prêt à recevoir votre fond

Vous avez plusieurs possibilités :

  1. une image fixe
  2. une image au hasard dans un sous-dossier du dossier "images/bgmax"
  3. pas d'image, mais uniquement une couleur de fond. Pour cela, il suffit de ne pas indiquer d'image.

bgmax config 1

couleur image = oui, définit la couleur de fond comme celle du pixel bas-gauche de l'image active.

3. Maintenant, il ne reste plus que la présentation du fond

Le mode d'ajustement vous offre plusieurs choix :

  • MAX et FULL : la taille de l'image s'adapte à celle du navigateur. MAX en largeur seulement et FULL dans les 2 sens. Dans ces modes, vous pourrez définir un effet de fondu pour l'affichage.
  • AUCUN : l'image est affichée sans aucun effet autre que l'alignement défini
  • REPEAT : l'image sera répétée horizontalement, verticalement ou dans les 2 sens
  • COVER : l'image va s'adapter pour couvrir tout le fond

Les autres options :

  • Agrandissement et réduction : uniquement pour les modes MAX et FULL, permet de limiter l'action d'ajustement à la fenêtre.
  • Position : valide dans tous les modes, définit si l'image se déplace en même temps que le contenu
  • Alignement horizontal et vertical : justification de l'image (valide dans tous les modes)
  • zIndex et Décalage top : d'un usage exceptionnel, conserver les valeurs par défaut

bgmax config 2

4. Vous en savez assez pour utiliser bgMAX

Mais consulter la documentation complète pour explorer toutes les possibilités du module

Print Friendly and PDF