Je vous offre les fruits de mon travail en toute amitié, et vous invite à partager mes astuces, créations, poèmes et bien plus encore… J'espère que vous apprécierez !

*AIDE*ASTUCES*GADGETS MODULES DIVERS*

– Afficher vos nouveautés dans un module « sandbox » en page d’accueil (sur demande de Laora)


Afficher vos nouveautés dans un module "sandbox" en page d’accueil :

1. Ouvrez votre blog sur la page de modification.
Si vous n’avez pas encore de module "sandbox" allez voir par là pour l’installer =>
http://astucesjoella.canalblog.com/archives/2006/09/02/2591829.html

2. Une fois installé sur votre blog, cliquez sur "Edit HTML" de votre sandbox

0001

3. collez-y le code ci-dessous :

<img src="http://storage.canalblog.com/95/92/144645/11411264.gif"/>
<a href="ICI VOUS METTEZ LE LIEN DE VOTRE BILLET COCERNE" target="centre"><strong><font color="#ICI LE CODE COULEUR DU TEXTE">ICI VOTRE TITRE</a><br>

0002

4. Remplissez d’après mes indications.

Pour l’image "new", je vous ai laissez mon lien (.gif), mais vous pouvez le remplacer par votre gif bien sûr.

Pour connaître le lien d’un billet précis, cliquez sur "blog" et allez copier le raccourcis de ce billet pour le coller à la place de mon texte.

0003

0004

0005

voilà ce que cela donne :

0006

Pour trouver les codes couleurs, allez voir par là (Prenez toujours le 1er code à 6 lettres) => http://astucesjoella.canalblog.com/archives/2006/04/01/2601816.html
et collez le code à la place de mon texte.

0007     0008

Pour votre titre, ne le faites pas trop long afin qu’il reste sur une ligne et écrivez-le à la place de mon texte.

0009     0010

Quand vous avez complétez le tout, cliquez sur "save"

0011

et voyez si cela vous plaît !

Voilà le mien en mode édition :

0012

et en mode public :

0013

Vous pouvez ainsi, mettre plusieurs liens, ci-dessous mon exemple avec 4 liens, mais sachez qu’il y a une limite de 956 caractères et c’est le maximum que j’ai su mettre, mais rien ne vous empêche de mettre plusieurs modules aussi 🙂

Conseil : Prenez toutes vos notes sur votre bloc-notes et ensuite collez le tout dans votre sandbox, c’est bien plus facile 😉

<img src="http://storage.canalblog.com/95/92/144645/11411264.gif"/>
<a href="
http://astucesjoella.canalblog.com/archives/2007/03/16/3619253.html" target="centre"><strong><font color="#000000">Venez voir mes astuces</a>
<br>
<img src="
http://storage.canalblog.com/95/92/144645/11411264.gif"/>
<a href="
http://luniversdejoella.spaces.live.com/" target="centre"><font color="#ffffff">Exemple 2</a>
<br>
<img src="
http://storage.canalblog.com/95/92/144645/11411264.gif"/>
<a href="
http://astucesjoella.canalblog.com/" target="centre"><font color="#000000">Exemple 3</a>
<br>
<img src="
http://storage.canalblog.com/95/92/144645/11411264.gif"/>
<a href="
http://jo-est-la.spaces.live.com/blog/cns!86D01EE81199E5A4!136.entry" target="centre"><font color="#ffffff">Exemple 4</a>
<br>

Vous voulez voir ce que cela donne avec plusieurs modules sur un blog ?
Allez voir par là =>
http://jo-est-la.spaces.live.com/

retour_menu


– Mettre des photos/images dans le « sandbox HTML ».


Comment mettre des photos/images dans le "sandbox HTML" ?

Cliquez sur mes images pour les voir en grands

Si vous n’avez pas encore installé le "sandbox HTML" allez voir par là pour le faire => http://astucesjoella.canalblog.com/archives/2006/09/02/2591829.html

1. Sélectionnez le code ci-dessous – Copiez-le en cliquant côté droit de votre souris et dans le menu qui se déroule cliquez sur "Copier" et allez le coller dans votre module "sandbox HTML" et cliquez sur "save".

Code : <center><img src="LIEN DE VOTRE IMAGE ICI">

001

002

2. Maintenant allez copier le lien (URL) de votre image dans votre blog ou autre.
Ici je vous montre en image comment le faire depuis une image qui se trouve déja dans votre album photo.

