Ok

En poursuivant votre navigation sur ce site, vous acceptez l'utilisation de cookies. Ces derniers assurent le bon fonctionnement de nos services. En savoir plus.

13.03.2009

Afficher une image d'arrière plan en mosaïque, en motif (révisée)

Parce que vous ne trouverez pas forcément d'image à la taille idéale, et notamment parce que la zone à occuper n'a pas une surface constante, vous pouvez utiliser une image en motif, en mosaïque. Cette note publiée le 3 février a été mise à jour après le re-design de ce blog.

La partie centrale de ce blog, comme la colonne de droite sont habillées par des images en mosaïque, notammment. Il s'agit d'un motif, une petite image répétée autant de fois que nécessaire. Pour la colonne de droite, il s'agit de celle-ci :

body-bg.jpg

Dans la feuille de style

Vous trouverez dans le fichier les paramètres de la colonne de droite. Le code est maintenant le suivant :

#right {
overflow: hidden;
float: right;
width: 225px;
background: #ddb866 url(images/aspire/body-bg.jpg);
color: #000000;
}

La répétition d'une image en arrière-plan est activée par défaut. Il suffit donc de donner l'adresse de l'image pour qu'elle soit utilisée en motif. Dans ce code, il s'agit d'une adresse "relative" au domaine en cours en l'occurence geemee.hautetfort.com. Le code avec l'adresse absolue serait background: #ddb866 url("http://geemee.hautetfort.com/images/aspire/body-bg.jpg");

Il vous faut donc d'abord télécharger votre image-motif via Tableau de bord / Fichiers dans le répertoire images ou dans un nouveau dossier comme celui que j'ai nommé aspire.

Après vous modifiez la feuille de styles via Présentation / Configuration avancée / Feuille de styles : Modifier le template.

Trop facile non ?

Commentaires

Pfff, non, pas trop facile ;-)
pour faire un test rapide et probant, et surtout avant de me lancer dans la composition d'une image , comment je fais pour avoir le même arrière-plan qu'ici ?
Merci... encore et toujours !

Écrit par : Anne-Sophie | 12.02.2009

Répondre à ce commentaire

Je retire mon précédent commentaire... je n'avais pas tout lu ! Oups !

Écrit par : Anne-Sophie | 12.02.2009

Répondre à ce commentaire

Anne-Sophie,

Pour récupérer l'image fixe d'arrière plan, rendez-vous à l'adresse suivante et enregistrez l'image : http://geemee.hautetfort.com/images/UI1/arriere-plan.jpg

Pour récupérer l'image de texture de la colonne de droite, rendez-vous à l'adresse suivante et enregistrez l'image : http://geemee.hautetfort.com/images/UI1/texture.gif

Cette image vient du site desktopography.net où vous pourrez en trouver de magnifiques, dans de nombreuses résolutions différentes.

De rien ;-)

Écrit par : Gee Mee | 12.02.2009

Répondre à ce commentaire

Merci. Si, si, j'insiste ;-)

Écrit par : Anne-Sophie | 12.02.2009

Répondre à ce commentaire

Rien ne s'ouvre quand je clique sur Feuille de styles Modifier le template C'est rageant !!!!!!!!!!!!!!!!!!
Comment faire, j'ai déjà essayé deux fois.
Problème chez moi ou chez Haut et Fort ? à votre avis.
Merci d'avance. Erika

Écrit par : Erika | 07.04.2009

Répondre à ce commentaire

@ Erika : Je vous souhaite la bienvenue. Sous cette question apparemment anodine, sous ce cas, rouge, l'enfer se cache. De nombreuses causes différentes sont envisageables. Si aucune fenêtre de modification ne s'ouvre il y a un problème sérieux. Il faudrait connaître la configuration précise de votre machine pour établir un diagnostic...
Mais le plus vraisemblable est l'indisponibilité passagère de la plateforme. Soyez patiente, persévérante, et tenez-moi au courant.
Si le symptôme persiste, nous creuserons avec Hautetfort.

Écrit par : Gee Mee | 07.04.2009

Répondre à ce commentaire

Bonjour,
je suis nouvelle par ici et déjà je viens vous embêter!!!
J'ai choisi une jolie image, fait tout ce qu'il fallait... J'arrive soit à mettre l'image une seule fois en haut à gauche (en suivant l'autre tutoriel pour une image fixe), soit, en déneutralisant la fonction "repeat" à avoir l'image sur tout le côté gauche. Mais je n'arrive pas à la mettre sur tout le fond!!! Quand je suis ce tutoriel ci, il ne se passe rien!!
Please, Help Me!!!

Écrit par : Alice | 09.08.2010

Répondre à ce commentaire

Bonjour Alice et soyez la bienvenue.
Pour vous aider, j'ai besoin de bien comprendre ce que vous voulez faire. S'agit-il bien de couvrir tout l'arrière-plan du blog avec une image qui se répète en mosaïque ? Je viens de visiter votre blog, et cela semble être déjà le cas...

Écrit par : Gee Mee | 09.08.2010

Oui, après de nombreux essais, j'ai enfin réussi!!!!! En tous cas merci de votre réponse. ;)

Écrit par : Alice | 09.08.2010

Répondre à ce commentaire

Bonjour,

je reviens sur cet article car j'essaie de faire la même chose qu'Alice, mettre une image en fond de blog mais pas en fond d'article ni de colonne, mais impossible. Pourriez vous m'indiquer la marche à suivre svp?

Écrit par : Zadig | 30.08.2012

Répondre à ce commentaire

Bonjour,

En visitant votre blog, je vois que ma réponse est sans doute superflue.

Pour mémoire, vous pouvez spécifier l'arrière plan de chaque élément, en gardant en tête l'ordre d'empilement de chaque élément pour jouer des masques et ou des transparences.

Vous avez choisi du blanc pour masquer le motif géométrique d'arrière plan général, vous auriez pu tout aussi bien l'atténuer avec une image translucide. Voyez cette note qui fait le point sur tout ce que j'ai pu proposer à ce sujet.

http://geemee.hautetfort.com/archive/2009/09/15/afficher-image-transparente-translucide-arriere-plan.html

Écrit par : Gee Mee | 30.08.2012

Les commentaires sont fermés.