Overblog
Suivre ce blog Administration + Créer mon blog
25 mai 2014 7 25 /05 /mai /2014 16:41

Marquee Tag - http://www.marqueetextlive.com
 

Un texte qui défile attire toujours l'oeil du visiteur !


 

Le défilement de texte avec la balise "Marquee"

  

Le défilement se fait en langage HTML avec la balise "Marquee".Pour relier mes articles sur l'utilisation de cette balise :

  

Langage HTML : Principales propriétés, descriptions et valeurs

Faire défiler un texte : balise MARQUEE

 

 

 

 

Code HTML automatique de votre texte défilant

  

Je vous propose d'aller sur MarqueeTextLive.com pour générer automatiquement votre code HTML de texte défilant.

 

Vous y choisissez :

 

* Votre "Text" : taper le texte qui doit défiler

* votre "Font" : police d'écriture

* votre "Font size" : taille de la police

* votre Text color : couleur de votre texte

* Direction : direction de défilement : droite vers gauche ou gauche vers droite

* Marquee behavior : type de défilement : alterné, apparition

* Animation speed : vitesse du défilement (en ms)

 

A vous de jouer maintenant !!!

 

 

Myspace Marquee Text - http://www.marqueetextlive.com
 

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 !                                                        

 

Partager cet article
Repost0
28 avril 2014 1 28 /04 /avril /2014 08:58

Dynamic Animal Text Generator at TextSpace.net

 

 


 

 Ecrire avec une décoration d'animal d'afrique, c'est rigolo !

 

Ou créer son texte avec déco animaux

 

C'est ce que je vous propose de faire sur le site Textspace.com

 

 

Comment créer son texte décoré

 

Vous n'avez qu'à choisir la déco, taper votre texte.

 

Vous avez aussi certaines options comme l'alignement, l'ombrage...

 

Le résultat est directement visible avec le bouton "Make my text".

 

 

Comment récupérer le code HTML de votre texte animalier

 

Si cela vous convient, un clic sur le bouton "Get the codes" et voilà.

 

 

 

 

Dynamic Animal Text Generator at TextSpace.net

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 !                                                        

 

 

Partager cet article
Repost0
15 mars 2014 6 15 /03 /mars /2014 11:35

 

 

 

 

Un petit génétrateur de graffitis avec CrazyProfile !
 
Création du ton graffiti
 
Tous les curseurs sont là pour faire tes réglages, visibles en temps réel.
Amuse-toi à tout essayer.
Un clic sur le boutron "Get HTML Code" pour récupérer le code HTML de ton graffiti
 
 
A voir aussi

 

Faire un lien avec une image 

Toutes les informations sportives sur votre blog 

Créer votre pièce Euro à votre valeur  


 

  * 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 !                                                        

 

 

Partager cet article
Repost0
16 février 2014 7 16 /02 /février /2014 18:12
Apprendre
à faire
une liste défilante
qui s'arrete
au survol de la souris
Lisez cet article !



1. Faire une liste défilante verticale

Les listes défilantes sont utiles si on souhaite afficher un grand nombre d'éléments d'une même rubrique, sans pour cela prendre trop de place à l'écran.

La liste défilante a aussi l'avantage d'être mobile, et donc d'attirer l'oeil du visiteur !



2. code HTML

2.1 Balise MARQUEE

Le principe du défilement se fait avec la balise MARQUEE, dont on a déjà parlé.
Revoir les informations complètes sur la balise de défilement MARQUEE ICI.

Il faut absolument lui donner un sens de défilement vertical, avec l'information de direction "UP".
Le code minimum à insérer est donc :

<marquee behavior="scroll" direction="up"
.....
</marquee>


2.2 Arrêter le défilement au survol de la souris

Pour faciliter la lecture de la liste, il est fortement conseillé d'offrir la possibilité d'arrêter son défilement, quand la souris de votre visiteur passe par dessus.

Pour cela, ajouter à votre code :

onmouseover="this.stop()"
onmouseout="this.start()"



2.3 Les éléments de la liste

A la fin de chaque élément, on ajoutera <br /> pour demander un retour à la ligne (sauf pour le dernier).

Les élements de votre liste seront donc à inscrire ainsi :