– Cliquez sur "options" audessus à droite.

003

– Puis sur "stockage" dans la colonne de gauche.

004

Sur cette page vous verrez toutes les images de vos albums photos, cherchez votre photo ou image et ensuite copiez le lien de celle-ci en cliquant côté droit de votre souris sur le lien, et dans le menu qui se déroule cliquez sur "Copier le raccourcis".

005

Revenez dans votre page d’accueil en cliquant sur votre titre

006

Dans le sandbox HTML sélectionnez LIEN DE VOTRE IMAGE ICI et collez le lien que vous venez de copier à la place de cette phrase.
Puis cliquez sur "save" et vous y verrez apparaître votre image !

007

008

Pour mieux voir ce à quoi cela ressemble, quitter le mode Edition et voyez sur votre page d’accueil.

REMARQUE :
Si vous avez une image très grande, déplacez votre module "sandbox HTML", allez voir par là pour savoir comment faire en image =>
http://astucesjoella.canalblog.com/archives/2007/04/21/4696109.html

Vous pouvez aller voir les exemples sur mon blog d’essais

Cliquez ici

retour_menu


– Modifier les modules et/ou les gadgets

Modifier les modules et/ou les gadgets

Il est possible de faire en sorte que l’un ou l’autre module et/ou gadget prenne la largeur de votre colonne.
Voici un exemple avec mon module "HTML Sandbox" où se trouve ma bannière que j’aimerais mettre en entête de blog sur toute sa largeur.

Voici comment procéder :

1. (image 001-002)
Je déplace d’abord mon module en haut de page

001_

et je clique sur "Enregistrer"

002_

2. (image 003)
Placez votre code de votre bannière. (allez voir par là si vous ne savez pas comment faire). et cliquez sur "save" pour enregistrer celle-ci dans votre module.

003_

3. (image 004-005-006)
Ensuite allez sur la toute petite flèche qui se trouve en haut et à droite du module

004_

et choisissez "Préférences" (Si vous cliquez sur "masquer" celui-ci supprime le module !)

005_

Vous voyez une nouvelle fenêtre qui s’ouvre et là vous avez plusieurs choix, voyez par vous-même, moi j’ai également coché "Masquer le titre…" mais vous pouvez le laisser et mettre un autre titre que les visiteurs verrons.

Et pour que votre bannière prenne la largeur de votre blog, cochez la case "Occuper toute la largeur", puis sur "ok".

006_

Et voilà ce que cela donne, vous pouvez allez voir ce que cela donne sur votre blog, en cliquant sur "Quitter le mode édition".

007_

Si vous allez visiter mon blog MSN vous verrez que j’ai fais le même pour le bas de ma page d’accueil.


– Créer et installer un Geocounter dans le « sandbox HTML » et/ou dans le « custom HTML »


Créer et installer un Geocounter  dans le "sandbox HTML" et/ou dans le "custom HTML"

Cliquez sur les images pour les agrandir

1.

Allez d’abord vous inscrire par là =>

http://www.geovisite.com/fr/inscription.php

001

2.

Cliquez en haut de page à gauche sur "ADMIN" et sur le drapeau de votre

langue, vous arrivez sur cette page où vous pouvez complétez vos infos de

connexion.

002

3.

Sur la page qui suit cliquez sur "GEOCOUNTER"

003

4.

Modifiez votre counter comme vous le désirez, ou laissez-le ainsi, à vous de

choisir.

Ensuite copiez le code qui convient à votre blog.

004

5.

et allez le coller dans le "sandbox. Voyez mon image.

005

6.

Et voilà votre counter qui est installé !

006

Vous pouvez aller le voir sur mon blog d’essais

Cliquez ici

retour_menu


– Comment insérer des horloges html (par ex iframes) dans un gadget ?


Comment insérer des horloges html (par ex iframes)   dans le "sandbox HTML" et/ou dans le "custom HTML" ?

Si vous n’avez pas encore installé le/les gadgets "HTML Sandbox" ou le "Sandbox" allez voir par là comment procéder clique_ici_gif_020

Une fois le gadget installé, il ne vous reste plus qu’à insérer le code "iframe" de l’horloge désirée dans le gadget comme sur mes images ci-dessous.

1.

Copiez le code entier et collez le dans le cadre blanc (pour centrer votre horloge mettez ce code en début "<P align=center>"), cliquez ensuite sur "save" pour enregistrer les modifications

