CSS pour flux RSS

**delamareuscl** · 19/05/2014, 22h46

bonjour j'ai importer un flux RSS grâce à actifpub et ça marche nickel sauf que ça me prend toute la largeur de ma page et j'ai beau definir une balise <p> pour modifier le style.css après ça ne marche pas du tout ... je ne vois pas comment faire....

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
echo "<p>";
$member=""; //optionnel si vous etes inscrit sur la plateforme actifpub  le parametrage se fait dans votre espace membre
$fichier="http://www.lequipe.fr/rss/actu_rss_Football.xml";
$limite="1";  // sujets compris entre 1
$limite1="10";   //  et plus
$aspect="1";  //  0 ou 1 (1 permet d'afficher lien + description, 0 que les liens)
$minute="1";  //  0 ou 1 (1 permet d'afficher date et heure, 0 pas de date et heure)
$sujet="1"; //  0 ou 1 (1 permet d afficher le titre des sujets traités, 0 pas de titre )
$te="Georgia, serif";  // Police de caractères (Verdana, arial etc...)
$fil_textsize="10"; // taille des liens et description
$title_textcolor="000000"; // couleur des liens (000000 donne noir)
$tlien="underline"; // style du lien none ou underline
$text_textcolor="FFFFFF";  // couleur description (000000 donne noir)
$frame_color="F90505"; // couleur arrière plan (FFFFFF donne blanc)
$content="1"; // 0 ou 1 comme paramètre optionnel, 1  format html,  0  format texte
$extract="";  // laisser vide ou indiquez le nombre de caractères que vous souhaitez garder dans le corps du flux
$cache="15"; // gestion du cache exprimée en minutes - en fonction de la fréquence de mise à jour
$fichier="http://www.actifpub.com/rss.php?fichier_AP_=$fichier&limite_AP_=$limite&limite1_AP_=$limite1&fil_textsize_AP_=$fil_textsize&text_textcolor_AP_=$text_textcolor&title_textcolor_AP_=$title_textcolor&frame_color_AP_=$frame_color&te_AP_=$te&aspect_AP_=$aspect&minute_AP_=$minute&sujet_AP_=$sujet&content_AP_=$content&tlien_AP_=$tlien&cache_AP_=$cache&extract_AP_=$extract&member_AP_=$member";
 
$fichier=str_replace(" ","+",$fichier);
$ch = curl_init($fichier);
curl_setopt ($ch, CURLOPT_URL, "$fichier");
curl_setopt($ch, CURLOPT_HEADER, 0);
curl_setopt($ch, CURLOPT_USERAGENT, $useragent);
curl_setopt ($ch, CURLOPT_CONNECTTIMEOUT,7);
curl_setopt ($ch, CURLOPT_TIMEOUT,25);
curl_setopt($ch, CURLOPT_RETURNTRANSFER,1);
$affiche_contenu=curl_exec($ch);
curl_close ($ch);
echo  $affiche_contenu;
echo "</p>";

Merci d'avance ^^

**Muchos** · 20/05/2014, 01h49

Bonjour,

À quoi ressemble le code HTML généré (un seul élément du flux suffira)? Qu'avez-vous mis comme règle CSS pour la mise en forme du flux?

**delamareuscl** · 20/05/2014, 09h20

Voici le code source que mon php génère :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
<html>
<head>
	<link rel="icon" type="image/png" href="../images/Maillot.png"/>
	<link href="../Style.css" type="text/css" rel="stylesheet">
	<script type="text/javascript" src="menu.js"></script>
	<title>le site de l'USCL</title>
</head>
<body>
	<ul id="menu">
		<li>
			<a id="fleche" href="../Pages/Acceuil.php">Accueil</a>
		</li>
		<li>
			<a href="../Pages/Contact.php">Contact</a>
		</li>
		<li>
			<a href="#">club</a>
			<ul>
				<li>
					<li><a href="../Pages/Bureau.php">Bureau</a></li>
				</li>
			</ul>
		</li>
		<li>
			<a href="#">Mediathèque &or; </a>
			<ul>
				<li><a href="../galerie/index.php">Photos</a></li>
				<li><a href="#">Vidéos</a></li>
			</ul>
		</li>
		<li>
			<a href="#">Infos & Résumés &or; </a>
			<ul>
				<li><a href="#">Equipe A</a></li>
				<li><a href="#">Equipe B</a></li>
			</ul>
		</li>
		<li>
			<a href="#">R&eacute;sultat</a>
			<ul>
				<li><a href="../Pages/ResultatA.php">Senior A</a></li>
				<li><a href="../Pages/ResultatB.php">Senior B</a></li>
				<li><a href="../Pages/ResultatU18.php">U18</a></li>
				<li><a href="../Pages/ResultatU15.php">U15</a></li>
				<li>
				<a href="#">U13</a>
					<ul>
						<li><a href="../Pages/ResultatU13GA.php">Groupe A</a></li>
						<li><a href="../Pages/ResultatU13GB.php">Groupe B</a></li>
					</ul>
				</li>
				<li><a href="../Pages/ResultatU11.php">U11</a></li>
				<li><a href="../Pages/ResultatVeteran.php">Veteran</a></li>
			</ul>
		</li>
		<li>
			<a href="#">Divers</a>
			<ul>
				<li><a href="../Pages/ClassementButeur.php">Classement des buteurs</a></li>
			</ul>
		</li>
		<li>
			<a href="https://www.facebook.com/usclfoot" target="_blank"><img src="../images/fb.png" alt="canard"/ height = 30px width = 30px></a>
		</li>
	</ul>