Element 1<br/>
Elément 2<br/>
Elément 3<br/>
...
Dernier élément



2.4 La taille d'affichage de la liste

Height définit la hauteur de votre liste, et Width sa largeur.

Il est conseillé de définir une largeur suffisante pour que chaque élément puisse être affiché en entier dans sa largeur !


2.5 La vitesse de défilement

Vous connaissez déjà cette information si vous avez lu l'article sur les balises MARQUEE, il s'agit de  scrollamount et scrolldelay

2.6 Synthèse

Le code complet à copier en édition avancé dans votre article ou votre module est :

<marquee behavior="scroll" direction="up" height="200" width="400" scrollamount="1" scrolldelay="1"
onmouseover="this.stop()" onmouseout="this.start()"

<p>

Element 1 de la liste<br />
Element 2 de la liste<br />
Element 3 de la liste<br />
Element 4 de la liste
<br />
..............................<br />
</p>
</marquee>

où vous remplacez les éléments de la liste par les vôtres. 

3 Exemple complet d'une liste vertical défilante

3.1 La liste défilante

 

 
Les compteurs de visites
Image changeante au survol de la souris
Mon blog passe à la télévision !
Connaître l'adresse URL de ses documents
Enregistrer vos images pour votre blog
Mettre une photo en fond d'article (ou de module)
Tout comprendre sur le flux RSS
Votre site en page de démarrage
les 5 règles d'Or pour construire votre site web
Mettre une horloge sur votre blog


3.2 Le code complet de cette liste défilante :


<marquee scrolldelay="1" scrollamount="3" width="400" height="200" direction="up" onmouseout="this.start()" onmouseover="this.stop()"><span style="font-family: comic sans ms,sans-serif;"><span style="font-size: 10pt;">Les compteurs de visites<br />Image changeante au survol de la souris<br />Mon blog passe &agrave; la t&eacute;l&eacute;vision !<br />Conna&icirc;tre l'adresse URL de ses documents<br />Enregistrer vos images pour votre blog<br />Mettre une photo en fond d'article (ou de module)<br />Tout comprendre sur le flux RSS<br />Votre site en page de d&eacute;marrage<br />les 5 r&egrave;gles d'Or pour construire votre site web<br />Mettre une horloge sur votre blog</span></span></marquee>



 

                                        Rendez-vous sur Hellocoton !

 

Partager cet article
Repost0
29 novembre 2013 5 29 /11 /novembre /2013 10:55


 




1. Votre texte avec effet scintillant


Une décoration de blog sympa et qui attire l'oeil : Des textes avec effet scintillant (appelés aussi "Glitter"), comme ci-dessus.

Encore un effet qui permet de vous différencier des autres, d'apporter un peu de gaieté et de couleur sur vos articles.

Comme tous les effets, il ne faut pas non plus en abuser !


 

2. Code HTML

Beaucoup de sites proposent de vous mettre un effet glitter sur vos textes.

Je vous cite, entre autres, celui de TonGif, car il est gratuit et n'amène pas de fenetres publicitaires.

Vous tapez votre texte, puis demandez le code HTML, et vous le recopiez dans votre article.


3. Demandez-moi votre effet Glitter en commentaire

Si vous préférez, je peux aussi vous fournir votre code. Dans ce cas, postez-moi un commentaire sur cet article  avec votre texte, et je répond avec votre code personnalisé !


 


 




 

                                      Rendez-vous sur Hellocoton !                                                   

 

Partager cet article
Repost0
20 novembre 2013 3 20 /11 /novembre /2013 17:36

Faire un Blog 

 Voici un site très sympa pour créer vos logos :  CoolText.com.


 

 

Les styles de logo personnalisé avec CoolText

 

Il existe plus de 30 styles différents pour enjoliver votre texte :

 

* Nova pour celui utilisé pour "Faireunblog"

* Slab pour "Merci pour vos commentaires"

* Cool Metal pour "Joli non ? "

 

 

Comment créer son logo

 

* Aller sur le site de CoolText.com

* Un clic sur le style choisi