Image1

2.

Et voilà votre horloge de placée.

Image2

Voici quelques sites qui proposent de superbes horloges/calendriers :

Blinkies
Horloges blinkies :
http://www.desiderenzia.net/horloges.htm
Horloges pink : http://www.pijadesigns.com/NewK/MINI/Pinkbc.htm
Humains
Visages :
http://pijadesigns.com/Face.htm
Hommes : http://pijadesigns.com/Menbck.htm
Saisons
Hiver :
http://www.pijadesigns.com/Winter/Wintercal1.htm
Eté : http://pijadesigns.com/Summcal.htm
Automne : http://www.pijadesigns.com/Fall/Fallcal.htm
Romance
Romantiques 1 :
http://pijadesigns.com/Romance.htm
Romantiques 2 : http://pijadesigns.com/Romance1.htm
Romantiques 3 : http://pijadesigns.com/Romance2.htm
Stars
Chanteurs :
http://www.pijadesigns.com/Celeb/Celcamus1.htm
Elvis Presley : http://www.pijadesigns.com/Celeb/Elviscal.htm
Célébrités : http://www.pijadesigns.com/Celeb/Celcal2.htm
Marilyn Monroe : http://www.pijadesigns.com/Celeb/MMcal.htm
Couleurs or
http://www.pijadesigns.com/NewK/Gold/Gold.htm
Halloween
http://www.pijadesigns.com/Halloween1/HC1.htm
http://www.pijadesigns.com/Halloween1/Hblcal.htm
http://www.pijadesigns.com/Halloween1/HC2.htm
Animaux
Chats :
http://pijadesigns.com/catcal.htm
Chiens : http://www.pijadesigns.com/Dogcal.htm
Chats sauvages : http://www.pijadesigns.com/WCp.htm
Loups : http://www.pijadesigns.com/Wolfpage.htm

retour_menu


– Mettre la date et/ou l’heure dans le « sandbox HTML » et/ou dans le « custom HTML »


Mettre la date et/ou l’heure dans le "sandbox HTML" et/ou dans le "custom HTML"

La date et l’heure au Canada :

Code :

<DIV align=center>&nbsp;</DIV>
<DIV align=center>
<TABLE cellPadding=4 bgColor=#ffffbb border=1>
<TBODY>
<TR>
<TD><A href="
http://www.escati.com/"><FONT face=Arial size=4><IMG src="http://escati.linkopp.net/cgi-bin/clock.cgi?trgb=000000&amp;srgb=00ff00&amp;prgb=221100&amp;timezone=GMT-0400" border=0></FONT></A><BR></TD>
<TD><A href="
http://www.escati.com/"><FONT face=Arial size=4><IMG src="http://escati.linkopp.net/cgi-bin/date.cgi?trgb=000000&amp;srgb=00ff00&amp;prgb=221100&amp;timezone=GMT-0400" border=0></FONT></A><BR></TD></TR></TBODY></TABLE></DIV>
<DIV align=center>&nbsp;</DIV>

L’heure au Canada :

Code :

<div align=center></a><a href="http://www.escati.com/">
<img height=19 src="
http://escati.linkopp.net/clock/clock.php?
trgb=000000&srgb=00ff00&prgb=000000&timezone=GMT-0400" width=85 border=0 style="width:85px;height:19px"></a></div>

Code :

<div align=center><img src="http://services.antinea.org/dateimg.php3?++RED">

Code :

<div align=center><IMG SRC="http://services.antinea.org/dateimg.php3?+14+GREEN"&gt;

Code :

<div align=center><IMG SRC="http://services.antinea.org/dateimg.php3"&gt; 

Code :

<div align=center><IMG SRC="http://services.antinea.org/dateimg.php3?++BLUE"&gt;

Code :

<FONT face="Comic Sans MS"><SPAN>
<P><IMG src="http://contadores.swin.net:81/Count.cgi?display=clock&amp;tformat=24 Horas&amp;timezone=GMT+0100&amp;dd=sw47&amp;ft=4&amp;frgb=000000"></P></SPAN></FONT>

Code :

<P><IMG src="http://contadores.swin.net:81/Count.cgi?display=date&amp;dformat=DDMMYY&amp;timezone=GMT+0100&amp;dd=sw47&amp;ft=4&amp;frgb=000000"></P&gt;

Code :

