Overblog Suivre ce blog
Administration Créer mon blog
19 février 2016 5 19 /02 /février /2016 09:03
Pour éviter d'avoir des articles trop longs, il peut être utile de mettre certaines informations dans des ascenseurs. Le texte à mettre dans l'ascenseur doit être entouré d'un code HTML ; lire cet article pour savoir comment faire



1. Mettre du texte dans un ascenseur (Scrollbar)

Pour ne pas que votre article soit trop long, il peut être utile de placer une partie du texte dans un ascenseur, comme ci-dessus.



1.1 Code HTML

Le plus simple est de commencer par taper son texte "normalement", en édition basique, de choisir sa police, sa taille, sa couleur....

Une fois que votre texte est prêt, passer en mode HTML(Bouton HTML à gauche dans le menu de l'édition avancée sur Overblog).

Avant votre texte, ajouter :
<div style="height: 250px; width: 650px; overflow: auto;">

et après votre texte :
</div>



1.2 Paramétrages

Height représente la hauteur de votre ascenseur.
Width représente la largeur de l'ascenseur

  Attention : votre ascenseur n'apparaîtra que si le texte à l'intérieur "dépasse" de la taille définie.


1.3 Modifications ultérieures du texte.

Si vous avez besoin de corriger votre texte après l'avoir mis dans un ascenseur, il vous faut faire un Clic-droit pour retourner en mode édition et faire les modifications souihaitées. C'est un peu long et il est donc conseillé de corriger et mettre en forme le texte AVANT l'insertion dans l'ascenseur.


 


 

2. Exemple complet de code pour un texte dans un ascenseur

L'ascenseur en haut de cet article a le code suivant :


<span style="font-family: comic sans ms,sans-serif;"><span style="font-size: 10pt;"><strong>
<div style="text-align: center;">
<div style="width: 300px; height: 50px; overflow: auto;">
<div style="text-align: left;"><span style="color: #ff6600;">Pour &eacute;viter d'avoir des articles trop longs, il peut &ecirc;tre utile de mettre certaines informations dans des ascenseurs. Le texte &agrave; mettre dans l'ascenseur doit &ecirc;tre entour&eacute; d'un code HTML ; lire cet article pour savoir comment faire</span></div>

 



Si vous avez besoin d'explications supplémentaires, déposez moi votre question en commentaire !
 

 

superstickies


 


 

  * 5 articles a lire pour demarrer votre blog
* Initiation au langage HTML
* Tout pour modifier et embellir vos textes
* Tout savoir sur les images 
* Des jeux
* Des gadgets
* Votre blog ne ressemblera pas aux autres
* Mes astuces
* Référencements et indexations
* Index des articles


 

                                    Rendez-vous sur Hellocoton !                                                        

 

 

Repost 0
Published by Aurelie - dans Les textes
commenter cet article
17 février 2016 3 17 /02 /février /2016 09:02

Ce gadget pour décorer votre blog avec la photo la plus drole du jour !

 

 

Code en script du gadget "photo drole du jour

 

<script src="http://www.gmodules.com/ig/ifr?url=http://www.digitalpowered.info/gadget/models.xml&amp;synd=open&amp;w=320&amp;h=550&amp;title=La+photo+la+plus+rigolote+du+jour&amp;border=%23ffffff%7C0px%2C1px+solid+%23993333%7C0px%2C1px+solid+%23bb5555%7C0px%2C1px+solid+%23DD7777%7C0px%2C2px+solid+%23EE8888&amp;output=js"></script>

 

Restrictions au gadget

 

Ce code est en javascript, et donc interdit aux blog OB en mode confiance.

 

Provenance du code "Photo la + drole du jour"

 

Ce code vient de chez Google

 

 

Articles a revoir

Plein de gifs animés sur le thème de l'ordinateur

Love Gadget : calcule tes chances entre toi et ton amoureux

Des effets surprenants avec vos photos

superstickies


 


 

  * 5 articles a lire pour demarrer votre blog
* Initiation au langage HTML
* Tout pour modifier et embellir vos textes
* Tout savoir sur les images 
* Des jeux
* Des gadgets
* Votre blog ne ressemblera pas aux autres
* Mes astuces
* Référencements et indexations
* Index des articles


 

                                    Rendez-vous sur Hellocoton !                                                        

 

 

Repost 0
Published by Aurelie - dans Gadget à blogs
commenter cet article
10 février 2016 3 10 /02 /février /2016 18:29

 

 

 


 Allez, je vous fournis ici le code HTML de ce message "I love you" animé, qui provient de chez SpringWidget.

Je vous invite d'ailleurs à aller faire un tour chez eux, on y trouve plein de gadgets sympa !

 

Code HTML à recopier :

<!-- SpringWidgets | I love you comment (#74873) | HTML | Generated on 05/03/2010 --><object type="application/x-shockwave-flash" allowNetworking="all" allowScriptAccess="always" allowFullScreen="true" height="78" width="468" id="springwidgets_74873" align="middle" data="http://downloads.thespringbox.com/web/wrapper.php?file=74873.sbw" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0"><param name="allowNetworking" value="all" /><param name="allowScriptAccess" value="always" /><param name="allowFullScreen" value="true" /><param name="movie" value="http://downloads.thespringbox.com/web/wrapper.php?file=74873.sbw" /><param name="flashvars" value="" /><param name="quality" value="high" /><param name="wmode" value="transparent" /><param name="bgColor" value="0x000000" /><embed bgColor="0x000000" allowNetworking="all" allowFullScreen="true" allowScriptAccess="always" src="http://downloads.thespringbox.com/web/wrapper.php?file=74873.sbw" flashvars="" quality="high" name="springwidgets_74873" wmode="transparent" width="468" height="78" align="middle" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed></object><div style="font:11px/12px arial;width:468px;"><a href="http://www.springwidgets.com/widgets/view/74873/?&width=468&height=78" target="_blank" title="Get this widget!">Get this widget!</a></div><div style="font:11px/12px arial;width:468px;"><a href="http://widgia.com" target="_blank" title="widgia.com">widgia.com</a></div><div><a href="http://widgia.com" target="_blank">More widgets here</a></div>

 


                                      Rendez-vous sur Hellocoton !                                                   





 

Repost 0
Published by Aurelie - dans Les textes
commenter cet article
5 février 2016 5 05 /02 /février /2016 18:30

 



Prenez-vous pour un journaliste avec le site Newspaper Clipping generator et fabriquez vous-même votre journal avec votre texte à la Une !


Tout se passe sur une seule page, avec 3 clics :

Vous donnez :

* un nom à votre journal,

* un nom à votre article

* vous tapez un texte

*et vous cliquez sur "Generate".

Votre journal s'affiche, il ne reste plus qu'à le sauvegarder sur votre ordi pour pouvoir l'insérer ensuite dans un article de votre blog !



 


 

  * 5 articles a lire pour demarrer votre blog
* Initiation au langage HTML
* Tout pour modifier et embellir vos textes
* Tout savoir sur les images 
* Des gadgets
* Votre blog ne ressemblera pas aux autres
* Mes astuces
* Référencements et indexations
* Index des articles


 

                                    Rendez-vous sur Hellocoton !                                                        

 

 

Repost 0
Published by Aurelie - dans Les textes
commenter cet article
2 février 2016 2 02 /02 /février /2016 18:28

Powered By: QUIZYOURFRIENDS.com


Répondez à ce petit Quizz pour vous détendre !
 


 

Si vous voulez publier votre propre Quizz sur votre blog, allez chez
Quiz Your Friend.

Il suffit d'entrer son nom et son adresse mail.

Ensuite, vous choisissez les questions, les réponses, et vous récupérez le code HTML.

Un seul Bémol, pas de personnalisation de l'apparence de votre Quizz !


Pour répondre au Quizz, vous entrez votre nom et c'est parti ! Un commentaire est attribué en fonction de votre score de bonnes réponses.



 


 

  * 5 articles a lire pour demarrer votre blog
* Initiation au langage HTML
* Tout pour modifier et embellir vos textes
* Tout savoir sur les images 
* Des gadgets
* Votre blog ne ressemblera pas aux autres
* Mes astuces
* Référencements et indexations
* Index des articles


 

                                    Rendez-vous sur Hellocoton !                                                        

 

 

Repost 0
10 janvier 2016 7 10 /01 /janvier /2016 18:38

    Your lightning message

 


 

Vous pouvez faire apparaître votre message dans un eclair en allant sur le site  http://www.glassgiant.com/lightning/

 


 

Votre message dans un éclair, les choix

 

Vous pouvez paramétrer :

 

- Le texte de votre message, bien sur. (Pour faire apparaitre un coeur, il suffit de taper @

- le fond (background) : 3 choix, la campagne, la ville ou l'océan

- la couleur de votre texte

- la taille de l'animation (full size pour un grand rectange;e ou small square pour un carré

- la vitesse de l'apparition des lettres (normal ou rapide)

 

 

Your lightning message

 


             

 


 

  * 5 articles a lire pour demarrer votre blog
* Initiation au langage HTML
* Tout pour modifier et embellir vos textes
* Tout savoir sur les images 
* Des gadgets
* Votre blog ne ressemblera pas aux autres
* Mes astuces
* Référencements et indexations
* Index des articles


 

                                    Rendez-vous sur Hellocoton !                                                        

 

 

Repost 0
Published by Aurelie - dans Les textes
commenter cet article
6 janvier 2016 3 06 /01 /janvier /2016 18:37
 
 
 
Un aquarium dans votre écran ? C'est possible de réalisation sa décoration avec un aquarium avec ce petit code.
 
Utilisation de l'aquarium
 
Si vous cliquez un poisson, il se déplace très vite et réapparait ailleurs.
 
Code HTML de l'aquarium
 
Code à coller en mode HTML pour voir apparaitre l'aquarium sur ton écran.
 
<embed src='http://www.crazyprofile.com/fish.swf' quality='high' wmode=Transparent allowScriptAccess="never" width='300' height='300' type='application/x-shockwave-flash' pluginspage='http://www.macromedia.com/go/getflashplayer'/></embed><br><div><a href='http://www.crazyprofile.com/fish_aquarium.asp' target='_blank'><font face='verdana' size=1>Created by Crazyprofile.com</font></a></div>
Articles a revoir

 

  * 5 articles a lire pour demarrer votre blog
* Initiation au langage HTML
* Tout pour modifier et embellir vos textes
* Tout savoir sur les images 
* Des gadgets
* Votre blog ne ressemblera pas aux autres
* Mes astuces
* Référencements et indexations
* Index des articles


 

                                    Rendez-vous sur Hellocoton !                                                        

 

 

Repost 0
3 janvier 2016 7 03 /01 /janvier /2016 15:17

Suite à la demande de certains de mes visiteurs, je vous donne ici le code HTML pour faire apparaître une pluie d'étoiles au bout de votre curseur (ou de votre souris).

 

Particularités du code HTML de la pluie d'étoiles

 

La particularité de ce code est qu'il se suffit à lui-même :

 

- Il ne nécessite pas de charger des photos d'étoiles, comme on peut en trouver sur certains forums. Le code fourni alors ne fonctionne pas si vous n'avez pas les photos (format gif) qui correspondent au code, et enregistrés dans le même répertoire.

 

- Pas besoin non plus d'aller bidouiller dans votre CSS !

 

- Il n'est en aucun cas prévu seulement pour les blogs sur Over-blog. C'est un code HTML, dont, à utiliser où bon vous semble

 

Code HTML de la pluie d'étoiles qui suit le curseur

 

 

 

<script type="text/javascript">
_uacct = "UA-994360-1";
urchinTracker();
</script><script type="text/javascript">
var colour="#7C5B1A";
var sparkles=50;
var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var tiny=new Array();
var star=new Array();
var starv=new Array();
var starx=new Array();
var stary=new Array();
var tinyx=new Array();
var tinyy=new Array();
var tinyv=new Array();
window.onload=function() { if (document.getElementById) {
var i, rats, rlef, rdow;
for (var i=0; i<sparkles; i++) {
var rats=createDiv(3, 3);
rats.style.visibility="hidden";
document.body.appendChild(tiny[i]=rats);
starv[i]=0;
tinyv[i]=0;
var rats=createDiv(5, 5);
rats.style.backgroundColor="transparent";
rats.style.visibility="hidden";
var rlef=createDiv(1, 5);
var rdow=createDiv(5, 1);
rats.appendChild(rlef);
rats.appendChild(rdow);
rlef.style.top="2px";
rlef.style.left="0px";
rdow.style.top="0px";
rdow.style.left="2px";
document.body.appendChild(star[i]=rats);
}
set_width();
sparkle();
}}
function sparkle() {
var c;
if (x!=ox || y!=oy) {
ox=x;
oy=y;
for (c=0; c<sparkles; c++) if (!starv[c]) {
star[c].style.left=(starx[c]=x)+"px";
star[c].style.top=(stary[c]=y)+"px";
star[c].style.clip="rect(0px, 5px, 5px, 0px)";
star[c].style.visibility="visible";
starv[c]=50;
break;
}
}
for (c=0; c<sparkles; c++) {
if (starv[c]) update_star(c);
if (tinyv[c]) update_tiny(c);
}
setTimeout("sparkle()", 40);
}
function update_star(i) {
if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";
if (starv[i]) {
stary[i]+=1+Math.random()*3;
if (stary[i]<shigh+sdown) {
star[i].style.top=stary[i]+"px";
starx[i]+=(i%5-2)/5;
star[i].style.left=starx[i]+"px";
}
else {
star[i].style.visibility="hidden";
starv[i]=0;
return;
}
}
else {
tinyv[i]=50;
tiny[i].style.top=(tinyy[i]=stary[i])+"px";
tiny[i].style.left=(tinyx[i]=starx[i])+"px";
tiny[i].style.width="2px";
tiny[i].style.height="2px";
star[i].style.visibility="hidden";
tiny[i].style.visibility="visible"
}
}
function update_tiny(i) {
if (--tinyv[i]==25) {
tiny[i].style.width="1px";
tiny[i].style.height="1px";
}
if (tinyv[i]) {
tinyy[i]+=1+Math.random()*3;
if (tinyy[i]<shigh+sdown) {
tiny[i].style.top=tinyy[i]+"px";
tinyx[i]+=(i%5-2)/5;
tiny[i].style.left=tinyx[i]+"px";
}
else {
tiny[i].style.visibility="hidden";
tinyv[i]=0;
return;
}
}
else tiny[i].style.visibility="hidden";
}
document.onmousemove=mouse;
function mouse(e) {
set_scroll();
y=(e)?e.pageY:event.y+sdown;
x=(e)?e.pageX:event.x+sleft;
}
function set_scroll() {
if (typeof(self.pageYOffset)=="number") {
sdown=self.pageYOffset;
sleft=self.pageXOffset;
}
else if (document.body.scrollTop || document.body.scrollLeft) {
sdown=document.body.scrollTop;
sleft=document.body.scrollLeft;
}
else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
sleft=document.documentElement.scrollLeft;
sdown=document.documentElement.scrollTop;
}
else {
sdown=0;
sleft=0;
}
}
window.onresize=set_width;
function set_width() {
if (typeof(self.innerWidth)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
}
function createDiv(height, width) {
var div=document.createElement("div");
div.style.position="absolute";
div.style.height=height+"px";
div.style.width=width+"px";
div.style.overflow="hidden";
div.style.backgroundColor=colour;
return (div);
}
// ]]>
</script>

 

 

Ou mettre ce code HTML de pluie d'étoiles

 

Il est à recopier, en mode avancé, HTML, pour votre blog:

 

- dans un article si vous ne le voulez actif que sur un article

 

- en pied de page de votre blog (accueil ET mise en page articles) pour qu'il soit valide partout

 

Limitation du code HTML pour la pluie d'étoiles

 

Ce code étant en Javascript, il ne sera pas accepté par les blogs Over-blog en mode confiance !

 

 

A lire aussi :

Faire tomber des objets en fond d'article sur votre blog

Changer le curseur de la souris sur un article

 


 

  * 5 articles a lire pour demarrer votre blog
* Initiation au langage HTML
* Tout pour modifier et embellir vos textes
* Tout savoir sur les images 
* Des gadgets
* Votre blog ne ressemblera pas aux autres
* Mes astuces
* Référencements et indexations
* Index des articles


 

                                    Rendez-vous sur Hellocoton !                                                        

 

Repost 0
1 janvier 2016 5 01 /01 /janvier /2016 15:15

 

 


 

 

La blaque du jour à mettre sur votre blog

Vous aimez l'humour et les blagues et voulez les partager avec vos visiteurs ? Ce gadget est fait pour vous !

 

Il affiche la "blague du jour", qui change donc tous les jours !

 

 

Code HTML du widget "Blague du jour"

 

<div>
<object type="application/x-shockwave-flash" id="widget-10644" data="http://swf.widgadget.com/wrapper.swf?wid=10644&amp;statsid=10339&amp;langid=es&amp;env=production&amp;cacheServer=widgets&amp;apix=2.0" height="420" width="160" style="outline-style: none; outline-color: invert; outline-width: medium;">
<param name="data" value="http://swf.widgadget.com/wrapper.swf?wid=10644&amp;statsid=10339&amp;langid=es&amp;env=production&amp;cacheServer=widgets&amp;apix=2.0" />
<param name="quality" value="high" />
<param name="allowFullScreen" value="false" />
<param name="bgcolor" value="#000000" />
<param name="allowScriptAccess" value="always" />
<param name="wmode" value="transparent" />
<param name="src" value="http://swf.widgadget.com/wrapper.swf?wid=10644&amp;statsid=10339&amp;langid=es&amp;env=production&amp;cacheServer=widgets&amp;apix=2.0" />
</object>
</div>

 

 

Articles à relire

Le gadget "Alertes pollens"

Mettre des gifs animés sur son blog

Des effets surprenants avec vos photos

Gadget citation du jour & anniversaire de star

 

 

superstickies


 


 

  * 5 articles a lire pour demarrer votre blog
* Initiation au langage HTML
* Tout pour modifier et embellir vos textes
* Tout savoir sur les images 
* Des jeux
* Des gadgets
* Votre blog ne ressemblera pas aux autres
* Mes astuces
* Référencements et indexations
* Index des articles


 

                                    Rendez-vous sur Hellocoton !                                                        

 

 

Repost 0
Published by Aurelie - dans Gadget à blogs
commenter cet article
31 décembre 2015 4 31 /12 /décembre /2015 15:14

Journal-Times-Martiens.jpgEn réalité, mes enfants en train de jouer au PaintBall


 

Si vous voulez créer votre une de journal avec votre photo et votre tire, je vous conseille le site WriteOnIt.

En 3 clics et sans enregistrement préalable sur le site, vous avez votre Une de journal personnalisée :


* Vous choisissez votre couverture de journal : Marie Claire, Gossip, PlayBoy, Times... .

* Clic sur le bouton "Create your cover"

 

* Tapez votre titre (éventuellement un sous-titre) puis chargez la photo que vous voulez utiliser et enfin nommer votre montae dans le champ "Name...".

* Clic sur le bouton "Create your cover"

 

 

* Votre une de journal s'affiche ! Un dernier clic a droite sur "Save your picture" et voilà votre une de journal en format jpeg.  A utiliser ensuite où vous voulez !!

 

 

 

 

 

Une-People.jpg

 

 

 


  * 5 articles a lire pour demarrer votre blog
* Initiation au langage HTML
* Tout pour modifier et embellir vos textes
* Tout savoir sur les images 
* Des gadgets
* Votre blog ne ressemblera pas aux autres
* Mes astuces
* Référencements et indexations
* Index des articles
                                    Rendez-vous sur Hellocoton !                                                        
Repost 0
Published by Aurelie - dans Les images
commenter cet article

Présentation

  • : Faire un blog
  • Faire un blog
  • : Ce blog vous aide à vous lancer pour faire votre blog : plateforme, mise en page, décoration, gadgets...
  • Contact

Vous Cherchez Quoi ?

Bienvenue !

 

PancarteSmiliz.pngCe blog a pour objet de vous aider à faire votre blog. C'est facile, et possible sans être informaticien !

J'ai 2 autres blogs très différents, et je souhaite mettre mon expérience à votre service. N'hésitez pas à me déposer vos commentaires et questioxxns. 
Si vous débutez, commencez par l' Index des articles , rubrique "Pour bien démarrer". 

 

Inscrivez votre site sur ma Top Liste et améliorez votre référencement.  

Mon logo sur votre site

Si j'ai contribué à l'amélioration de votre blog, merci d'y mettre mon logo :
Site Faire Un Blog

Code à coller :

<a href="http://faireunblog.over-blog.com/" target="_blank"><img height="65" width="85" src="http://sd-1.archive-host.com/membres/up/42016049459753927/PancarteSmiliz.png" alt="Site Faire Un Blog" /></a>

 

 

Date du jour

 

 

 

Géolocalisation

formation