message pour Motoko...

salut Motoko, passionné (e) du Japon...beau pays...mais par contre si tu ne mets aucun texte sur ton blog...si tu ne donnes aucune adresse e-mail...dur dur de te répondre...
voici ce que tu me dis...
Motoko a dit...
Bonjour!!si je ne me suis pas trompé il faut aller à "paramètre" puis ensuite à "modèle" puis à "modifier le code HTML"une fois arriver à ce dernier il faut supprimer tout le code HTML déjà présent et il faut insérer ceci à la place
body ....

j'ai déjà essayer moult fois mais sa veut po marcher x( est-ce que tu pourrait m'aider s'il te plait? paske je suis une grosse boulette XDse serait vraiment gentil de ta part X)
27 novembre 2007 12:23
...............................................
tu n'as quand même pas enlevé tout la page html ? dis-moi...les yeux dans les yeux...avoue tout !!!! tu ne modifies qu'un tout petit bout de la page...
bon on recommence...tu ne vas enlever que ce qui est écrit en rouge...
et tu remplaces par ce qui est écrit en bleu...OK ?uniquement....
................................
body
{background:$bgcolor;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
......................................................
tu vas remplacer ce texte rouge par le texte bleu...tu as déjà l'adresse de ton image ??? elle doit ressembler à celle-ci:
(http://claudine.legac.googlepages.com/Numriser0060.jpg,
mais ne mets pas celle-ci attention, ça ne marcherait pas...
...........................................................
body
{background:$bgcolor;
background-image:url(http://claudine.legac.googlepages.com/Numriser0060.jpg);
background-repeat:repeat-y;
background-position:120% 10%;
background-attachment: scroll;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
......................................................................
après pour règler tu joues sur 120% et 10%...moi je suis à 0.9 et 0.5 pour certaines images...il faut de la patience...
ok ? laisse une place pour mettre un commentaire sur ton blog ou envoie ton adresse...bon courage...

message Sabine...texte glissant sur le fond du blog...

dans la page HTML tu trouves ceci, après avoir installé ton image de fond :

background-image:url(WEB URL OF YOUR PICTURE);
background-repeat:no-repeat;
background-position:120% 10%;
background-attachment: scroll;
margin:0;color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;font-size: /**/small;text-align: center;

pour que le texte "glisse" sur le fond, remplacer scroll par fixed
ce qui donne:
background-attachment: fixed;

bon courage...

Libellés ...petits nuages...

-Les libellés sont extrèmement utiles sur les blogs, mais la présentation proposée par Blogger n'est pas très esthétique...Alors lorsque j'ai découvert les "Libellés en nuage" chez mon amie Cate, j'ai craqué et je suis en train de les installer sur mes blogs...
Pour voir un exemple voyez ce blog ou cet autre, celui de Cate.
.............................................................
Réalisation:

-Elle est très bien expliquée en français dans ce blog: Narrow street, précisément à cette page ...
C'est assez simple, il suffit d'avoir de la patience, de bien ouvrir la page html en développant les gadgets.

-Lorsque vous aurez réalisé votre "nuage" vous pourrez personnaliser la taille des libellés et les couleurs...Les petites lettres ont la taille 10 et les plus grandes 20. J'ai augmenté la taille des petites et mis 11.

-Quant aux couleurs, vous les trouverez à cette adresse:RGB Color codesUtilisez les codes RGB (uniquement composés de chiffres) pour les "nuages", séparez chaque groupe de trois chiffres par une virgule.
-Exemple : modèle de base:
var maxFontSize = 20;taille de police la plus grande
var maxColor = [0,0,255];couleur de la police la plus grande
var minFontSize = 10;taille de la police la plus petite
var minColor = [0,0,0];couleur de la police la plus petite

modifié comme suit:
var maxFontSize = 20; taille de police la plus grande
var maxColor = [255,222,173];couleur de la police la plus grande
var minFontSize = 11; taille de la police la plus petite
var minColor = [255,255,240]; couleur de la police la plus petite

.....................................................
Les codes de couleurs pourront aussi vous servir pour les polices, fonds, bordures...de votre blog.
Dans ce cas utilisez les codes comprenant des chiffres et des lettres, code Hexadecimal
......................................................
Récapitulatif : adresses utiles pour ce travail:
Hélène Marcy
Narrow street
RGB Color codes

En fonction de l'image choisie pour le fond, vous pouvez désirer que le texte défile sur un fond fixe ou que l'ensemble défile.
Exemple de fond + texte mobile

Exemple de fond fixe

..................................................
Dans le paragraphe créé précédemment vous avez la phrase suivante:
background-attachment: scroll;
elle correspond au fond+texte mobile
Pour un texte mobile sur un fond fixe , remplacez scroll par fixed
background-attachment: fixed;
.......................................................
et n'oubliez pas d'enregistrer vos changements...

Image d'arrière-plan...suite...

traduction du guide betabloggersfordummies...
image d'arrière-plan: le paragraphe à insérer est le suivant:

body {
background:$bgcolor;
background-image:url(WEB URL OF YOUR PICTURE);
background-repeat:no-repeat;
background-position:120% 10%;
background-attachment: scroll;
margin:0;
color:$textcolor;font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
...............................................................
Le nombre 120% contrôle le placement horizontal de l'image et le nombre 10% le placement vertical.
Un pourcentage négatif poussera l'image vers le haut ou vers la droite.
Pour certaines de mes images je suis desendue à 0,9% et 0,2%...Il faut avoir un peu de patience et jouer avec ces deux nombres.

les liens.

Une autre nuit j'ai compris (enfin) que l'on pouvait mettre des liens sur une image, aussi bien que sur un mot...alors je me suis écriée: "Saint Prac, tu es béni entre tous, t'es vraiment un as !!!". J'ai surligné mon image avec la souris et j'ai écrit le lien près de l'icône verte...et ça marchait...d'où l'intérêt de bien suivre les messages des copains...

Cela marche même pour la voix...oui...si je crie très fort la nuit au fond des bois:

Monstres, êtes-vous là ? je les vois arriver...cliquez vous verrez...

Pour apprendre à "ouvrir les liens dans une nouvelle fenêtre " allez rejoindre Prac.

le blog de la nuit...

Il y a autant de blogs que de bloggers. J'appartiens à l'espèce des farfelues qui aiment bien "mettre leurs rêves en blogs"...Ce jour là , ou plutôt cette nuit là, je voulais que mes personnages se promènent dans le noir. Le Midnight blog est né...
Insérer des images ayant un fond noir n'était pas satisfaisant, il y avait toujours une démarcation. Alors j'ai travaillé en couleurs inversées.
Pour cela j'utilise le scanner, je découpe les personnages, je les scanne en inversant les couleurs puis je les découpe.
Je les colle ensuite sur une feuille de papier blanc. A ce stade, vous pouvez, avec des feutres, ajouter des détails, mais n'oubliez pas de travailler avec des couleurs inversées, les étoiles seront bleues, l'herbe rouge et le coquelicot vert...
Vous posez de nouveau sur le scanner, vous inversez de nouveau les couleurs, le fond blanc va devenir noir et les objets découpés reprendre leur couleur d'origine...
Pour avoir un effet un peu plus magique, il faut que les images soient vraiment pleine page...
Choisissez comme modèle de blog : "Simple II". et prenez le noir comme couleur d'arrière-plan. Ensuite amusez-vous...

Gifs animés...2... et Merci aux enfants...

Et voilà...un grand petit fils, s'est penché sur l'ordinateur..."mais voyons Mamie, il faut héberger ton gif quelque part et en plus c'est gratuit...."
Ils sont bien ces petits...J'ai donc utilisé "Imageshack"...et ce fut simplissime...ensuite le gif peut être installé comme image, ou par le biais de : ajouter un élément : HTML java-script...
amusement garanti...
PS: C'est là que vous comprenez l'énorme travail réalisé par ceux qui fabriquent des dessins animés...

Gifs animés...( pléonasme ???)...1...

Depuis que j'ai commencé à faire des blogs, j'avais très envie de réaliser mes propres gifs animés, mais je ne savais trop comment m'y prendre... En fait c'est très simple...Vous faites d'abord vos dessins...Plus il y en a plus le mouvement sera "naturel"...Ici l'exemple est très "primaire"...Je voulais qu'un oiseau danse un peu sur mon blog. (le premier qui rigole...!!!)

Voici la planche de dessins...le logiciel permet de les multiplier à l'infini...Bien sûr ceux-ci ne sont pas très élaborés mais l'essentiel est de comprendre le mécanisme...Après il suffit d'avoir de la patience...
Il faut ensuite avoir un logiciel...Peut-être en existe-t-il de gratuit...J'ai choisi "Gif Movie Gear 4". Vous pouvez bénéficier d'un essai gratuit de un mois...Si vous faites une provision d'images, vous aurez le temps de faire des dizaines de gifs...
Vous enregistrez vos dessins sur le logiciel , vous pouvez les multiplier, jouer sur les couleurs, la vitesse de défilement des images...bref bien vous amuser...
Après pour moi, ce fut la panne ...j'avais un gif mais je ne savais comment faire pour le mettre sur le blog...!!!...

création d'images. 2.

J'avais à ma disposition la photo d'une fenêtre scannée d'un magazine, elle avait juste besoin d'un peu d'éclaircissement, c'est facile à faire avec le scanner...
Pour Cortobeille, j'avais l'autographe...Pour qu'il se voit mieux sur la fenêtre, j'ai inversé les couleurs...

Mister Bird, je l'avais déjà, un morceau de métal rouillé ramassé au cours d'une balade avec Taobeille... Les éléments étaient réunis...Il ne manquait que l'assemblage...

J'ai téléchargé gratuitement le logiciel Photofiltre qui permet de faire facilement des tas de montages...

Prendre la fenêtre, ajouter Corto après avoir mis le fond en transparence, percher Mister Bird sur le rebord de la fenêtre...le résultat est ci-dessous...

L'histoire pouvait commencer...

création d'images .1.

Comment trouver des images pour illustrer les blogs ? il est possible que tu n'ais pas d'appareil photo, ou que tu ne saches pas comment trouver ou réaliser LA photo qui collerait pil-poil...Il existe sur le web des tas d'images libres de droit que l'on peut utiliser...

Prenons l'exemple du blog Cortobeille : ce personnage est né d'un jeune homme bien réel, mais aussi de Nils Holgerson, de Corto Maltese...Je ne pouvais utiliser une vraie photo de Cortobeille, ni le dessin de Corto Maltese ...Cependant le dessin offert par Hugo Pratt m'appartenait...

message pour Heodez...liens...

Je ne veux pas toujours choisir mes blogs pour les exemples, et puis c'est sympa d'en découvrir de nouveaux, surtout quand ils ont la qualité de celui que je vais citer...Alors pour parler des liens, je prends l'exemple de Heodez :
Bonjour ma belle...
en passant par ton blog j'ai retenu le texte ci-contre:

Mercredi 25 juillet 2007 (Anorexie)
Rien à voir avec le thème de ce blog, mais je viens de découvrir en navigant au petit bonheur la chance le blog d'une jeune anorexique qui se vante de ses exploits, d'après ce que j'ai pu comprendre. Et c'est la tristesse des blogs : on peut y écrire les pires témoignages sans créer de réaction. Cette fille a besoin d'aide.
http://princesspili-pilita.blogspot.com/
Publié par Heodez à l'adresse 22:13

Ce serait plus facile pour les lecteurs ( tu sais qu'ils sont parfois paresseux! )si tu écrivais ceci: le blog d'une jeune anorexique... ou bien
Princess Pili Pilita a besoin d'aide. le lien est inclus directement dans les mots...

pour l'inclure tu surlignes avec la souris le mot que tu veux relier, tu cliques sur l'icône verte, à côté des couleurs quand tu rédiges le message et tu copies l'adresse url...
et merci pour ton blog ...continue d'être ce que tu es...
Kenavo Heodez

et n'oubliez pas de rendre visite à Heodez et à la Princesse...

images placées dans la colonne de droite (side-bar)

En utilisant la fonction proposée par blogger insérer une image vous obtenez un résultat très "moche" une image aplatie comme l'exemple donné dans la barre de droite de ce blog... Dans le Forum d'aide en français, PRAC a expliqué comment mettre un lien sur une image, j'ai repris son explication pour insérer mes images... Tu choisis ton image, tu la postes sur ton blog, en la plaçant au milieu et tu édites le code html de l'image...il suffit de cliquer sur Modifier le code HTML et de copier-coller le texte...

Ensuite dans la barre de côté, tu ouvres la fonction: ajouter un élément: html java-script et tu colles le texte html que tu as obtenu...l'image se pose alors parfaitement...tu peux comparer les résultats dans la barre de droite...

La photo est un collage réalisé avec des images prises dans différentes revues et des photos prises sur des publicités pour Tendance 9...Merci à Prac de me les avoir envoyées...Dans la side-bar où l'image est aplatie, les bouteilles ont perdu leur silhouette élancée...

images de fond...derniers conseils

Lorsque tu travailles sur la page html pour introduire ton image tu peux obtenir ceci
background-position:120% 10%
pour que l'image soit correctement placée j'ai dû modifier le pourcentage et suis arrivée à ceci:
background-position:o.9% 0.5%
Il se peut qu'en fonction de la taille de ton image tu sois obligée de jouer avec ces pourcentages...C'est pourquoi un blog d'essai est utile...

Maintenant, si tu veux personnaliser ton blog , lis les quatre posts suivants...

images de fond.n° 4.modèle minima

Le modèle minima est le plus employé , c'est celui que tu as sur ton blog, avec un fond personnalisé il peut donner ceci ou cela...
1) tu vas sur mise en page
2) modèle, modifier le code htlm
3) tu trouves alors un texte comme celui-ci:
body {
background:$bgcolor;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;f
ont-size/* */:/**/small;
font-size: /**/small;text-align: center;

tu vas remplacer ce texte par celui-ci:
body {
background:$bgcolor;
background-image:url(http://claudine.legac.googlepages.com/Numriser0060.jpg);
background-repeat:repeat-y;
background-position:0.9% 0.5%;
background-attachment: scroll;
margin:0; color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;font-size: /**/small;
text-align: center;

bien sûr là où il y a http://claudine.legac.googlepages.com/Numriser0060.jpg il y aura le lien que tu as crée toi...tu fais un copier-coller et c'est bon, tu n'as plus qu'à cliquer sur enregistrer le modèle...

images de fond.n° 3. modèle rounder

Le modèle rounder est celui de ce blog...

Tu vas cliquer maintenant sur
mise en page,
modèle
et ouvrir "modifier le code html"
Tu trouves un texte identique à celui-ci:
body {
background:#ccc;
margin:0;
text-align:center;
line-height: 1.5em;
font:x-small Trebuchet MS, Verdana, Arial, Sans-serif;
color:$mainTextColor;
font-size/* */:/**/small;
font-size: /**/small;
Tu vas sur ton compte "pages-google" et tu copies le lien de ton image, (clic droit) tu obtiens alors un lien qui ressemble à celui-ci:
http://claudine.legac.googlepages.com/Numriser0024.jpg
tu vas alors remplacer:
background:#ccc;
par:
background-image:url(http://claudine.legac.googlepages.com/Numriser0024.jpg);
tu n'as plus maintenant qu'à enregistrer le modèle...

images de fond.n° 2. pages-google

Maintenant, on choisit ce qui sera le fond de votre blog. Ce peut être une photo, un dessin, une image, un collage. Avec l'aide d'un scanner, c'est très facile...
1/ On choisit un fond : image, rectangle de tissu, collage, tissage, etc...
-a)On prend un morceau qui fait un format A4 ( 21x29,7 cm.) que l'on scanne, avec tout ce que cela permet de modifications de couleurs, de nuances puis on le sauvegarde,
-b)Ou on choisit une photo que l'on télécharge sur son ordinateur;

2/ On se connecte à l'adresse suivante : http://pages.google.com/
3/ On crée un compte Gmail. C'est sur "pages google" qu'il faut télécharger l'image. Il y a beaucoup de place pour faire toute une réserve et c'est bien expliqué
4/ Lorsque le compte chez "pages google" est créé, on télécharge l'image.

images de fond...n° 1 (modèle rounder)

Je commence par le modèle que nous avons sous les yeux :c'est intéressant cette mise en page : "Rounders 2".
Avec ce modèle, on peut faire plein de choses avec une image de fond.
Exemples :
let's have....
mamie paisible
et de ma copine Helena, Bob T Bear .
L'image de fond ne se voit pas entièrement mais,en revanche, le fond du message et de la barre de côté est uni ce qui facilite la lecture.On peut jouer sur les couleurs des fonds de posts et sur le fond du texte dans la barre de côté.
Nous commencerons par ce modèle...
PREMIERE CHOSE A FAIRE ( à mon avis)Ne pas se lancer directement sur son blog, mais en créer un, rien que pour faire des essais, c'est plus prudent.