<div align=center>
<P align=center><IMG src="
http://www.domainename.com/heure.cgi">
</P>

Code :

<p style="<a href="http://www.escati.com/"><font color="#ffcc00"><img height=19 src="http://escati.linkopp.net/clock/clock.php?trgb=000000&srgb=00ff00&prgb=000000&timezone=GMT+0200" width=85 border=0 style="width:85px;height:19px"></font></a></p>

retour_menu


– Mettre un compteur de visite dans le « sandbox HTML » et/ou dans le « custom HTML »


Mettre un compteur de visite  dans le "sandbox HTML" et/ou dans le "custom HTML"

Miami Probate

Avant tout il faut le créer, allez voir par là d’abord  82a___34_

Ensuite, le code que vous avez obtenu, collez-le tout simplement dans le customHMTL comme ceci

<div align=center>
<a href="
http://www.1800probate.com/probate-lawyer/florida.html">
<img src="
http://www.e-zeeinternet.com/count
.php?page=90816&style=links&nbdigits=5" alt="Miami Probate" border=0>
</a><br>
<a href="
http://www.1800probate.com/probate-lawyer/florida.html"
title="Miami Probate" style="font-family:Geneva, Arial, Helvetica, sans-serif;font-size:10px;color:#000000;text-decoration:none">
Miami Probate</a>

retour_menu


– Afficher des détails de vos visiteurs tel que adresse IP dans le « sandbox HTML » et/ou dans le « custom HTML »


Afficher des détails de vos visiteurs tel que adresse IP dans le "sandbox HTML" et/ou dans le "custom HTML"

 

Code

<DIV align=center>
<P align=center><STRONG><FONT color=#008000 size=4>Votre adresse IP est ….. Voyez vous même.</FONT></STRONG></P>
<P align=center><IMG src="
http://www.danasoft.com/sig/TzetXna.jpg">&nbsp; </P></DIV>

retour_menu


– Indiquer D’où Viennent Vos Visiteurs dans le « sandbox HTML » et/ou dans le « custom HTML »


Indiquer D’où Viennent Vos Visiteurs dans le "sandbox HTML" et/ou dans le "custom HTML"

Vous venez de

Merci pour votre visite …

Code :

<div align=center><strong>Vous venez de </strong></div>
<div align=center> </div>
<div align=center><img src="
http://api.hostip.info/flag.php" border=0></div>
<div align=center> </div>
<div align=center><strong>Merci pour votre visite …</strong></div>

retour_menu


– Mettre un compteur de temps dans le « sandbox HTML » et/ou dans le « custom HTML »


Mettre un compteur de temps dans le "sandbox HTML" et/ou dans le "custom HTML"

Cela fais minutes et secondes que vous êtes sur cette page …..

Code

<p style="<font face="Times New Roman">
<font color="#ff0066"><span><em>Cela fais</em></span>
<img src="
http://img332.imageshack.us/img332/2599/12pa.gif">
<img src="
http://img332.imageshack.us/img332/1098/29zu.gif">
<font size="+0"> <font size="+0">
<span><font size="+0"><font size=2><em>minutes et</em>
</font> </font></span></font>
<img src="
http://img332.imageshack.us/img332/9757/32ow.gif">
<img src="
http://img332.imageshack.us/img332/8940/46qo.gif">
</font><font size=2><span><em>secondes que vous êtes sur
cette page …</em></span></font></font></font></p>

________________________

Vous êtes sur mon blog depuis :

Code