&nbsp;
<br>
<p><div style="background-color:#F90505;"><span style="font-family:Georgia, serif;font-size:10px;color:#FFFFFF;text-decoration:none;"><i><b>L'Equipe.fr Actu Football</b></i><span><br /><br /><a style="font-family:Georgia, serif;font-size:10px;color:#000000;text-decoration:underline;" href="http://www.lequipe.fr/Football/Actualites/Renard-pas-encore-fixe/466801#xtor=RSS-1" target="_blank">Foot - L1 - Renard pas encore fixé</a><br /><span style="font-family:Georgia, serif;font-size:10px;color:#FFFFFF;">

En ce qui concerne le css j'ai juste essayé un margin-left:200px; mais rien ne fonctionne.

Merci d'avance

**Muchos** · 20/05/2014, 15h57

En ce qui concerne le css j'ai juste essayé un margin-left:200px; mais rien ne fonctionne.

Qu'il soit dans une DIV (ce qui est apparement le cas à la base) ou dans une P (comme vous le souhaitez), la largeur se gère avec la propriété WIDTH.

Voici le code source que mon php génère

D'abord, vous devriez utiliser un DOCTYPE (ex: <!DOCTYPE html>)

Ensuite, si je comprends bien, le code de votre flux généré est:

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
<p>
  <div style="background-color:#F90505;">
    <span style="font-family:Georgia, serif;font-size:10px;color:#FFFFFF;text-decoration:none;">
    <i><b>L'Equipe.fr Actu Football</b></i>
    <span><br /><br /><a style="font-family:Georgia, serif;font-size:10px;color:#000000;text-decoration:underline;" href="http://www.lequipe.fr/Football/Actualites/Renard-pas-encore-fixe/466801#xtor=RSS-1" target="_blank">Foot - L1 - Renard pas encore fixé</a><br />
<span style="font-family:Georgia, serif;font-size:10px;color:#FFFFFF;">

S'il est bien recopié, ce code est invalide.

**delamareuscl** · 20/05/2014, 16h05

Pourquoi ce code est invalidé alors que le flux génère bien les actualités?

**Muchos** · 20/05/2014, 16h17

Ou plutôt: pourquoi ce code génère bien les actualités alors qu'il est invalide? Parce que HTML est un langage permissif et que les navigateurs s'adaptent assez bien aux manques dans le code.

**delamareuscl** · 20/05/2014, 16h25

Oui je suis d'accord avec vous pourquoi vous dites que le code est invalide? En quoi l'est il?

**Muchos** · 20/05/2014, 17h08

Vous le saurez avec le validateur HTML du W3C.

**delamareuscl** · 20/05/2014, 17h30

Oui en effet j'ai 71 erreur et 22 warning.... :/

**delamareuscl** · 20/05/2014, 19h43

Nom : Sans titre 2.jpg
Affichages : 663
Taille : 142,9 Ko

Bon je pense que je vais tout reprendre à 0, pourriez vous me guider pour obtenir un resultat comme sur la photo?!?

Merci d'avance =)

**Muchos** · 20/05/2014, 21h41

Comme vous êtes sans doute plus familier du PHP que de HTML/CSS, je vous propose un snippet de base (en HTML5), à adapter et alimenter

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8" />
  <title>Test - Mon flux RSS</title>
</head>
<body>
<aside class="rss">
<h2>Mon flux rss</h2>
<dl>
  <dt><time datetime="2014-05-20">20 mai</time></dt>
  <dd><a href="#2">Deuxième info</a></dd>
  <dt><time datetime="2013-09-29">29 septembre</time></dt>
  <dd><a href="#1">Première info</a></dd>
</dl>
</aside>
</body>
</html>

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
.rss {
  width: 25%;
  /* Largeur du flux RSS */
  border-bottom: medium solid #E65C00;
  font-size: 80%;
  line-height: 2em;
  background: #EEE;
}
.rss h2 {
  text-align: center;
  background: #E65C00;
  color: #EEE;
}
.rss dt {
  float: left;
  margin-right: 1ex;
  font-weight: bold;
  color: #E65C00;
}
.rss dt::after {
  content: " — ";
  color: #000;
}
.rss a {
  text-decoration: underline;
  color: #000;
}

**delamareuscl** · 20/05/2014, 21h50

Merci c'est très gentils mais je ne peux pas l'adapter avec un lien rss tel que http://www.lequipe.fr/rss/actu_rss.xml...
ce que vous me proposer c'est de tout rentrer en dur? sauf que ce n'est pas l'interet du rss :/

**Muchos** · 20/05/2014, 23h02

Ce n'est pas à moi de bosser

Vous avez un script PHP qui récupère le contenu de votre flux et l'affiche dans votre page en HTML. Sauf que le contenu est mal structuré. Tout ce que je vous propose, c'est un exemple de balisage possible pour structurer ce contenu et une mise en forme CSS proche de vos souhaits. La partie PHP, ce n'est pas mon rayon.

CSS pour flux RSS

CSS

Discussions similaires

Partager

Partager