* Personnaliser votre logo :

   - Logo text pour votre Texte

   - Font pour la police d'écriture

   - Font size pour la taille

   - Text color, Start color, End color pour les couleurs choisies : du texte, de départ et de l'arrivée (si dégradé)

   -  File format : je vous conseille de prendre un gif, c'est ce qui est acepté le plus couramment en format d'images chez les hébergeurs.

* Clic sur "Render Logo" une fois fini.

* Vous voyez alors votre oeuvre. Si c'est OK, clic sur "Get HTML code", ou bien "Download Image" pour une sauvegarde sur votr PC.

 

Les demandes du site CoolText pour créer votre logo

 

Le site vous demande :

 

* de vous enregistrer (vous donnez votre mail et un mot de passe)

* de mettre un lien vers leur site à chaque fois que vous utilisez une de leur création.

 

Voici pour exemple leur logo à apposer, avec son code :

Cool Text: Logo and Graphics Generator

<a href="http://cooltext.com" target="_top"><img src="http://cooltext.com/images/ct_button.gif" width="88" height="31" alt="Cool Text: Logo and Graphics Generator" /></a>

 

* Clic sur "I gree" si vous êtes OK, et vous récupérez le code HTMLde votre logo.

 

 

Joli non ? 

 

Merci pour vos commentaires ! 

 


 

  * 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 !                                                        

 

Partager cet article
Repost0
21 octobre 2013 1 21 /10 /octobre /2013 14:41

 

Image by FlamingText.com

 

 


 

 

On fait cela sur le site FlamingText !

 

 

Faire son texte ou logo enflammé

 

Regardez tout en haut à droite du site

 

Tapez votre texte dans "Set your name On" puis un clic sur "Create Fire"

 

Il faut ensuite s'inscrire pour obtenir le code HTML de votre texte en flammes !

 

 


 

  * 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 !                                                        

 

Partager cet article
Repost0
6 septembre 2013 5 06 /09 /septembre /2013 16:44

 


 

Les caractères spéciaux

 

Les caractères spéciaux sont utiles pour mettre en valeur unt exte, et même l'agrémenter de petits dessins.

Attention toutefois, ces caractères ne sont en général pas pris en compte par les outils de traduction en ligne !

 

Comment générer des caractères spéciaux

 

Ce gadget vous permet de générer des caractères spéciaux en 1 clic

 

Pour les utiliser, il suffit de faire un double clic sur le caractère choisi.

Ensuite, vous le collez (CTRL + V) où vous voulez.

 

Comment mettre ce générateur sur votre blog

Recopier en mode HTML, le code du gadget "générateur de caractères spéciaux" 

 

<img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://counters.gigya.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEyNzczODM*NDcxODcmcHQ9MTI3NzM4MzQ1MzQzNyZwPTIyMzA1MiZkPSZnPTImbz*3YzllMDJjNjU1YWU*NGYxYTQ4/ZDlkY2EzNzZjZmUwZCZvZj*w.gif" /><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" width="300" height="324" id="WFHost"><param name="FlashVars" value="partner=223052&symID=DefaultButton_Bottom&URL=http%3a%2f%2fwidgia.com%2fwidgets%2fweird_text_maker%2fweird_text_maker.swf&useFacebookMystuff=false&defaultPreviewURL=&WFBtnY=300&WFBtnX=113&stickyType=bottom&widgetY=0&widgetX=0&widgetH=300&widgetW=300&theme=Ocean%20Blue"/><param name="wmode" value="transparent"/><param name="allowScriptAccess" value="always" /><param name="movie" value="http://cdn.gigya.com/wildfire/swf/WildfireHost.swf" /><embed name="WFHost" id="WFHost" width="300" height="324" src="http://cdn.gigya.com/wildfire/swf/WildfireHost.swf" flashvars="partner=223052&symID=DefaultButton_Bottom&URL=http%3a%2f%2fwidgia.com%2fwidgets%2fweird_text_maker%2fweird_text_maker.swf&useFacebookMystuff=false&defaultPreviewURL=&WFBtnY=300&WFBtnX=113&stickyType=bottom&widgetY=0&widgetX=0&widgetH=300&widgetW=300&theme=Ocean%20Blue" AllowScriptAccess="always" quality="high" wmode="transparent" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /></object>

 


 

  * 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 !                                                        

 