<DIV align=center>&nbsp;</DIV>
<DIV align=center><FONT color=#008000 size=3><STRONG>Vous êtes sur mon blog depuis :</STRONG>
</FONT></DIV>
<DIV align=center>&nbsp;</DIV>
<DIV align=center><IMG src="
http://storage.msn.com/x1pAdjo0uCo2H191a0sa7z4fM2MN8uwRdmB_7KyZ4m
0fF6oac03KKBb5nauPRUWoAC2jHNgbdNX28vTMH2p7cy17BVSpxMtpwDkhx7poiL_R
9YKTGGNJsbWX95-ICXnrJx0TNeTp2PgYk2pWZ8QoEst4A" border=0><IMG src="
http://storage.msn.com/x1pAdjo0uCo2H191a0sa7z4fM2MN8uwRdmB_7KyZ4m0
fF7ft3iKVCjgNwi9KD7XHCvzF1kjsF1DyVgBcWwL7ry7mYHD3WjVL4blwrMiXvWnSyWz
8NtYb8q5QJEUEc1_FCBkDIU2dxNVaXP5ZaU6fER5uQ" border=0><IMG src="
http://storage.msn.com/x1pAdjo0uCo2H191a0sa7z4fM2MN8uwRdmB_7KyZ4m0
fF78uIsZCOIVE4rnIgJ9M3_upaIYPKc0q9lhGYXNzRki69lszWOJZZvyBcWFmIdxfskW3G
cLoOGwTBUcPyZzArOv5kwqDnzdAkcI8O2nL4B_Sg" border=0><IMG src="
http://storage.msn.com/x1pAdjo0uCo2H191a0sa7z4fM2MN8uwRdmB_7KyZ4m0
fF7qHCF6-n6fM7n-l0_YzS9eOXgwrSDR5AHy4Nd3vmizG6YgPd6vBzjNTpdvMXw4TjD
tLIHwg1i3bu7CB5fWxzw2C4sZh_9F5smwo8AQLTocgA" border=0></DIV>

________________________

Code

<P><P><FONT><SPAN></P><DIV>
<P></P></DIV></SPAN></FONT>
<P><A href="
http://click.quick-web.com/?id=38947">
<IMG src="
http://perso.wanadoo.fr/Record-2005/min2.gif">
<IMG src="
http://perso.wanadoo.fr/Record-2005/s2.gif">
<IMG src="
http://perso.wanadoo.fr/Record-2005/1s2.gif">
</A> </SPAN></P><DIV></DIV></FONT></TD></TR></TBODY>
</TABLE></TD></TR><TR><TD><TABLE><TBODY></TBODY>
</TABLE></TD></TR><TR><TD></TD></TR><TR><TD width="100%">
<TABLE><TBODY><TR></TR></TBODY></TABLE>

________________________

Code

<DIV align=center><IMG height=70 src="http://img232.imageshack.us/img232/5969/13cf.gif" width=67><IMG src="http://img232.imageshack.us/img232/7066/29ud.gif"><IMG src="http://img232.imageshack.us/img232/5012/39rn.gif"><IMG height=70 src="http://img232.imageshack.us/img232/8202/4a4ur.gif" width=85></DIV>

retour_menu


– Centrer vos textes ou images dans le « sandbox HTML » ou « customHTML »


Centrer textes et/ou images dans le "sandbox HTML" ou "customHTML"

Pour centrer une image ou texte mettez <center> avant votre lien.

Ex : <center><img src="http:lien de votre image">

retour_menu


– Faire de beaux cadres pour vos images dans le « sanbox HTML » et/ou dans le « custom HTML »



Pour mettre un joli bord autour de vos images, avec la couleur, le bord désiré et la taille voulue dans votre "Sandbox HTML" ou/et dans le "custom HTML", mettez le code ci-dessous et complétez-le selon vos désirs et ensuite cliquez sur "save" pour enregistrer les modifications.

Le code à mettre :

<center><img style="border:NOM DE LA COULEUR TAILLE 0 à 9pt NOM DU BORD" height=HAUTEUR DE L’IMAGE src="LIEN DE VOTRE IMAGE" width=LARGEUR DE L’IMAGE>

Par exemple ci-dessous, voilà ce que cela doit donner :

<div align=center><img style="border:pink 3pt double" height=101 src="http://www.myblog.fr/albums/Images-humains-animees/353314.jpg" width=100>

Voici le nom des différents bords possibles :

  1. dotted

  2. dashed

  3. double

  4. Solid

  5. groove

  6. ridge

  7. inset

  8. outset

Et voici un tableau avec le nom des différentes couleurs en anglais, mais vous pouvez également utiliser les codes couleurs HTML

AliceBlue

AntiqueWhite

Aqua

Aquamarine

Azure

Beige

Bisque

Black

BlanchedAlmond

Blue

BlueViolet

Brown

BurlyWood

CadetBlue

Chartreuse

Chocolate

Coral

Coral

CornflowerBlue

Cornsilk

Crimson

Cyan

DarkBlue

DarkCyan

DarkGoldenrod

DarkGray

DarkGreen

DarkKhaki

DarkMagenta

DarkOliveGreen

DarkOrange

DarkOrchid

DarkRed

DarkSalmon

DarkSeaGreen

DarkSlateBlue

DarkSlateGray

