bg_maxbgMax est un petit module (créé par Lomart du forum de Joomla), dont le but est de faciliter la mise en place d'une image de fond pour votre site.

Bien que conçu pour faciliter la personnalisation des templates gérée par le Framework JA T3, il fonctionne avec la plupart des templates.

Il est totalement indépendant du template, il se contente d'ajouter du code pour personnaliser votre page après génération par le template. Cela prend tout son sens dans le cas du Framework JA T3 et de son fichier 'index.php' inhabituel et déroutant.

Mais pourquoi s'appelle-t'il bgMax ?

Tout simplement, car à l'origine, il servait à implanter le javascript bgMax, crée par www.webbricks.org, dont le but est d'agrandir l'image de fond à la taille du navigateur et de réaliser un effet de fondu lors de l'affichage.

Concrètement, sous Joomla, il suffit d'installer le module comme vous le faites d'habitude, puis de le publier en position debug pour qu'il soit appelé en dernier lors de la génération de la page.

 

 

Pour découvrir les possibilités du module, le plus simple est d'explorer son panneau de paramétrage.

bgmax-1

La première partie des paramètres permet de définir l'image de fond qui peut être une url absolue / relative ou être choisie dans la liste des images du dossier 'images/stories'.

Pour la couleur utilisée en l'absence d'image, vous pouvez la choisir en vous aidant du sélecteur de couleurs ou bien laisser le module la définir en fonction de la couleur du bas-gauche de l'image. Comme cela, le fond change automatiquement avec l'image.

Configuration bgMax

La deuxième partie va fixer le comportement de l'image dans la fenêtre du navigateur client.

Elle peut s'agrandir/réduire uniquement en largeur ou dans les 2 sens. Elle peut également avoir une taille fixe. Dans ce dernier cas, le javascript ne sera pas utilisé.

Les autres paramètres définissent la position et le mode de défilement. Au cas où, zIndex et Décalage top permettent de compenser des problèmes du navigateur ou du template.

Configuration bgMax

Il reste à régler le côté magie du module : l'apparition en fondu de l'image.

Le délai d'apparition permet de définir le temps de chargement de l'image au-dessous duquel l'effet ne sera pas actif. Pour les pages suivantes, l'image étant en cache, l'effet n'aura pas lieu. A adapter selon la vitesse de votre hébergement.

La durée et le nombre d'images par seconde sont des notions plus simples à régler.

Note: le fondu n'est pas actif si l'image n'est pas redimensionnée.

Configuration bgmax

Avec certains templates, le bloc central ne permet pas de voir l'image de fond; ce qui est dommage pour notre utilisation.

Il suffit donc d'indiquer le nom du sélecteur CSS qui définit le centre de la page. Par exemple, #ja-wrapper pour JA T3. Puis sa largeur en pixels ou en pourcentage, sa position horizontale, la couleur et l'opacité du fond.

Configuration bgMax

Et pour être complet et exhaustif, on peut indiquer le code à ajouter dans la partie HEAD de la page générée.

Ce peut être le style d'un titre pour être en harmonie avec l'image de fond, un second bloc qui joue sur le contenu central, ...

 


J'espère que ce script vous sera utile pour une personnalisation rapide des templates JAT3 ou simplement pour changer l'image de fond de votre site sans remettre les mains dans le CSS.

Astuce: vous pouvez créer plusieurs modules bgmax comme fond Noël, fond Halloween, promo machin... Ensuite, le seul travail sera de les (dés)activer. La prochaine évolution du module sera sans doute d'ajouter une période de validité pour que cette action devienne inutile.

Il s'agit de mon premier module Joomla, soyez indulgent et n'hésitez pas à le tester et le commenter ...

lomart sur le forum Joomla.fr

Merci à Peter_P et Loicdu21 pour leurs suggestions et tests. Notre collaboration pour la traduction du Framework JAT3 est à l'origine de ce module.

Un grand merci à Erwan (www.webbricks.org) qui a su fournir les indications pour adapter son script à l'environnement Joomla.

Téléchargez le mod_bgmax

Vous avez trouvé une erreur ? Sélectionnez la et appuyez sur Ctrl + Entrée.