Insérer 'Lire la suite...' sur mon site.

Lilou -  
 f60lebaladinverni -
Bonjour,

Je souhaiterai insérer plusieurs bouton 'Lire la suite..' pour masquer les articles trop long.
Exactement comme sur ce site http://www.phototo-tbenezeth.com/2013_08_01_archive.html
Mon site n'est pas encore publier (pas d'hébergeur).
Je le signale parce que j'ai trouvé des code HTML mais fallait avoir l'adresse du site URL...
Je le construis avec webacappella et je n'y est pas trouver de bouton spécial comme surWordPress...
Merci.
A voir également:

6 réponses

_nicolas Messages postés 169 Date d'inscription   Statut Membre Dernière intervention   8
 
<html>
<!DOCTYPE>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title></title>
</head>
<body>
TEXTE<br>
<a href="www.echecs.asso.fr">Lire la suite</a><br>
</body>
</html>
2
animostab Messages postés 2829 Date d'inscription   Statut Membre Dernière intervention   738
 
Ha mince j'avais pas vu, c'est juste un lien et pas du tout un 'Lire la suite..' pour masquer les articles trop long
0
_nicolas Messages postés 169 Date d'inscription   Statut Membre Dernière intervention   8
 
Oui, un lien en fin de page d'article et son doc.html
0
_nicolas Messages postés 169 Date d'inscription   Statut Membre Dernière intervention   8
 
Mais le 'lire la suite est un lien !
0
f60lebaladinverni
 
Peut être en précisant une hauteur définie a ton article => "height: 100px;" dans le css
Ensuite toujours dans le css, préciser de faire défiler ton article car en affichant la suite, la hauteur étant limitée, la fin ne va pas s'afficher :

tonArticle
{
height: 100px;
overflow: auto;
}
1
animostab Messages postés 2829 Date d'inscription   Statut Membre Dernière intervention   738
 
Salut ce que tu cherche a faire ne se fais pas avec html mais avec javascript

voila un pluging jquery qui te fait le truc

https://jedfoster.com/Readmore.js/
0
Lilou
 
Salut Animostab,
Il faut que je télécharge javascript et jquery? Et j'installe sur mon site ou mon ordi?
Ça ne marchera pas alors si je colle les codes (si ça marche avec des codes?!) dans une fenêtre HTML de mon site. Je fais comment pour implanter les blocs sur mes pages de site?
Y' a pas des codes ou des boutons tout fais, pour faire très très simple.
Merci;
0
animostab Messages postés 2829 Date d'inscription   Statut Membre Dernière intervention   738
 
Déjà non il n'y a pas de bouton tout fait tu clic et ca marche sur ton site

Deja tu dois être en mode edition de code

la marche a suivre pour integrer ce pluging

tu copie readmore.js et tu le colle dans ton blocnote et tu l'enregistre sous readmore.js
et tu le met à la racine de ton site
https://github.com/jedfoster/Readmore.js/blob/master/readmore.js

ensuite tu colle le code qui suit avant la balise </body> de ta page (normalement c'est la fin de la page)

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

<script src="readmore.js"></script>

<script type = "text/javascript">
$('article').readmore();
</script>

si ton texte est dans une balise <article> c'est bon
si ton texte est dans une div avec une class
ex <div class="texte">

tu devra mettre à la place
<script type = "text/javascript">
$('.texte').readmore();
</script>

tu peux dans readmore.js modifier les options
https://github.com/jedfoster/Readmore.js/blob/master/README.md#the-options
0
tryan44 Messages postés 1288 Date d'inscription   Statut Membre Dernière intervention   220
 
Perso., je l'aurais fait en PHP car visiblement il sagit plus d'une troncature que d'un plugin qui cache une partie du texte (sur le site mentionné dans le premier poste).
Voici un exemple de troncature » http://forum.creer-un-site.fr/creer-un-site-825-creer-lien-quot-lire-suite-quot#p6077
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
lilou
 
Salut!
Bon J'avance petit à petit...
Sur le site:
http://les-nouvelles-ficelles-d-annak.blogspot.fr/2010/07/ouvrir-et-fermer-un-texte-lire-la-suite.html
Cela ressemble à ce que je veux faire.
Mais... Premier point tout mon texte est tapé à la suite,il y a bien les espaces mais pas le 'à la ligne' et saut de ligne. Ça me fait un gros bloc! Pas terrible niveau visuel.
Deuxième point, je peux afficher le texte cacher, mais impossible de le remettre en cache une fois lu 'ouvert'. Il doit me manquer un petit code html...
Troisième point, peut-on changer la taille, la couleur et la police du texte taper?
Merci, pour vos réponses.
0
_nicolas Messages postés 169 Date d'inscription   Statut Membre Dernière intervention   8
 
Hahaha, oui, je vois ton problème, utilise la balise <br> à la fin de ta ligne puis saute de ligne et écris !
0
Alko
 
Surtout pas !
Dans toute bonne typographie il faut utiliser la justification. En html cela se fait avec le CSS, les saut de ligne d'un texte global sont à proscrire pour plusieurs raisons et ne donneront pas une visualisation correcte puisqu'un saut de ligne ne tient pas compte de la longueur de la ligne affichée par l'utilisateur qui seront forcément différente(je parle pour un texte de plus de 3 lignes) en focntion de la résolution écran, de la taille de l'écran du navigateur et du zoom ou pas utilisé dans le navigateur...
Bref pour les justifications avec CSS il y a
text-align:left;
text-align-right;
text-align:center;
text-align-justify;

Pour une meilleure justification on peut utiliser aussi l'équivalent des césures typographiques( word-spacing et letter-spacing) même si c'est pas toujours indispensable utile.
Par contre faire des paragraphes et utiliser des titres de chapitres ou différentes autres séparations est efficace et utile, cela se fait avec les balises HTML adéquate et l'utilisation de la bonne structure sémantique.
0
lilou
 
Bonjour,
J'arrive à faire un texte en html avec 'lire la suite..' et 'réduire'.

Le problème maintenant c'est que lorsque mon texte caché se déroule il se superpose par dessus le texte du dessous (ba oui logique vu que article devient beaucoup plus long....
Donc comment 'pousser' l'article qui suit lorsque j'affiche mon texte en cache?
Merci
0

Discussions similaires