Una primera versión de la página de inicio

Comenzamos a tener una idea más precisa de la navegación de nuestro sitio. Realizamos una primera versión de la página de inicio.

<html>
<head>
<title>[#NOM_SITE_SPIP] Inicio</title>
</head>
<body>

<center>
<a href="sorties.php3">Las próximas salidas</a>
| <a href="notes.php3">Los mejores juegos del momento</a>
</center>

	<BOUCLE_secteurs(RUBRIQUES){id_parent=0}{par titre}>
		<p><b><a href="#URL_RUBRIQUE">#TITRE</a></b>
		
		<B_sous_rubriques>
		<ul>
		<BOUCLE_sous_rubriques(RUBRIQUES){id_parent}>
			<li><a href="#URL_RUBRIQUE">#TITRE</a>
		</BOUCLE_sous_rubriques>
		</ul>
		</B_sous_rubriques>
		
	</BOUCLE_secteurs>	

</body>
</html>

Antes de colocar los bucles que permitirán mostrar las novedades del sitio, nos contentamos con crear (a mano) los vínculos hacia las dos páginas de inicio alternativas, y a mostrar su estructura (solamente las grandes secciones y sus subsecciones).

Instalamos la lista de las cinco pruebas publicadas más recientemente en nuestro sitio. Para cada una, indicaremos (además del logotipo, del título de la prueba, y su descripción):

-  un bucle (RUBRIQUES) para recuperar el título del juego;
-  un bucle con (MOTS) por cada tipo de palabra «nota» para mostrar la nota;
-  un segundo bucle con (MOTS) por cada tipo de palabra «máquina» para mostrar el logotipo de las máquinas correspondientes.

Nada que no sepamos hacer ya.

<BOUCLE_tests(ARTICLES){titre_mot=test}{par date}{inverse}{0,5}>
	<p><div style="border:1px solid black">
	[(#LOGO_ARTICLE_RUBRIQUE|left|#URL_ARTICLE)]

	<BOUCLE_rub_tests(RUBRIQUES){id_rubrique}>
	<h3>#TITRE</h3>
	</BOUCLE_rub_tests>

	<h4>#TITRE</h4>
	
	<BOUCLE_note_tests(MOTS){id_article}{type=Nota}>
	<b>NOTE : #TITRE/10</b><p>
	</BOUCLE_note_tests>
	
	<BOUCLE_mac_tests(MOTS){id_article}{type=Máquinas}>
	[(#LOGO_MOT|left)]
	</BOUCLE_mac_tests>
		
	[(#DESCRIPTIF)]
	<p align="right"><a href="#URL_ARTICLE">Leer este test...</a>
	</div>
</BOUCLE_tests>

Añadamos ahora los cinco últimos previsionados, cinco soluciones y cinco trucos. Las presentaciones son diferentes cada vez, pero el principio es rigurosamente similar al bucle anterior (en versiones simplificadas, puesto que queremos mostrar menos información):

<B_previews>
<p><b>Previsionados :</b>
<ul>
<BOUCLE_previews(ARTICLES){titre_mot=previsionados}{par date}{inverse}{0,5}>
	
	<BOUCLE_rub_previews(RUBRIQUES){id_rubrique}>
	<li><b>#TITRE</b> /
	</BOUCLE_rub_previews>

	<a href="#URL_ARTICLE">#TITRE</a>
	
	<BOUCLE_mac_previews(MOTS){id_article}{type=Máquinas}>
	[(#LOGO_MOT)]
	</BOUCLE_mac_previews>

</BOUCLE_previews>
</ul>
</B_previews>

<B_soluces>
<p><b>Soluciones :</b>
<ul>
<BOUCLE_soluces(ARTICLES){titre_mot=soluciones}{par date}{inverse}{0,5}>
	
	<BOUCLE_rub_soluces(RUBRIQUES){id_rubrique}>
	<li><b><a href="#URL_ARTICLE">#TITRE</a></b>
	</BOUCLE_rub_soluces>
	
	<BOUCLE_mac_soluces(MOTS){id_article}{type=Máquinas}>
	(#TITRE)
	</BOUCLE_mac_soluces>

</BOUCLE_soluces>
</ul>
</B_soluces>


<B_astuces>
<p><b>Trucos :</b>
<ul>
<BOUCLE_astuces(ARTICLES){titre_mot=trucos}{par date}{inverse}{0,5}>
	
	<BOUCLE_rub_astuces(RUBRIQUES){id_rubrique}>
	<li><b><a href="#URL_ARTICLE">#TITRE</a></b>
	</BOUCLE_rub_astuces>
	
	<BOUCLE_mac_astuces(MOTS){id_article}{type=Máquinas}>
	(#TITRE)
	</BOUCLE_mac_astuces>

</BOUCLE_astuces>
</ul>
</B_astuces>

Finalmente, la lista de las novedades. Siempre el mismo principio; esta vez, el vínculo de hipertexto apunta hacia la página común a las novedades de un juego. El vínculo se hace sobre el título del juego (es decir, el título de la sección), y mostramos el título de la novedad.

<B_news>
<p><b>Novedades :</b>
<ul>
<BOUCLE_news(ARTICLES){titre_mot=novedades}{par date}{inverse}{0,5}>
	
	<BOUCLE_rub_news(RUBRIQUES){id_rubrique}>
	<li><b><a href="news_jeu.php3?id_rubrique=#ID_RUBRIQUE">#TITRE</a>:</b>
	</BOUCLE_rub_news>
	#TITRE
	
</BOUCLE_news>
</ul>
</B_news>

Nos queda ahora indicar la estructura temática del lugar (por la clase de juego más amplia: Acción/aventura, Plataforma, Deporte...). Nada que sea complicado:

<BOUCLE_secteurs(RUBRIQUES){id_parent=0}{par titre}>
		<p><b><a href="#URL_RUBRIQUE">#TITRE</a></b>
		
		<B_sous_rubriques>
		<ul>
		<BOUCLE_sous_rubriques(RUBRIQUES){id_parent}>
			<BOUCLE_art_sous(ARTICLES){id_rubrique}>
			</BOUCLE_art_sous>
			<li><a href="#URL_RUBRIQUE">#TITRE</a>
			<//B_art_sous>
		</BOUCLE_sous_rubriques>
		</ul>
		</B_sous_rubriques>
		
	</BOUCLE_secteurs>

Señalemos no obstante esta sutileza: en las subsecciones, el BOUCLE_art_sous comprueba la presencia de artículos (este bucle no muestra nada). La visualización del título y del enlace de la subsección, solo se realiza si no hay una sección en el interior de la subsección, puesto que esta visualización se coloca en el texto opcional alternativo. En efecto, no sería necesario mostrar las secciones del juego colocado directamente en una sección.

Nuestra página de inicio está completa. No terminada sin embargo (en los artículos siguientes completaremos aún más sus posibilidades), pero sí completa:

-  se presenta la estructura temática del sitio por grandes secciones de tipo de juegos;
-  las pruebas (test) recientes (las cuales consideramos - y es una elección editorial - que constituyen el elemento más importante del sitio) se muestran de manera muy visible;
-  utilizamos la indicación de las máquinas;
-  utilizamos los «tipos de artículos» (las novedades, previsionados, pruebas, soluciones, trucos se presentan separadamente);
-  se utiliza la nota de los juegos, así como las fechas de las salidas...

Todo eso, destaquémoslo, sin utilizar la menor línea de código PHP, y sin modificar la estructura de la base de datos. Ni siquiera desviamos algunas indicaciones de los artículos para llegar (se habría podido por ejemplo decidir que el antetítulo de los artículos se utilizaría para indicar la máquina, y el subtítulo para indicar la nota; así habríamos podido mostrar esta información).

Autor o autora juanabsierra Publicado el: Actualizado: 26/10/12

Traducciones: عربي, català, Español, français, italiano