DarkTurquoise

DarkViolet

DeepPink

DeepSkyBlue

DimGray

DodgerBlue

FireBrick

FloralWhite

ForestGreen

Fuchsia

Gainsboro

GhostWhite

Gold

Goldenrod

Gray

Green

GreenYellow

Honeydew

HotPink

IndianRed

Indigo

Ivory

Khaki

Lavender

LavenderBlush

LawnGreen

LemonChiffon

LightBlue

LightCoral

LightCyan

LightGoldenrodYellow

LightGreen

LightGrey

LightPink

LightSalmon

LightSeaGreen

LightSkyBlue

LightSlateGray

LightSteelBlue

LightYellow

Lime

LimeGreen

Linen

Magenta

Maroon

MediumAquamarine

MediumBlue

MediumOrchid

MediumPurple

MediumSeaGreen

MediumSlateBlue

MediumSpringGreen

MediumTurquoise

MediumVioletRed

MidnightBlue

MintCream

MistyRose

Moccasin

NavajoWhite

Navy

OldLace

Olive

OliveDrab

Orange

OrangeRed

Orchid

PaleGoldenrod

PaleGreen

PaleTurquoise

PaleVioletRed

PapayaWhip

PeachPuff

Peru

Pink

Plum

PowderBlue

Purple

Red

RosyBrown

RoyalBlue

SaddleBrown

Salmon

SandyBrown

SeaGreen

Seashell

Sienna

Silver

SkyBlue

SlateBlue

SlateGray

Snow

SpringGreen

SteelBlue

Tan

Teal

Thistle

Tomato

Turquoise

Violet

Wheat

White

WhiteSmoke

Yellow

YellowGreen

retour_menu


– Comment ajouter les gadgets sur les spacesBlog MSN depuis Windows live Gallery ?


Comment installer un ou des gadgets depuis Windows live Gallery sur votre SpaceBlog MSN ?

Faites comme sur mes images ci-dessous !

1.Cliquez sur personnaliser

001

2.Cliquez sur "modules", puis "gadgets"

002

3. Cliquez sur "ajouter des gadgets depuis…."

003

4. Cliquez sur "ajouter" pour le module désiré, ici le HTML sandbox

004

5. Cochez "spaces" et cliquez sur "ajouter"

005

6. Cliquez sur "installer"

006

7.

007

REMARQUE :

– Si vous le déplacez, n’oubliez pas d’enregistrer les modifications en haut de votre page !

008

– Dans le module HTML sandbox, pour toute modification dans le gadget même, n’oubliez pas de cliquer sur "save" pour enregistrer les modifications !

009

retour_menu


– Comment installer un ou des gadgets depuis un autre SpaceBlogMSN sur le vôtre ?


Comment installer un ou des gadgets depuis un autre SpaceBlog MSN ?

Faites comme sur mes images ci-dessous !

1.

Quand vous êtes sur un blog, vous cliquez sur la petite croix du gadget qui vous intéresse.

001

2.

Cliquez ensuite sur "Ajouter à votre espace perso"

002

3.

Cliquez sur "Installer"

003

4.

Maintenant vous pouvez déplacer ce gadget où bon vous semble sur votre blog.

007

Voilà, c’est on ne peut plus simple !

REMARQUE :

– Si vous le déplacez, n’oubliez pas d’enregistrer les modifications en haut de votre page !

008

– Dans le module HTML sandbox, pour toute modification dans le gadget même, n’oubliez pas de cliquer sur "save" pour enregistrer les modifications !

009

retour_menu


Mettre le module Sandbox HTML ? – A quoi sert-il ?

Qu’est-ce que le HTMLsandbox et comment s’en servir :

Ce gadget vous permet de présenter la plupart de contenu de HTML, excepté le Javascript sur votre espace (blog).
Installer l’instrument sur votre blog, placez quasi n’importe quel code
valide de HTML dedans.
C’est le plus utile des gadget pour votre blog pour mettre des
présentations, des videos, images, horloges, compteurs, etc…
De plus, il est possible d’en mettre plus d’un, ce qui vous permet de faire pas mal d’ajout sur votre page d’accueil !

Vous trouverez ce gadget en cliquant sur l’image

Pour savoir comment l’installer sur votre blog à partir d’un autre blog :

http://astucesjoella.canalblog.com/archives/2007/01/02/3571985.html

