Rubrique actualités

	<div id="actus_liste">
	#ANCRE_PAGINATION
	<ul>
	<BOUCLE_article_detail(ARTICLES){id_rubrique=13} {par date}{inverse}{lang} {pagination 10}>

On travaille sur les articles de la rubrique 13, en les triant pas ordre chronologique inverse (du plus récent au plus ancien), le tout filtré par la langue choisie sur le site, et en sélectionnant 10 articles par page.
Cette boucle SPIP est dans une lite <ul> et les éléments de liste <li> seront donc répétés pour chaque article.

		<li class="hentry">
					<h3 class="entry-title"><a href="#URL_ARTICLE" rel="bookmark">#TITRE</a> </h3>
					[(#TEXTE|couper{80})]

On affiche le titre dans un lien, puis les 80 premiers caractères du texte, obtenus par le filtre |couper{80}.

Il ne reste ensuite plus qu’à fermer l’élément de liste, la liste de la boucle d’affichage, la boucle générale (de détail des articles) étant fermées plus loin de manière à englober le bloc pagination et y générer les liens de pagination.

				</li>
	</BOUCLE_article_detail>
	</ul>
	</div>

style CSS du bloc :

#actus_liste {
	position:absolute;
	top:0;
	left:0;
	width:60%;
	bottom:50px;
	overflow-y:auto;
	padding-left:50px;
}

Le bloc est fixé dans la page, aux bords gauche et haut, à 50 px du bas pour laisser la place au bloc pagination, et ne prend que 60% de la largeur de son conteneur, pour laisser de la place au bloc photo.
Un espace de 50px entre son bord gauche et le contenu permet de l’aérer visuellement, et grâce à la propriété overflow-y:auto, un ascenseur vertical apparaîtra dans ce cadre si besoin est.

On y affiche simplement la pagination correspondant à la boucle de sélection des articles.
Le mot clé #PAGINATION n’étant pas valable en dehors d’une boucle, c’est pourquoi la boucle générale de sélection des articles (<B_article_detail>, à ne pas confondre avec la boucle d’affichage, <BOUCLE_article_detail(ARTICLES){id_rubrique=13}....) se referme plus loin.

	<div id="expos_pagination">[<p class="pagination">(#PAGINATION)</p>]</div>

style CSS du bloc :

#expos_pagination {
	position:absolute;
	height:50px;
	left:0;
	right:10px;
	bottom:0;
	text-align:center;
}

Le bloc est fixé dans la page, aux bords gauche et bas, hauteur limitée à 50px pour ne pas déborder sur le cadre précédent, à 10 px du bord droite pour laisser une marge entre le contenu et le bloc général, son contenu (les liens de paginations) étant justement centré.

ici, une autre boucle SPIP va chercher au hasard une photo (et une seule) dans une rubrique dédiée, laquelle est cachée dans la rubrique 1 ("Accueil"), et non visible directement sur le site.

On travaille sur les articles, de la rubrique 38, en triant par hasard, et en se limitant à un seul élément.
Puis le logo de l’article est ensuite affiché.

	<div id="actus_photo">
	<B_actus_photo>
	<BOUCLE_actus_photo(ARTICLES){id_rubrique=38}{par hasard}{pagination 1}>
			[(#LOGO_ARTICLE)]
	</BOUCLE_actus_photo>
	</B_actus_photo>
	</div>

Style CSS du bloc :

#actus_photo {
	bottom:50px;
	position:absolute;
	top:0;
	right:0;
	width:30%;
}

Le bloc est fixé dans la page, aux bords droit et haut, à 50 px du bas pour laisser la place au bloc pagination, et sa largeur est limitée à 30% de son conteneur, ce qui, avec une largeur de 60% pour son voisin (liste des actualités), laisse 10% de la largeur du bloc général comme marge entre les deux.
L’image du bloc sera traitée par un script JavaScript pour la redimensionner de manière proportionnelle.