Mettre une image en fond de Blog
- Attention bidouiller le CSS n'est pas sans risque, vous pouvez perdre votre mise en page et ce, de manière irréversible ! Alors, penser à faire une sauvegarde de votre code CSS en le copiant-collant dans un fichier texte (word, note pad, bloc note, writer ou autre) afin de pouvoir le récupérer en cas de problème.
- ____________________________________________________________________________
- Pour mettre une image en fond de Blog (principes valables pour la V2 d'over-blog)
Il faut une image assez grande de la taille d'un écran c'est-à-dire 1024x768 pixel, une photo ou bien un scan d'une de vos réalisations.
L'image doit ensuite être téléchargée sur over-blog dans les documents.
Aller dans l'administration puis cliquer sur Documents (1)
Ensuite cliquer sur Images & Albums photos (2)
Ensuire, (ça c'est mon astuce) je désactive l'assistant de téléchargement des dosuments afin de pouvoir charger mon image dans sa taille d'origine (uniquement pour les grande images). Pour le désactiver, cliquer sur la ligne bleue "désactiver l'assistant", vous pourrez le réactiver ensuite.
Puis télécharger l'image souhaitée, ATTENTION, afin de conserver votre taille d'origine décocher l'option "optimiser les images", sinon OB redimensionne les images de grande taille en 600x600 pixels.Une fois l'image téléchargé, aller dans l'otion design (1)
Et si vous n'êtes pas en mode avancé, cliquer sur" mode avancé"(2)
La fenêtre des CSS s'affiche, pour modifier votre CSS, cocher "je souhaite modifer ..."
Le code à modifier :
code original :
body {margin:0px; padding:0px; background-color:#000000 ; font-family: Verdana, Helvetica, Arial, sans-serif; font-size:x-small; color:#FFF;}
Au préalable vous aurez repérer et copier l'adresse de l'image dans la rubrique "Images & Album photo" zn cliquant sur le petit marteau sous votre image choisie.
code pour mettre une image en fond :
body {margin:0px; padding:0px; background:URL(http://idata.over-blog.com/0/60/25/11/novembre/votre-image.jpg); background-repeat:no-repeat;background-position:left; background-attachment:fixed; font-family: Verdana, Helvetica, Arial, sans-serif; font-size:x-small;}
*****************************************************
Explication du code :
body = corp du blog
{margin:0px; = taille des marges
padding:0px; = taille des espacements
background:URL(http://idata.over-blog.com/0/60/25/11/novembre/fond2.jpg); = adresse de l'image de fond
background-repeat:no-repeat; = soit le fond est affiché une seule fois (si vous mettez no-repeat) soit il est affiché en mosaïque (si vous mettez repeat après les :)
background-position:left; = position de l'image left=gauche right=droite center=centrée
background-attachment:fixed; = mettre cette ligne si vous souhaitez que votre fond soit fixe et ne bouge pas avec l'ascenseur, sinon supprimer cette ligne..
font-family: Verdana, Helvetica, Arial, sans-serif; = police
font-size:x-small; = taille de la police
}
***************