Pour savoir comment l’installer sur votre blog à partir de la gallery :

http://astucesjoella.canalblog.com/archives/2006/12/30/3553632.html

Comment s’en servir ?

Une fois installer sur votre blog, il suffit d’insérer le code HTML et de valider, ce n’est pas plus compliqué !

HTMLsandbox

retour_menu


– Comment bien placer vos modules-Les possibilités


Comment bien placer vos modules – Les possibilités :

J’ai ouvert un blog uniquement pour vous expliquer au mieux toutes les possibilitées pour placer les modules et gadgets.
Les explications par écrits sont très compliqués et donc j’espère que
vous comprendrez !

POUR BIEN VOIR MES IMAGES, CLIQUEZ DESSUS

1.
Voilà le blog au départ sans rien d’ajouté.
Vous pouvez déja placer les modules présent où bon vous semble, et
aussi masquer ceux que vous ne désirez plus comme moi.
J’ai également déja modifié le thème afin de bien voir le tout.

001_

2.
Vous voyez tout en haut et tout en bas un cadre où il est noté "Vous
pouvez faire glisser les modules et gadgets ici."
Voyez mon image, j’ai mis des flèches jaune.

002_


Tout les modules et/ou gadgets que vous mettrez dans ces cadres
s’afficherons pour le haut, tout en haut de votre page d’accueil et tout ce que vous mettrez dans le cadre du bas, s’afficherons, tout en bas de votre page d’accueil comme sur mon exemple ci-dessous. Moi j’ai mis le module "titre et slogan" audessus et "Blog" tout endessous.
N’oubliez jamais de cliquer sur "enregistrer" après chaque modification
!

003_


Voilà ce que cela donne pour vos visiteurs (ou quand vous "Quittez le
mode Edition")

004_

3.
Dans ces parties vous pouvez y mettre tout ce que vous désirez et même
modifier la largeur du module.
Par exemple moi j’ai créé une liste de blog, cette liste est petite car
elle est dans la colonne du milieu par défaut.

005_

Maintenant je vais installer ce module dans le contenu du haut, car j’aimerais que mes visiteurs voient cette catégorie dès qu’ils ouvrent mon blog.
Pour cela il suffit de pointer votre souris sur le haut de ce module,
vous voyez votre flèche se transformer en un espèce de petit carré, cliquez et sans lâcher votre souris, glissez ce module à l’endroit désiré.
Vous voyez apparaître un fin trait qui vous indiquera où est votre
module si vous lâchez.

006_

Lorsqu’il est placé, n’oubliez pas d’enregistrer les modifications !

007_

007__

Comme vous le voyez, ce module ne prend pas toute la largeur de la page.
Vous pouvez le laisser ainsi et mettre un autre module de même
dimentions à côté ou bien vous pouvez faire en sorte qu’il prenne toute la largeur de la page.

Pour cela cliquez sur la petite flèche en haut du module à droite.

008_

Ensuite sur "préférences"

008__

Et dans le cadre qui s’ouvre, cochez "occuper toute la largeur", puis cliquez "OK"
Vous pourrez constater qu’il est également possible de cacher le titre
et le contour de ce module.

008___

Voilà ce que cela donne rien que pour la largeur :

008____

Et ici en ayant coché "Masquer le titre pour les visiteurs" et "Masquer la bordure pour les visiteurs"

008_____

Vous pouvez faire exactement la même chose tout en bas de votre page.

008______

4.
En quelques mots, vous placez vos modules comme vous le désirez et dans
les largeurs désirés.

En haut et en bas, vous pouvez faire en sorte que les modules prennent toute la largeur du blog.
Et au centre, vous pouvez choisir une disposition d’origine.
Pour mon exemple j’ai choisis la disposition de 4 colonnes

009_

voyez mon exemple sur l’image

009__

5.
Tout les placements des modules dépendent de la disposition choisie au
départ.
Voilà un autre exemple avec la disposition de 3 colonnes (Une fine à
gauche, une plus large au centre et une fine à droite)

010_

J’ai également ajouter des modules, caché tout les bords et caché certains titres de modules.

010__

Vous voulez voir le blog en "vrai" ?

Cliquez ici

Je ne peux bien sûr pas vous montrer toutes les possibilitées, il y en a tellement que j’en aurais pour des mois de travail !
Vous devez un peu chercher, essayer de tout jusqu’à obtention de ce que
vous aimez.

retour_menu