Overblog Suivre ce blog
Editer l'article 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 !                                                        

 

 

Partager cet article

Repost 0
Published by Aurelie - dans Les textes
commenter cet article

commentaires

Belghiti 27/03/2015 03:22

Bonjour ou bonsoir
Je suis parvenu à mettre un scroll texte sur les pages de mon site web encore en construction.
Je vous remercie infiniment pour votre générosité.

medical billing and coding 23/04/2014 14:14

Merci pour ce post! Ce tutoriel a été courte et au point, ce qui est la façon dont je préfère! Je perds la concentration quand il est trop long et commence à glisser sur! J'espère que vous continuez à fournir ces tutoriels.

MATHI 24/02/2011 18:53



Bonjour, tout d'abor je vous remercie pour les astuces que vous nous proposez.


J'ai juste une petite question concernant l'unité de mesure pour la largeur et la hauteur de " l’ascenseur ", si
vous pouviez m'expliquez ? Merci beaucoup


 



Aurelie 24/02/2011 20:39



Par défaut, c'est toujours en pixels. Pour info, mes articles font 600 pixels de largeurs.



trikeur33 29/01/2011 11:59



affectivement je vois pas l'ascenseur!!!! je regarde ça de plus près merci , et bon week-end


trikeur33



trikeur33 28/01/2011 18:16



bonjour je viens de trouver ton site  qui peu m'aider a mettre un ascenceur sur mon blog ,je pense avoir presque réussit!! mais le texte est trop large et l'ascenseur ne fonctionne pas ,
merci si tu peux me donner un conseil


 Amitié  blog (www.trikeur33.com )



Aurelie 29/01/2011 11:24



le texte ne peut pas être trop large puisque l'ascenseur permet justement de le "mettre en forme" à la largeur voulue. par contre, c'est la largeur de l'ascenseur qui ne doit pas excéder celle de
l'endroit où tu le mets. Ajuste avec la valeur du "width" pour la alrgeyur et le "height" de la hauteur.


Sinon, pour vérifier que cela fonctionne, essaie avec moins de texte, vois tu l'ascenseur ?



krystele 08/07/2010 06:35



Bonjour
je passe te souhaiter
une bonne journée
krystele


____________$$_________________$$
_____________$________________$$
_____________$$$_____________$$$
_____________$$$$$___$$____$$$$
______________$_$$$__$$$_$$$_$$
______________$_$$$$$$_$$$$$_$$
_________$$$__$$$$$_$_$$$_$$$$$_$$$
__________$$$$$$$$_$$_$_$$$$$$$$$$$
___________$$_$$$$$$__$__$$$$$$$$
$$$$$$$$$$$$$$__$$__$$$_$_$$$_$$$$$$$$$$$$$$
__$$$$$$_$$$_$$__$$$$$$$$$$__$$_$$$__$$$$$
______$$$$$$$$$$__$$_____$$__$$$$$$$$$$
_________$$$$$$$$$$$_____$$$$_$$$$$$
_______$$$$$______$$$$$$$$______$$$$$
______$$$$$$$$$$$__$$$$$$___$$$$$$$$$$
__________$$$$$$$__$____$$_$$$$$$$
_________$$_$$$_$_$__$$$_$$$$_$$$$$
________$$__$$$$$$_$$$$$$_$$$$$$$_$$
_______$$$$$$$_$$$$$$$$$$$$$$$$$$$$$$$
_____$$$$$_____$$$$$$$$$$$$$$$_____$$$$$
____$$_________$$___$__$$___$$________$$
____________________$$_$
_____________________$$$
_____________________$$
______________________$
________§§§§§§§§§§____$$
______§§§§§§§§§§§§§____$$$
_____§§§§§§§§§§§§§§§____§§§§
_____§§§§§§§§§§§§§§§___§§§§§§
_§§§§_§§§§§§§§§§§§§§§___§§§§
§§§§§§_§§§§§§§§§§§§§§___§§§
_§§§§____§§§§§§§§§§§___§§§§
__§§_________§§§§§____§§§§
_§§________§§§§§§§§§§§§§§
_________§§§§§§§§§§§§§§§
_______§§§§§§§§§§§§§§§
______§§§§§§§§§§§§§§
_____§§§§__§§§§§§§§§
____§§§§___§§§§§§§§§
___§§§§____§§§§§§§§§
___§§§____§§§§§§§§§§
___§§§__§§§§§§§§§§§§§§
___§§§§§§§§§§§§§§§§§§§§§
__§§§§§§§§§§§§§§§§§§§§§§§§
__§§§§§§§§§§§§§§§§§§§§§§§§§
___§§§§§§§§§§§§§§§§§§§§§§§
_______§§§§§§___§§§§§
________§§§§§___§§§§
________§§§§§__§§§§
_______§§§§§§_§§§§§
______§§§§§§___§§§§
_____§§§§§§_____§§§§
_____§§§§§
_____§§§§
_____§§§
____§§§§
___§§§§§
____§§§§
_____§§§§






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