[Tutorial] Créer un fond pour votre thème

[Invité]

Bienvenue, Invité. Veuillez vous connecter ou vous inscrire.

Connexion avec identifiant et mot de passe

[Diabolo]

Comme vous avez du remarquer, j'ai mis un nouveau fond pour notre site (Dégradé vert+barre horizontale)

C'est une manipulation très simple à faire, cependant ne concerne que les thèmes Mx qui ne sont pas en pleine page (100%):

1/Créer une image de fond avec votre logiciel de traitement d'images

Exemple une image de 524x22px:




Placer cette image dans le répertoire /Votre_thème/style/images/
->Créer au besoin ce répertoire.

Nous allons maintenant placer notre image en fond, celle-ci sera répétée x fois sur toute la largeur de votre site.

Ouvrir le fichier style.css de votre thème.
Rechercher:

Code:

body {

dans les proprités de "Body", rajouter:

Code:

background-image: url(images/NOM DE VOTRE IMAGE.gif);
  background-repeat: repeat-x

Explications du code: Nous mettons l'image en fond (Remarquer le chemin de l'image) et nous répétons l'image sur l'axe x (Largeur)

Voila notre fond est fait, cependant si vous dérouler le site vers le bas à partir de 522 pixels(Longueur de notre image) l'image n'est pas répétée et c'est la couleur de fond qui apparait.
Ill faut donc changer la couleur de fond pour faire une jonction "invisible avec l'image d'où l'intérêt d'une image en dégradé.

Très simple, avec la pipette de votre logiciel de traitement d'image, relevez la dernière couleur en bas de votre image.
ex: #FFFFFF

Retourner dans votre body du style.css et modifier dans les propriétés votre couleur de fond
Exemple:

Code:

background-color: #FFFFFF;

Et voila.

Tout est possible, j'ai pris une image dans notre exemple mais vous pouvez aussi utiliser des motifs que vous répétez en largeur "x" et en longueur "y" (background-repeat: repeat-y)