Partager cet article
Repost0
5 septembre 2013 4 05 /09 /septembre /2013 10:51


LIEN VERS L'INDEX DES ARTICLES


1. Qu'est-ce qu'un lien ?

Un lien est un élément de votre article (le plus souvent un texte) sur lequel votre visiteur peut cliquer. Alors, il est redirigé vers l'endroit où pointe ce lien.

Si vous cliquez sur mon lien en haut de cet article, vous allez être redirigé vers l'index de ce blog.


2. Code HTML des liens

2.1 Balise HTML pour faire un lien



La balise principale de lien est l'ancre : a
suivie de l'endroit où pointe ce lien, sous la forme :

href=......

L'ancre est la balise utilisée pour les liens hypertexte.


2.2 Code html d'un lien avec texte

le code HTML minimum de votre lien est donc :

<a href=”...”>Texte de votre lien</a>.

où vous complétez l'adresse de renvoie après href=" et remplacez "Texte de votre lien" par votre texte.


2.3 Les compléments au code HTML

Vous pouvez bien-sûr compléter votre code avec de la mise en forme pour votre texte, avec les balises habituelles :

color pour la couleur du texte
font-family pour la typo
font-size pour sa taille
texte-align pour la position du texte
 title  pour l'info bulle
target="_blank" si vous voulez que votre lien s'ouvre dans une nouvelle fenetre


2.4 Exemple du lien en haut de cet article

Son code complet est :


<p style="text-align: center;"><br />
<a title="Lien vers l'index du Blog &quot;Faire un Blog&quot;"
href="
http://faireunblog.over-blog.com/pages/Index_des_articles-2008144.html" target="_blank"><em>
<span style="color: #0000ff;"><strong><span style="font-family: comic sans ms,sans-serif;">
<span style="font-size: 12pt;">LIEN VERS L'INDEX DES ARTICLES<br />
</span></span></strong></span></em></a><br /><br /></p>



5. Conseils pour vos liens texte :

* Le texte du lien doit décrire brièvement le contenu de la page de destination.

* La mise en forme du lien doit être différente de celle du contenu de l'article, afin d'être reconnaissable.

 


 

  * 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 !                                                        

 

Partager cet article
Repost0
30 juillet 2013 2 30 /07 /juillet /2013 15:35

Voici la méthode pour faire défiler un texte à l'écran :


1. Mode avancé, HTML

Après avoir tapé votre texte, il vous faut aller en
mode HTML.

Allez voir cet article pour savoir comment faire



2. Balise Marquee

Les balises à ajouter à votre texte sont les balises
MARQUEE


3. Syntaxe :

Il faut ajouter, avant votre texte : <marquee> et
</marquee> après le texte.

Exemple : si je tape, en mode html :

<marquee>Bonne journée à vous</marquee>,

cela donne


Bonne journée à vous



4. Les paramètres optionnels

Vous pouvez ajouter des paramètres pour modifier le défilement ; en voici quelques uns

Paramètre balise MARQUEE

Action

possibilités

Behavior Indique le type de défilement :  Scroll : mode par défaut
Alternate : alterné
Direction Indique la direction du défilement Left : gauche à droite
Right : droite à gauche 
Down : Bas
Up : Haut

Vous pouvez définir la plage
si vous utilisez Up et Down en ajoutant height="x" en nbre de pixels
Scrollamount Vitesse de défilement, en pixels à indiquer en pixels, minimum 1
Scrolldelay Vitesse de défilement en millisecondes  
Loop Nombre de défilements -1  : pour 1 seule
x : nombre de défilements
Infinite : pour continuel
OnmouseOut A utiliser avec celui du dessous, afin d'arréter
le défilement au survol de la souris,
puis le reprendre.
Indiquer "this.start();"
OnMouseOver   Indiquer "this.stop();"



5. Exemple complet de syntaxe d'un texte défilant

<marquee behavior="alternate" direction="up" scrollamount="5" scrolldelay="20" loop="-1" onmouseover="this.stop();" onmouseout="this.start();">Cliquer pour arrêter le défilement.</marquee>


Cliquer pour arrêter le défilement.


                                        

Rendez-vous sur Hellocoton !

Partager cet article
Repost0

Présentation

  • : 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